HighContrast: Keep spinbuttons from resizing on hover

2 files changed, 30 insertions, 15 deletions

diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index 4ca0a81a2a..58a198407d 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -624,22 +624,23 @@ button:link, button:visited {
 
 spinbutton {
   button {
-    @include entry(normal);
     background-image: none;
-    border-width: 0 0 0 1px;
     border-color: transparentize($borders_color,0.7);
     color: mix($fg_color,$base_color,95%);
     border-radius: 0;
-  //  padding-left: 6px;
-  //  padding-right: 6px;
-    &:dir(rtl) { border-width: 0 1px 0 0; }
+    &:dir(ltr) { border-style: none none none solid; }
+    &:dir(rtl) { border-style: none solid none none; }
     &:hover {
       color: $fg_color;
       background-color: transparentize(black,0.95);
+      &:dir(ltr) { border-style: none none none solid; }
+      &:dir(rtl) { border-style: none solid none none; }
     }
     &:disabled {
       box-shadow: none;
       color: transparentize($insensitive_fg_color,0.7);
+      &:dir(ltr) { border-style: none none none solid; }
+      &:dir(rtl) { border-style: none solid none none; }
     }
     &:active {
       box-shadow: inset 0 2px 3px -1px transparentize(black,0.8);
@@ -649,12 +650,15 @@ spinbutton {
       border-color: transparentize($backdrop_borders_color,0.7);
       background-color: $bg_color;
       box-shadow: none;
+      &:dir(ltr) { border-style: none none none solid; }
+      &:dir(rtl) { border-style: none solid none none; }
     }
     &:backdrop:disabled {
       box-shadow: none;
       color: transparentize($insensitive_fg_color,0.7);
-      border-width: 0 0 0 1px; // It is needed or it gets overridden
       &:dir(rtl) { border-width: 0 1px 0 0; }
+      &:dir(ltr) { border-style: none none none solid; }
+      &:dir(rtl) { border-style: none solid none none; }
     }
   }
   &.vertical {
diff --git a/gtk/theme/HighContrast/gtk.css b/gtk/theme/HighContrast/gtk.css
index 6bd6c43bd1..531421bc5c 100644
--- a/gtk/theme/HighContrast/gtk.css
+++ b/gtk/theme/HighContrast/gtk.css
@@ -758,24 +758,28 @@ spinbutton {
    * }
    */ }
   spinbutton button {
-    background-color: transparent;
-    border-style: solid;
-    background-image: linear-gradient(to bottom, #f7f7f7, #fff 90%);
-    border-color: gray;
-    box-shadow: inset 0 2px 2px -2px gray;
     background-image: none;
-    border-width: 0 0 0 1px;
     border-color: rgba(128, 128, 128, 0.3);
     color: #0d0d0d;
     border-radius: 0; }
+    spinbutton button:dir(ltr) {
+      border-style: none none none solid; }
     spinbutton button:dir(rtl) {
-      border-width: 0 1px 0 0; }
+      border-style: none solid none none; }
     spinbutton button:hover {
       color: #000;
       background-color: rgba(0, 0, 0, 0.05); }
+      spinbutton button:hover:dir(ltr) {
+        border-style: none none none solid; }
+      spinbutton button:hover:dir(rtl) {
+        border-style: none solid none none; }
     spinbutton button:disabled {
       box-shadow: none;
       color: rgba(128, 128, 128, 0.3); }
+      spinbutton button:disabled:dir(ltr) {
+        border-style: none none none solid; }
+      spinbutton button:disabled:dir(rtl) {
+        border-style: none solid none none; }
     spinbutton button:active {
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
       background-color: rgba(0, 0, 0, 0.1); }
@@ -783,12 +787,19 @@ spinbutton {
       border-color: rgba(141, 141, 141, 0.3);
       background-color: #fff;
       box-shadow: none; }
+      spinbutton button:backdrop:dir(ltr) {
+        border-style: none none none solid; }
+      spinbutton button:backdrop:dir(rtl) {
+        border-style: none solid none none; }
     spinbutton button:backdrop:disabled {
       box-shadow: none;
-      color: rgba(128, 128, 128, 0.3);
-      border-width: 0 0 0 1px; }
+      color: rgba(128, 128, 128, 0.3); }
       spinbutton button:backdrop:disabled:dir(rtl) {
         border-width: 0 1px 0 0; }
+      spinbutton button:backdrop:disabled:dir(ltr) {
+        border-style: none none none solid; }
+      spinbutton button:backdrop:disabled:dir(rtl) {
+        border-style: none solid none none; }
   spinbutton.vertical button:first-child {
     border-width: 2px;
     border-style: solid;