[gtk+] HighContrast: GtkListBox fixes



commit f7d5d83dd01033ced59e7d5cc6f7c0a413815dfb
Author: Jakub Steiner <jimmac gmail com>
Date:   Thu Aug 27 11:08:23 2015 +0200

    HighContrast: GtkListBox fixes
    
    Make flat buttons in list-rows work.

 gtk/theme/HighContrast/_common.scss |   83 ++++++++--------------------
 gtk/theme/HighContrast/gtk.css      |  104 +++++------------------------------
 2 files changed, 38 insertions(+), 149 deletions(-)
---
diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index f59b405..c5a6710 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -1927,6 +1927,7 @@ GtkScrolledWindow {
   padding: 2px;
 }
 
+
 .list-row.activatable,
 .list-row.activatable:backdrop,
 .list-row.activatable:backdrop:active,
@@ -1942,76 +1943,40 @@ GtkScrolledWindow {
   border-style: none; // I need no borders here
   border-radius: 0;   // and no rounded corners
   box-shadow: none;   // and no box-shadow
-
-}
-
-.list-row.activatable {
-  @extend %undecorated_button;
-  background-color: transparentize($base_color,1); // for the transition
-  border-style: none; // I need no borders here
-  border-radius: 0;   // and no rounded corners
-  box-shadow: none;   // and no box-shadow
-  &:hover {
-    background-color: mix($fg_color, $base_color, 5%);
-  }
-  &:active {
-    box-shadow: inset 0 2px 2px -2px transparentize(black, 0.8);
-  }
-  &:selected {
-    background-color: $selected_bg_color;
-    &:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
-    &:hover {
-      background-color: mix($fg_color, $selected_bg_color, 10%);
-    }
-    &:backdrop { background-color: $borders_color; }
-  }
 }
 
