1 files changed, 12 insertions, 12 deletions

diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index 795cf13cc0..99b0e1a5e3 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -2364,9 +2364,9 @@ infobar {
  * Color Chooser *
  *****************/
 
-GtkColorSwatch {
-  // This widget is made of two boxes one on top of the other, the lower box is GtkColorSwatch {} the other one
-  // is GtkColorSwatch > .overlay {}, GtkColorSwatch has the programmatically set background, so most of the style
+colorswatch {
+  // This widget is made of two boxes one on top of the other, the lower box is colorswatch {} the other one
+  // is colorswatch overlay{}, GtkColorSwatch has the programmatically set background, so most of the style
   // is applied to the overlay box.
 
   $_colorswatch_shadow: inset 0 1px transparentize(black, 0.9), _widget_edge();
@@ -2376,7 +2376,7 @@ GtkColorSwatch {
   // take care of colorswatches on selected elements
   :selected & {
     box-shadow: none;
-    &.overlay, &.overlay:hover {
+    & overlay, & overlay:hover {
       border-color: $selected_fg_color;
     }
   }
@@ -2394,15 +2394,15 @@ GtkColorSwatch {
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
   }
-  &.left, &:first-child:not(.overlay), &:first-child:not(.top) > .overlay {
+  &.left, &:first-child:not(overlay), &:first-child:not(.top) > .overlay {
     border-top-left-radius: 5px;
     border-bottom-left-radius: 5px;
   }
-  &.right, &:last-child:not(.overlay), &:last-child:not(.bottom) > .overlay {
+  &.right, &:last-child:not(overlay), &:last-child:not(.bottom) > .overlay {
     border-top-right-radius: 5px;
     border-bottom-right-radius: 5px;
   }
-  &:only-child:not(.overlay), &:only-child > .overlay { border-radius: 5px; }
+  &:only-child:not(overlay), &:only-child > overlay { border-radius: 5px; }
   // nth-child is used for the custom colors row.
   // the :not() madness is needed since actually the overlay is selectable by GtkColorSwatch > .overlay
   // and GtkColorSwatch.overlay, I know it's weird, but this is gtk+.
@@ -2432,20 +2432,20 @@ GtkColorSwatch {
   }
 
   // indicator and keynav outline colors, color-dark is a color with luminosity lower then 50%
-  &.color-dark {
+  &.dark {
     color: white;
     outline-color: transparentize(black, 0.7);
     &:backdrop { color: transparentize(white, 0.7); }
   }
-  &.color-light {
+  &.light {
     color: black;
     outline-color: transparentize(white, 0.5);
     &:backdrop { color: transparentize(black, 0.7); }
   }
 
   // border color
-  &.overlay,
-  &.overlay:selected {
+  & overlay,
+  & overlay:selected {
     border: 1px solid $borders_color;
     &:hover { border-color: black; }
   }
@@ -2462,7 +2462,7 @@ GtkColorSwatch {
       border-width: 1px;
       color: $insensitive_fg_color; 
     }
-    .overlay { 
+    overlay { 
       @include button(undecorated);
       border-width: 0; } // reset the overlay to not 
                          // cover the button style underneat