-.list-row:selected {
-  @extend %selected_items;
-  .button {
-    @include button(normal, $edge:none);
-    border-color: $selected_borders_color;
-    &.flat {
-      @include button(undecorated, $edge:none);
-      color: $selected_fg_color;
-    }
+.list-row {
+  &.activatable {
+    color: $fg_color;
     &:hover {
-      @include button(hover, $edge:none);
-      border-color: $selected_borders_color;
+      background-color: mix($fg_color, $base_color, 5%);
     }
-    &:active, &:checked {
-      @include button(active, $edge:none);
-      border-color: $selected_borders_color;
+    &:active {
+      box-shadow: inset 0 2px 2px -2px transparentize(black, 0.8);
     }
-    &:backdrop, &.flat:backdrop {
-      @include button(backdrop, $edge:none);
-      border-color: $selected_borders_color;
-      &:active, &:checked {
-        @include button(backdrop-active, $edge:none);
-        border-color: $selected_borders_color;
+    &:selected {
+      @extend %selected_items;
+      background-color: $selected_bg_color;
+      color: $selected_fg_color;
+      &:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
+      &:hover {
+        background-color: mix($fg_color, $selected_bg_color, 10%);
       }
-      &:insensitive {
-        @include button(backdrop-insensitive, $edge:none);
-        border-color: $selected_borders_color;
-        &:active, &:checked {
-          @include button(backdrop-insensitive-active, $edge:none);
-          border-color: $selected_borders_color;
-        }
+      &:backdrop { background-color: $borders_color; }
+      .button.flat { 
+        color: $selected_fg_color;
+        &:hover { color: $fg_color; }
+        &:active { color: $selected_fg_color; }
       }
     }
-    &.flat:backdrop {
-      @include button(undecorated);
-      color: $backdrop_base_color;
-    }
-    &:insensitive {
-      @include button(insensitive, $edge:none);
-      border-color: $selected_borders_color;
-      &:active, &:checked { @include button(insensitive-active, $edge:none); }
-    }
+  }
+  .button.flat {
+    color: $fg_color;
+    &:active { color: $selected_fg_color; }
   }
 }
 
+
 // transition
 .list-row, .list-row.activatable {
   transition: all 300ms $ease-out-quad;
diff --git a/gtk/theme/HighContrast/gtk.css b/gtk/theme/HighContrast/gtk.css
index 6b8dc10..ffbd863 100644
--- a/gtk/theme/HighContrast/gtk.css
+++ b/gtk/theme/HighContrast/gtk.css
@@ -2066,11 +2066,11 @@ GtkLevelBar.vertical {
     .level-bar.fill-block.empty-fill-block:backdrop {
       border-color: rgba(0, 0, 0, 0.15); }
 
-.view:selected, GtkCalendar:selected, .view:selected:focus, GtkCalendar:focus:selected, 
.view:selected:hover, GtkCalendar:hover:selected, .label:selected, .label:selected:focus, 
.label:selected:hover, .label:backdrop:selected, .entry:selected, .entry:selected:focus, 
.menuitem.button.flat:hover, .menuitem.button.flat:selected, .list-row:selected, .sidebar:selected, 
GtkPlacesSidebar.sidebar .view:selected, GtkPlacesSidebar.sidebar GtkCalendar:selected {
+.view:selected, GtkCalendar:selected, .view:selected:focus, GtkCalendar:focus:selected, 
.view:selected:hover, GtkCalendar:hover:selected, .label:selected, .label:selected:focus, 
.label:selected:hover, .label:backdrop:selected, .entry:selected, .entry:selected:focus, 
.menuitem.button.flat:hover, .menuitem.button.flat:selected, .list-row.activatable:selected, 
.sidebar:selected, GtkPlacesSidebar.sidebar .view:selected, GtkPlacesSidebar.sidebar GtkCalendar:selected {
   background-color: #000;
   color: #fff;
   outline-color: rgba(255, 255, 255, 0.3); }
-  .view:backdrop:selected, GtkCalendar:backdrop:selected, GtkCalendar:backdrop:focus:selected, 
GtkCalendar:backdrop:hover:selected, .label:backdrop:selected, .entry:backdrop:selected, 
.menuitem.button.flat:backdrop:hover, .menuitem.button.flat:backdrop:selected, .list-row:backdrop:selected, 
.sidebar:backdrop:selected, GtkPlacesSidebar.sidebar .view:backdrop:selected, GtkPlacesSidebar.sidebar 
GtkCalendar:backdrop:selected {
+  .view:backdrop:selected, GtkCalendar:backdrop:selected, GtkCalendar:backdrop:focus:selected, 
GtkCalendar:backdrop:hover:selected, .label:backdrop:selected, .entry:backdrop:selected, 
.menuitem.button.flat:backdrop:hover, .menuitem.button.flat:backdrop:selected, 
.list-row.activatable:backdrop:selected, .sidebar:backdrop:selected, GtkPlacesSidebar.sidebar 
.view:backdrop:selected, GtkPlacesSidebar.sidebar GtkCalendar:backdrop:selected {
     background-color: #7f7f7f;
     color: #fff; }
 
@@ -2128,106 +2128,30 @@ GtkPlacesSidebar.sidebar .view .separator:backdrop {
   box-shadow: none; }
 
 .list-row.activatable {
-  background-color: rgba(255, 255, 255, 0);
-  border-style: none;
-  border-radius: 0;
-  box-shadow: none; }
+  color: #000; }
   .list-row.activatable:hover {
     background-color: #f2f2f2; }
   .list-row.activatable:active {
     box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
   .list-row.activatable:selected {
-    background-color: #000; }
+    background-color: #000;
+    color: #fff; }
     .list-row.activatable:selected:active {
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
     .list-row.activatable:selected:hover {
       background-color: black; }
     .list-row.activatable:selected:backdrop {
       background-color: #7f7f7f; }
-
-.list-row:selected .button {
-  border-width: 2px;
-  border-style: solid;
-  color: #000;
-  background-image: none;
-  background-color: #fff;
-  border-color: #7f7f7f;
-  border-color: #000; }
-  .list-row:selected .button.flat {
-    border-width: 2px;
-    border-style: solid;
-    color: #fff; }
-  .list-row:selected .button:hover {
-    border-width: 2px;
-    border-style: solid;
-    color: #000;
-    background-color: #fff;
-    border-color: #7f7f7f;
-    background-image: none;
-    border-color: #000; }
-  .list-row:selected .button:active, .list-row:selected .button:checked {
-    border-width: 2px;
-    border-style: solid;
-    background-image: none;
-    color: white;
-    background-color: black;
-    border-color: #7f7f7f;
-    border-color: #000; }
-  .list-row:selected .button:backdrop, .list-row:selected .button.flat:backdrop {
-    border-width: 2px;
-    border-style: solid;
-    color: #000;
-    background-color: #fff;
-    border-color: #8b8b8b;
-    background-image: none;
-    text-shadow: none;
-    icon-shadow: none;
-    border-color: #000; }
-    .list-row:selected .button:backdrop:active, .list-row:selected .button:backdrop:checked, 
.list-row:selected .button.flat:backdrop:active, .list-row:selected .button.flat:backdrop:checked {
-      border-width: 2px;
-      border-style: solid;
-      color: white;
-      background-color: #8b8b8b;
-      border-color: #8b8b8b;
-      background-image: none;
-      border-color: #000; }
-    .list-row:selected .button:backdrop:insensitive, .list-row:selected .button.flat:backdrop:insensitive {
-      border-width: 2px;
-      border-style: solid;
-      color: #7f7f7f;
-      background-color: white;
-      border-color: #8b8b8b;
-      background-image: none;
-      border-color: #000; }
-      .list-row:selected .button:backdrop:insensitive:active, .list-row:selected 
.button:backdrop:insensitive:checked, .list-row:selected .button.flat:backdrop:insensitive:active, 
.list-row:selected .button.flat:backdrop:insensitive:checked {
-        border-width: 2px;
-        border-style: solid;
-        color: #7f7f7f;
-        border-color: #8b8b8b;
-        background-image: none;
-        background-color: whitesmoke;
-        border-color: #000; }
-  .list-row:selected .button.flat:backdrop {
-    border-width: 2px;
-    border-style: solid;
+    .list-row.activatable:selected .button.flat {
+      color: #fff; }
+      .list-row.activatable:selected .button.flat:hover {
+        color: #000; }
+      .list-row.activatable:selected .button.flat:active {
+        color: #fff; }
+.list-row .button.flat {
+  color: #000; }
+  .list-row .button.flat:active {
     color: #fff; }
-  .list-row:selected .button:insensitive {
-    border-width: 2px;
-    border-style: solid;
-    color: #7f7f7f;
-    background-color: white;
-    border-color: #7f7f7f;
-    background-image: none;
-    text-shadow: none;
-    icon-shadow: none;
-    border-color: #000; }
-    .list-row:selected .button:insensitive:active, .list-row:selected .button:insensitive:checked {
-      border-width: 2px;
-      border-style: solid;
-      color: #7f7f7f;
-      border-color: #7f7f7f;
-      background-image: none;
-      background-color: white; }
 
 .list-row, .list-row.activatable {
   transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]