Merge branch 'master' of github.com:horst3180/arc-theme

8 files changed, 369 insertions, 187 deletions

diff --git a/common/gtk-3.0/3.20/sass/_applications.scss b/common/gtk-3.0/3.20/sass/_applications.scss
index b1a81b4..7f1012d 100644
--- a/common/gtk-3.0/3.20/sass/_applications.scss
+++ b/common/gtk-3.0/3.20/sass/_applications.scss
@@ -7,9 +7,10 @@ terminal-window notebook {
 }
 
 //
-// GNOME Terminal
+// GNOME Terminal, MATE Terminal
 //
-terminal-window {
+terminal-window,
+.mate-terminal {
 
   notebook {
     > header.top {
@@ -35,7 +36,7 @@ terminal-window {
 }
 
 .nautilus-desktop.nautilus-canvas-item {
-  color: $selected_fg_color;
+  color: white;
   text-shadow: 1px 1px transparentize(black, 0.4);
 
   &:active { color: $fg_color; }
@@ -104,6 +105,21 @@ $disk_space_free: darken($bg_color, 3%);
   animation-iteration-count: 3;
 }
 
+// Batch renaming dialog
+.conflict-row.activatable {
+  &, &:active {
+    color: $error_fg_color;
+    background-color: $error_color;
+  }
+
+  &:hover { background-color: lighten($error_color, 10%); }
+
+  &:selected {
+    color: $selected_fg_color;
+    background-color: $selected_bg_color;
+  }
+}
+
 //
 // Nemo
 //
@@ -250,8 +266,27 @@ $disk_space_free: darken($bg_color, 3%);
 }
 
 //
+// Pluma
+//
+
+.pluma-window statusbar frame > border { border: none; }
+
+.pluma-window notebook > stack scrolledwindow { border-width: 0 0 1px 0; }
+
+#pluma-status-combo-button {
+  min-height: 0;
+  padding: 0;
+
+  border-top: none;
+  border-bottom: none;
+  border-radius: 0;
+}
+
+//
 // Gnome Builder
 //
+// TODO: Merge this with the upstream stylesheet
+
 .gb-search-entry-occurrences-tag { background: none; }
 
 workbench.csd > stack.titlebar:not(headerbar) {
@@ -286,6 +321,8 @@ pillbox {
   color: $selected_fg_color;
   background-color: $selected_bg_color;
   border-radius: 3px;
+
+  &:disabled label { color: transparentize($selected_fg_color, 0.5) }
 }
 
 docktabstrip {
@@ -332,6 +369,63 @@ dockoverlayedge {
   }
 }
 
+popover.messagepopover {
+  &.background { padding: 0; }
+
+  .popover-content-area { margin: 16px; }
+  .popover-action-area {
+    margin: 8px;
+
+    button:not(:first-child):not(:last-child) { margin: 0 4px; }
+  }
+}
+
+popover.popover-selector {
+  padding: 0;
+
+  list {
+    row { padding: 5px 0; }
+    row image { margin-left: 3px; margin-right: 10px; }
+  }
+}
+
+entry.search.preferences-search {
+  border: none;
+  border-right: 1px solid $borders_color;
+  border-bottom: 1px solid $borders_color;
+  border-radius: 0;
+}
+
+preferences stacksidebar.sidebar {
+  list { background-image: _solid($base_color); }
+
+  list separator { background-color: transparent; }
+}
+
+devhelppanel entry:focus,
+symboltreepanel entry:focus {
+  border-color: $borders_color
+}
+
+button.run-arrow-button {
+  min-width: 12px;
+}
+
+omnibar.linked > entry:not(:only-child) { border-style: solid; border-radius: 3px; margin-left: 1px; margin-right: 1px; }
+
+gstyleslidein {
+  #scale_box,
+  #strings_controls,
+  #palette_controls,
+  #components_controls {
+    button.toggle:checked { color: $fg_color; }
+  }
+}
+
+configurationview {
+  entry.flat { background: none; }
+  list { border-width: 0; }
+}
 
 //
 // Epiphany
@@ -416,12 +510,82 @@ button.documents-favorite:active:hover {
 }
 
 //
+// Gnome Flashback
+//
+#gf-bubble,
+#gf-osd-window,
+#gf-input-source-popup,
+#gf-candidate-popup {
+  &, &.solid {
+    color: lighten($osd_fg_color, 7%);
+    background-color: $osd_bg_color;
+    border: 1px solid darken($osd_bg_color, 8%);
+    border-radius: 2px;
+  }
+
+  levelbar {
+    block {
+      &.low, &.high, &.full {
+        background-color: $selected_bg_color;
+        border-color: $selected_bg_color;
+      }
+      &.empty { background-color: darken($osd_bg_color, 5%); }
+    }
+    trough { background: none; }
+  }
+
+  // FIXME still needs button styling
+}
+
+#gf-input-source {
+  min-height: 32px;
+  min-width: 40px;
+
+  &:selected {
+    color: $selected_fg_color;
+    background-color: $selected_bg_color;
+    border-radius: 2px;
+  }
+}
+
+gf-candidate-box {
+  label { padding: 3px; }
+
+  &:hover,
+  &:selected {
+    color: $selected_fg_color;
+    background-color: $selected_bg_color;
+    border-radius: 2px;
+  }
+}
+
+//
+// Mate OSD Window
+//
+MsdOsdWindow.background.osd {
+  border-radius: 2px;
+  border: 1px solid darken($osd_bg_color, 8%);
+
+  .progressbar {
+    background-color: $selected_bg_color;
+    border: none;
+    border-color: red;
+    border-radius: 5px;
+  }
+  .trough {
+    background-color: darken($osd_bg_color, 5%);
+    border: none;
+    border-radius: 5px;
+  }
+}
+
+//
 // Mate/Gnome Flashback Panel
 //
-.gnome-panel-menu-bar,
-.mate-panel-menu-bar {
+.mate-panel-menu-bar,
+panel-toplevel.background {
 
-  &, menubar { background-color: $panel_bg; }
+  &, menubar { background-color: opacify($panel_bg, 1); }
 
   menubar,
   #PanelApplet label,
@@ -479,7 +643,7 @@ button.documents-favorite:active:hover {
   }
 
   &:checked {
-    color: $selected_fg_color;
+    color: white;
     background-color: transparentize(black, 0.75);
     box-shadow: inset 0 -2px $selected_bg_color;
   }
@@ -499,6 +663,8 @@ button.documents-favorite:active:hover {
     color: $selected_fg_color;
     border: none;
     background-color: $selected_bg_color;
+
+    label, image { color: inherit; }
   }
 }
 
@@ -572,7 +738,7 @@ button.documents-favorite:active:hover {
     border: 1px solid rgba(0, 0, 0, 0.35);
     border-radius: 3px;
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-    background-image: linear-gradient(to bottom, white);
+    background-image: _solid(white);
     background-color: transparent;
 
   .title, .label {
diff --git a/common/gtk-3.0/3.20/sass/_colors.scss b/common/gtk-3.0/3.20/sass/_colors.scss
index 1da5bcf..8d3a5f2 100644
--- a/common/gtk-3.0/3.20/sass/_colors.scss
+++ b/common/gtk-3.0/3.20/sass/_colors.scss
@@ -2,13 +2,13 @@
 // it gets @if ed depending on $variant
 
 
-$base_color: if($variant =='light', #fdf6e3, #073642);
-$text_color: if($variant == 'light', #5c616c, #657b83);
-$bg_color: if($variant =='light', #F5F6F7, #002b36);
-$fg_color: if($variant =='light', #5c616c, #657b83);
+$base_color: if($variant =='light', #ffffff, #404552);
+$text_color: if($variant == 'light', #5c616c, #D3DAE3);
+$bg_color: if($variant =='light', #F5F6F7, #383C4A);
+$fg_color: if($variant =='light', #5c616c, #D3DAE3);
 
-$selected_fg_color: #fdf6e3;
-$selected_bg_color: #268bd2;
+$selected_fg_color: #ffffff;
+$selected_bg_color: #5294e2;
 $selected_borders_color: darken($selected_bg_color, 20%);
 $borders_color: if($variant =='light', darken($bg_color,9%), darken($bg_color,6%));
 
@@ -18,33 +18,38 @@ $link_visited_color: if($variant == 'light', darken($selected_bg_color,20%),
                                      lighten($selected_bg_color,10%));
 
 $selection_mode_bg: if($transparency == 'true', transparentize($selected_bg_color, 0.05), $selected_bg_color);
-$warning_color: #cb4b16;
-$error_color: #dc322f;
-$success_color: #859900;
-$destructive_color: #dc322f;
-$suggested_color: #2aa198;
-
-$drop_target_color: #b58900;
+$selection_mode_fg: $selected_fg_color;
+$warning_color: #F27835;
+$error_color: #FC4138;
+$warning_fg_color: white;
+$error_fg_color: white;
+$success_color: #73d216;
+$destructive_color: #F04A50;
+$suggested_color: #4DADD4;
+$destructive_fg_color: white;
+$suggested_fg_color: white;
+
+$drop_target_color: #F08437;
 
 //insensitive state derived colors
 $insensitive_fg_color: if($variant == 'light', transparentize($fg_color, 0.45), transparentize($fg_color, 0.55));
 $insensitive_bg_color: if($variant == 'light', mix($bg_color, $base_color, 40%), lighten($bg_color, 2%));
 
 $header_bg: red;
-@if $transparency=='true' and $variant=='light' { $header_bg: transparentize(#eee8d5, 0.05); }
-@if $transparency=='false' and $variant=='light' { $header_bg: #eee8d5; }
-@if $transparency=='true' and ($variant=='dark' or $darker=='true') { $header_bg: transparentize(#002b36, 0.03); }
-@if $transparency=='false' and ($variant=='dark' or $darker=='true') { $header_bg: #002b36; }
+@if $transparency=='true' and $variant=='light' { $header_bg: transparentize(#e7e8eb, 0.05); }
+@if $transparency=='false' and $variant=='light' { $header_bg: #e7e8eb; }
+@if $transparency=='true' and ($variant=='dark' or $darker=='true') { $header_bg: transparentize(#2f343f, 0.03); }
+@if $transparency=='false' and ($variant=='dark' or $darker=='true') { $header_bg: #2f343f; }
 
 $header_bg_backdrop: if($darker == 'true' or $variant == 'dark', lighten($header_bg, 1.5%), lighten($header_bg, 3%));
 
 $header_border: if($variant == 'light' and $darker=='false', darken($header_bg, 7%), darken($header_bg, 4%));
 
 $header_fg: if($variant == 'light', saturate(transparentize($fg_color, 0.2), 10%), saturate(transparentize($fg_color, 0.2), 10%));
-$header_fg: if($darker == 'true', saturate(transparentize(#657b83, 0.2), 10%), $header_fg);
+$header_fg: if($darker == 'true', saturate(transparentize(#D3DAE3, 0.2), 10%), $header_fg);
 
-$dark_sidebar_bg: if($transparency == 'true', transparentize(#073642, 0.05), #073642);
-$dark_sidebar_fg: #657b83;
+$dark_sidebar_bg: if($transparency == 'true', transparentize(#353945, 0.05), #353945);
+$dark_sidebar_fg: #BAC3CF;
 $dark_sidebar_border: if($variant == 'light', $dark_sidebar_bg, darken($dark_sidebar_bg, 5%));
 
 $osd_fg_color: $dark_sidebar_fg;
@@ -64,7 +69,7 @@ $panel_bg: darken($dark_sidebar_bg, 4.7%);
 $panel_fg: $dark_sidebar_fg;
 
 $entry_bg: if($variant=='light', $base_color, lighten($base_color, 0%));
-$entry_border: if($variant == 'light', #657b83, darken($borders_color, 0%));
+$entry_border: if($variant == 'light', #cfd6e6, darken($borders_color, 0%));
 
 $header_entry_bg: if($darker == 'true' or $variant == 'dark', transparentize(lighten($header_bg, 22%), 0.6), transparentize($base_color, 0.1));
 $header_entry_border: if($darker == 'true' or $variant == 'dark', transparentize(darken($header_bg, 12%), 0.6), transparentize($header_fg, 0.7));
@@ -78,19 +83,19 @@ $header_button_border: if($darker == 'true' or $variant == 'dark', transparentiz
 //WM Buttons
 
 // Close
-$wm_button_close_bg: if($variant == 'light' and $darker == 'false', #f46067, #dc322f);
-$wm_button_close_hover_bg: if($variant == 'light' and $darker == 'false', #f68086, #cb4b16);
-$wm_button_close_active_bg: if($variant == 'light' and $darker == 'false', #f13039, #dc322f);
+$wm_button_close_bg: if($variant == 'light' and $darker == 'false', #f46067, #cc575d);
+$wm_button_close_hover_bg: if($variant == 'light' and $darker == 'false', #f68086, #d7787d);
+$wm_button_close_active_bg: if($variant == 'light' and $darker == 'false', #f13039, #be3841);
 
-$wm_icon_close_bg: if($variant == 'light' and $darker == 'false',#F8F8F9 , #002b36);
+$wm_icon_close_bg: if($variant == 'light' and $darker == 'false',#F8F8F9 , #2f343f);
 
 // Minimize, Maximize
-$wm_button_hover_bg: if($variant == 'light' and $darker == 'false', #fdfdfd, #657b83);
+$wm_button_hover_bg: if($variant == 'light' and $darker == 'false', #fdfdfd, #454C5C);
 $wm_button_active_bg: $selected_bg_color;
 
-$wm_button_hover_border: if($variant == 'light' and $darker == 'false', #D1D3DA, #002b36);
+$wm_button_hover_border: if($variant == 'light' and $darker == 'false', #D1D3DA, #262932);
 
-$wm_icon_bg: if($variant == 'light' and $darker == 'false', #90949E, #93a1a1);
-$wm_icon_unfocused_bg: if($variant == 'light' and $darker == 'false', #B6B8C0, #657b83);
-$wm_icon_hover_bg: if($variant == 'light' and $darker == 'false', #7A7F8B, #93a1a1);
+$wm_icon_bg: if($variant == 'light' and $darker == 'false', #90949E, #90939B);
+$wm_icon_unfocused_bg: if($variant == 'light' and $darker == 'false', #B6B8C0, #666A74);
+$wm_icon_hover_bg: if($variant == 'light' and $darker == 'false', #7A7F8B, #C4C7CC);
 $wm_icon_active_bg: $selected_fg_color;
diff --git a/common/gtk-3.0/3.20/sass/_common.scss b/common/gtk-3.0/3.20/sass/_common.scss
index 4f36e35..8b0ec66 100644
--- a/common/gtk-3.0/3.20/sass/_common.scss
+++ b/common/gtk-3.0/3.20/sass/_common.scss
@@ -15,9 +15,6 @@ $darker_asset_suffix: if($darker=='true', '-dark', $asset_suffix);
   -GtkScrolledWindow-scrollbar-spacing: 0;
 
   -GtkToolItemGroup-expander-size: 11;
-  -GtkTreeView-expander-size: 11;
-
-  -GtkTreeView-horizontal-separator: 4;
 
   -GtkWidget-text-handle-width: 20;
   -GtkWidget-text-handle-height: 20;
@@ -26,7 +23,7 @@ $darker_asset_suffix: if($darker=='true', '-dark', $asset_suffix);
   -GtkDialog-action-area-border: 0;
 
   // We use the outline properties to signal the focus properties
-  outline-color: transparentize($fg_color, 0.7);
+  outline-color: gtkalpha(currentColor, 0.3);
   outline-style: dashed;
   outline-offset: -3px;
   outline-width: 1px;
@@ -163,7 +160,6 @@ textview { // This will get overridden by .view, needed by gedit line numbers
   border: none;
   background-color: $osd_bg_color;
   background-clip: padding-box;
-  outline-color: transparentize($osd_fg_color, 0.7);
   box-shadow: none;
 }
 
@@ -232,24 +228,24 @@ entry {
   selection { &:focus, & { @extend %selected_items; }}
 
   // error and warning style
-  @each $e_type, $e_color in (warning, $warning_color),
-                             (error, $error_color),
-                              // entry.search-missing for Gnome-Builder
-                             (search-missing, $error_color) {
+  @each $e_type, $e_color, $e_fg_color in (warning, $warning_color, $warning_fg_color),
+                                          (error, $error_color, $error_fg_color),
+                                          // entry.search-missing for Gnome-Builder
+                                          (search-missing, $error_color, $error_fg_color) {
     &.#{$e_type} {
-      color: $selected_fg_color;
+      color: $e_fg_color;
       border-color: if($variant=='light', $e_color, $entry_border);
-      background-image: linear-gradient(to bottom, mix($e_color, $base_color, 60%));
+      background-color: mix($e_color, $base_color, 60%);
 
-      image { color: $selected_fg_color; }
+      image { color: $e_fg_color; }
 
       &:focus {
-        color: $selected_fg_color;
-        background-image: linear-gradient(to bottom, $e_color);
+        color: $e_fg_color;
+        background-color: $e_color;
         box-shadow: none;
       }
       selection, selection:focus {
-        background-color: $selected_fg_color;
+        background-color: $e_fg_color;
         color: $e_color;
       }
     }
@@ -366,6 +362,8 @@ button {
 
     background-clip: if($variant=='light', border-box, padding-box);
     transition-duration: 50ms;
+
+    &:not(:disabled) label:disabled { color: inherit; opacity: 0.6; }
   }
 
   //Webkitgtk workaround start
@@ -425,7 +423,6 @@ button {
   // big standalone buttons like in Documents pager
   &.osd {
     color: $osd_fg_color;
-    outline-color: transparentize($osd_fg_color, 0.7);
     background-color: $osd_bg_color;
     border-color: darken($osd_bg_color, 8%);
 
@@ -466,21 +463,20 @@ button {
   .osd .linked:not(.vertical):not(.path-bar) > &:hover:not(:checked):not(:active) + &:not(:checked):not(:active) { box-shadow: none; }
 
   // Suggested and Destructive Action buttons
-  @each $b_type, $b_color in (suggested-action, $suggested_color),
-                             (destructive-action, $destructive_color) {
+  @each $b_type, $b_color, $b_fg in (suggested-action, $suggested_color, $suggested_fg_color),
+                                    (destructive-action, $destructive_color, $destructive_fg_color) {
     &.#{$b_type} {
-      @include button(suggested_destructive, $b_color);
+      @include button(suggested_destructive, $b_color, $b_fg);
 
       &.flat {
         @include button(undecorated);
         color: $b_color;
-        outline-color: transparentize($b_color, 0.7);
       }
       &:hover {
-        @include button(suggested_destructive, lighten($b_color, 10%));
+        @include button(suggested_destructive, lighten($b_color, 10%), $b_fg);
       }
       &:active, &:checked {
-        @include button(suggested_destructive, darken($b_color, 10%));
+        @include button(suggested_destructive, darken($b_color, 10%), $b_fg);
       }
       &.flat:disabled {
         @include button(undecorated);
@@ -546,6 +542,10 @@ button {
     }
   }
 
+  // hide separators
+  &.font,
+  &.file { separator { background-color: transparent; }}
+
   //inline-toolbar buttons
   .inline-toolbar &, .inline-toolbar &:backdrop {
     border-radius: 2px;
@@ -628,29 +628,40 @@ toolbar.inline-toolbar toolbutton {
     > #{$_uncolored_button}:hover:not(:only-child),
     > #{$_uncolored_button}:hover + #{$_uncolored_button} { box-shadow: inset if($vert=='false', 1px 0, 0 1px) $b_border; }
 
-    > #{$_uncolored_button}:first-child:hover,
+    > #{$_uncolored_button}:disabled:not(:only-child),
+    > #{$_uncolored_button}:disabled + #{$_uncolored_button}:not(:hover) { box-shadow: inset if($vert=='false', 1px 0, 0 1px) transparentize($b_border, 0.5); }
+
     > button:active + #{$_uncolored_button}:hover,
     > button:checked + #{$_uncolored_button}:hover,
     > button.suggested-action + #{$_uncolored_button}:hover,
     > button.destructive-action + #{$_uncolored_button}:hover,
-    > entry + #{$_uncolored_button}:hover:not(:only-child) { box-shadow: none; }
+    > entry + #{$_uncolored_button}:hover:not(:only-child),
+
+    > #{$_uncolored_button}:first-child:disabled,
+    > #{$_uncolored_button}:disabled + #{$_uncolored_button}:disabled,
+    > #{$_uncolored_button}:first-child:hover,
+    > button:active + #{$_uncolored_button}:disabled,
+    > button:checked + #{$_uncolored_button}:disabled,
+    > button.suggested-action + #{$_uncolored_button}:disabled,
+    > button.destructive-action + #{$_uncolored_button}:disabled,
+    > entry + #{$_uncolored_button}:disabled:not(:only-child), { box-shadow: none; }
   }
 }
 
 // special case, because path-bars are bugged
 @mixin pathbar_linking_rules($sep_color:if($variant=='light', transparentize($button_border, 0.6), transparentize($button_border, 0.5))) {
 
-    > button + button { border-left-style: none; }
+  > button + button { border-left-style: none; }
 
-    > button:hover:not(:checked):not(:active):not(:only-child) {
+  > button:hover:not(:checked):not(:active):not(:only-child) {
 
-      &:hover {
-        box-shadow: inset  1px 0 $sep_color,
-                    inset -1px 0 $sep_color;
-      }
-      &:first-child:hover { box-shadow: inset -1px 0 $sep_color; }
-      &:last-child:hover { box-shadow: inset 1px 0 $sep_color; }
+    &:hover {
+      box-shadow: inset  1px 0 $sep_color,
+                  inset -1px 0 $sep_color;
     }
+    &:first-child:hover { box-shadow: inset -1px 0 $sep_color; }
+    &:last-child:hover { box-shadow: inset 1px 0 $sep_color; }
+  }
 }
 
 // Apply the rules defined above
@@ -798,6 +809,9 @@ spinbutton {
     > button:hover:not(:active),
     > button:hover + button { box-shadow: inset 1px 0 $button_border; }
 
+    > button:disabled + button:not(:disabled):not(:active):not(:checked):not(:hover),
+    > button:not(:disabled):not(:active):not(:checked):not(:hover) + button:disabled { box-shadow: inset 1px 0 transparentize($button_border, 0.5); }
+
     > button:first-child:hover:not(:active),
     > button.up:dir(rtl):hover:not(:active),
     > entry + button:not(:active):hover { box-shadow: none; }
@@ -913,7 +927,7 @@ toolbar {
   }
 }
 
-.primary-toolbar {
+.primary-toolbar:not(.libreoffice-toolbar) {  // LO messes up the toolbar styling, so exclude LO toolbars
   color: $header_fg;
   background-color: opacify($header_bg, 1);
   box-shadow: none;
@@ -1000,14 +1014,14 @@ headerbar,
 
   // Selectionmode
   &.selection-mode {
-    color: $selected_fg_color;
+    color: $selection_mode_fg;
     background-color: $selection_mode_bg;
     border-color: darken($selection_mode_bg, 4%);
     box-shadow: none;
 
     &:backdrop {
       background-color: $selection_mode_bg;
-      color: transparentize($selected_fg_color, 0.4);
+      color: transparentize($selection_mode_fg, 0.4);
     }
 
     .subtitle:link { @extend *:link:selected;  }
@@ -1096,7 +1110,7 @@ headerbar {
     }
   }
 
-  > separator { background-image: linear-gradient(to top, $header_border); }
+  > separator { background-image: _solid($header_border); }
 
   @extend %titlebar;
 }
@@ -1142,19 +1156,19 @@ headerbar {
       background-color: transparent;
     }
 
-    @each $e_type, $e_color in (warning, $warning_color),
-                               (error, $error_color) {
+    @each $e_type, $e_color, $e_fg_color in (warning, $warning_color, $warning_fg_color),
+                                            (error, $error_color, $error_fg_color) {
       &.#{$e_type} {
-        color: $selected_fg_color;
+        color: $e_fg_color;
         border-color: if($darker=='false' and $variant=='light', $e_color, $header_entry_border);
-        background-image: linear-gradient(to bottom, mix($e_color, $header_bg, 60%));
+        background-color: mix($e_color, $header_bg, 60%);
 
         &:focus {
-          color: $selected_fg_color;
-          background-image: linear-gradient(to bottom, $e_color);
+          color: $e_fg_color;
+          background-color: $e_color;
         }
         selection, selection:focus {
-          background-color: $selected_fg_color;
+          background-color: $e_fg_color;
           color: $e_color;
         }
       }
@@ -1181,8 +1195,8 @@ headerbar {
 
     &, &.flat {
       @include button(undecorated);
-      color: $selected_fg_color;
-      background-color: transparentize($selected_fg_color, 1);
+      color: $selection_mode_fg;
+      background-color: transparentize($selection_mode_fg, 1);
     }
     &:hover { @extend %normal_selected_button; }
     &:active, &:checked { @extend %selected-button:active; }
@@ -1212,7 +1226,9 @@ headerbar {
     $_uncolored_button: 'button:not(:checked):not(:active):not(.suggested-action):not(.destructive-action)';
 
     > #{$_uncolored_button}:hover:not(:only-child),
-    > #{$_uncolored_button}:hover + #{$_uncolored_button} { box-shadow: none; }
+    > #{$_uncolored_button}:hover + #{$_uncolored_button},
+    > #{$_uncolored_button}:disabled:not(:only-child),
+    > #{$_uncolored_button}:disabled + #{$_uncolored_button}:not(:hover) { box-shadow: none; }
   }
 
   // special case for path-bars and stack-switchers
@@ -1228,9 +1244,9 @@ headerbar {
 
       &, &:hover, &:active, &:checked, &:disabled { @extend %linked; }
     }
-
     @include pathbar_linking_rules($sep_color:$header_button_border);
   }
+
   // use linking rules for entries only
   .linked:not(.vertical):not(.path-bar) {
     @include linking_rules( $a:0.5,
@@ -1241,21 +1257,20 @@ headerbar {
   }
 
   // Headerbar Suggested and Destructive Action buttons
-  @each $b_type, $b_color in (suggested-action, $suggested_color),
-                             (destructive-action, $destructive_color) {
+  @each $b_type, $b_color, $b_fg in (suggested-action, $suggested_color, $suggested_fg_color),
+                                    (destructive-action, $destructive_color, $destructive_fg_color) {
     button.#{$b_type} {
-      @include button(suggested_destructive, $b_color);
+      @include button(suggested_destructive, $b_color, $b_fg);
 
       &.flat {
         @include button(undecorated);
         color: $b_color;
-        outline-color: transparentize($b_color, 0.7);
       }
       &:hover {
-        @include button(suggested_destructive, lighten($b_color, 10%));
+        @include button(suggested_destructive, lighten($b_color, 10%), $b_fg);
       }
       &:active, &:checked {
-        @include button(suggested_destructive, darken($b_color, 10%));
+        @include button(suggested_destructive, darken($b_color, 10%), $b_fg);
       }
       &.flat:disabled,
       &:disabled { @include button(header-insensitive); }
@@ -1285,6 +1300,9 @@ headerbar {
     > button:hover:not(:active),
     > button:hover + button { box-shadow: inset 1px 0 $header_button_border; }
 
+    > button:disabled + button:not(:disabled):not(:active):not(:checked):not(:hover),
+    > button:not(:disabled):not(:active):not(:checked):not(:hover) + button:disabled { box-shadow: inset 1px 0 $header_button_border; }
+
     > button:first-child:hover:not(:active),
     > entry + button:not(:active):hover { box-shadow: none; }
 
@@ -1409,11 +1427,14 @@ headerbar {
 // Tree Views
 //
 treeview.view {
-  -GtkTreeView-grid-line-width: 1;
-  -GtkTreeView-grid-line-pattern: '';
-  -GtkTreeView-tree-line-width: 1;
-  -GtkTreeView-tree-line-pattern: '';
-  -GtkTreeView-expander-size: 16;
+  @at-root * {
+    -GtkTreeView-horizontal-separator: 4;
+    -GtkTreeView-grid-line-width: 1;
+    -GtkTreeView-grid-line-pattern: '';
+    -GtkTreeView-tree-line-width: 1;
+    -GtkTreeView-tree-line-pattern: '';
+    -GtkTreeView-expander-size: 16;
+  }
 
   border-left-color: transparentize($fg_color, 0.85);   // this is actually the tree lines color,
   border-top-color: transparentize(black, 0.9);         // while this is the grid lines color, better then nothing
@@ -1474,19 +1495,26 @@ treeview.view {
   &.progressbar, &.progressbar:focus { // progress bar in treeviews
     color: $selected_fg_color;
     border-radius: 3px;
-    background-image: linear-gradient(to bottom, $selected_bg_color);
+    background-color: $selected_bg_color;
 
     &:selected, &:selected:focus {
       color: $selected_bg_color;
       box-shadow: none;
-      background-image: linear-gradient(to bottom, $selected_fg_color);
+      background-color: $selected_fg_color;
     }
   }
-  &.trough, &.trough:selected, &.trough:selected:focus { // progress bar trough in treeviews
+  &.trough { // progress bar trough in treeviews
     color: $fg_color;
-    background-image: linear-gradient(to bottom, $button_border);
+    background-color: $button_border;
     border-radius: 3px;
     border-width: 0;
+
+    &:selected, &:selected:focus {
+      color: $selected_fg_color;
+      background-color: transparentize(black, 0.8);
+      border-radius: 3px;
+      border-width: 0;
+    }
   }
 
   header {
@@ -1937,7 +1965,7 @@ scrollbar {
 // Switches
 //
 switch {
-  font: 1;
+  font-size: 1px;
 
   min-width: 52px;
   min-height: 24px;
@@ -2509,28 +2537,25 @@ calendar {
   padding: 2px;
 
   &:selected {
-    background-color: $selected_bg_color;
-    color: $selected_fg_color;
+    @extend %selected_items;
     border-radius: 1.5px;
   }
+
   &.header {
     color: $fg_color;
     border: none;
-    border-radius: 0;
   }
-  &.button, &.button:focus {
+
+  &.button {
+    @extend %undecorated_button;
+
     color: transparentize($fg_color,0.55);
-    @include button(undecorated);
 
-    &:hover {
-      color: $fg_color;
-    }
-    &:disabled {
-      color: $insensitive_fg_color;
-      background-color: transparent;
-      background-image: none;
-    }
+    &:hover { color: $fg_color; }
+
+    &:disabled { color: $insensitive_fg_color; }
   }
+
   &:indeterminate { color: gtkalpha(currentColor,0.55); }
   &.highlight { color: $fg_color; }
 }
@@ -2681,7 +2706,7 @@ placessidebar {
     &.sidebar-placeholder-row {
       padding: 0 8px;
       min-height: 2px;
-      background-image: linear-gradient(to top, $drop_target_color);
+      background-image: _solid($drop_target_color);
       background-clip: content-box;
     }
 
@@ -2731,16 +2756,16 @@ paned {
     -gtk-icon-source: none;
     border-style: none;
     background-color: transparent;
-    background-image: linear-gradient(to top, $borders_color);
+    background-image: _solid($borders_color);
     background-size: 1px 1px;
 
-    &:selected { background-image: linear-gradient(to top, $selected_bg_color); }
+    &:selected { background-image: _solid($selected_bg_color); }
 
     &.wide {
       min-width: 5px;
       min-height: 5px;
       background-color: $bg_color;
-      background-image: linear-gradient(to top, $borders_color), linear-gradient(to top, $borders_color);
+      background-image: _solid($borders_color), _solid($borders_color);
       background-size: 1px 1px, 1px 1px;
     }
   }
@@ -2784,28 +2809,28 @@ paned {
 //
 // GtkInfoBar
 //
-infobar { border-style: none; }
+infobar {
+  border-style: none;
 
-.info,
-.question,
-.warning,
-.error {
-  background-color: $selected_bg_color;
-  color: $selected_fg_color;
+  &.info,
+  &.question,
+  &.warning,
+  &.error {
+    background-color: $selected_bg_color;
+    color: $selected_fg_color;
+    caret-color: currentColor;
 
-  button { @extend %selected-button }
+    button { @extend %selected-button }
 
-  label:selected {
-    &:focus, &:hover, & {
+    selection {
       color: $selected_bg_color;
       background-color: $selected_fg_color;
     }
-  }
 
-  *:link { @extend %link_selected; }
+    *:link { @extend %link_selected; }
+  }
 }
 
-
 //
 // Buttons on selected backgrounds
 //
@@ -2813,7 +2838,6 @@ infobar { border-style: none; }
 
   @at-root %normal_selected_button, & {
     color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
     background-color: transparentize($selected_fg_color, 1);
     border-color: transparentize($selected_fg_color, 0.5);
   }
@@ -2829,13 +2853,11 @@ infobar { border-style: none; }
   }
   &:hover {
     color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
     background-color: transparentize($selected_fg_color, 0.8);
     border-color: transparentize($selected_fg_color, 0.2);
   }
   &:active, &:active:hover, &:checked {
     color: $selected_bg_color;
-    outline-color: transparentize($selected_bg_color, 0.7);
     background-color: $selected_fg_color;
     border-color: $selected_fg_color;
   }
@@ -2997,7 +3019,7 @@ colorchooser .popover.osd { border-radius: 3px; }
 
 // Decouple the font of context menus from their entry/textview
 .context-menu { font: initial; }
-.monospace { font: Monospace; }
+.monospace { font-family: Monospace; }
 
 //
 // Shortcuts Help
@@ -3151,7 +3173,6 @@ headerbar,
 
   @at-root %nobg_selected_items, & {
     color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
 
     &:disabled { color: mix($selected_fg_color, $selected_bg_color, 50%); }
   }
diff --git a/common/gtk-3.0/3.20/sass/_drawing.scss b/common/gtk-3.0/3.20/sass/_drawing.scss
index 942e1fd..120a158 100644
--- a/common/gtk-3.0/3.20/sass/_drawing.scss
+++ b/common/gtk-3.0/3.20/sass/_drawing.scss
@@ -1,5 +1,10 @@
 // Drawing mixins
 
+// Solid color image
+@function _solid($c) {
+  @return linear-gradient(to bottom, $c, $c);
+}
+
 // Entries
 
 @mixin entry($t) {
@@ -16,7 +21,6 @@
     color: $text_color;
     border-color: $entry_border;
     background-color: $entry_bg;
-    background-image: linear-gradient(to bottom, $entry_bg);
   }
 
   @if $t==focus {
@@ -26,7 +30,6 @@
     color: $text_color;
     border-color: if($variant=='light', $selected_bg_color, $button_border);
     background-color: $entry_bg;
-    background-image: linear-gradient(to bottom, $entry_bg);
 
     @if $variant == 'dark' {
       box-shadow: inset 1px 0 $selected_bg_color,
@@ -43,7 +46,6 @@
     color: $insensitive_fg_color;
     border-color: transparentize($entry_border, 0.45);
     background-color: transparentize($entry_bg, 0.45);
-    background-image: linear-gradient(to bottom, transparentize($entry_bg, 0.45));
   }
 
   @if $t==header-normal {
@@ -53,8 +55,7 @@
 
     color: $header_fg;
     border-color: $header_entry_border;
-    background-image: linear-gradient(to bottom, $header_entry_bg);
-    background-color: transparent;
+    background-color: $header_entry_bg;
 
     image, image:hover { color: inherit; }
   }
@@ -65,7 +66,7 @@
   //
     color: $selected_fg_color;
     border-color: if($darker=='false' and $variant=='light', $selected_bg_color, transparent);
-    background-image: linear-gradient(to bottom, $selected_bg_color);
+    background-color: $selected_bg_color;
   }
 
   @if $t==header-insensitive {
@@ -73,7 +74,8 @@
   // insensitive header-bar entry
   //
     color: transparentize($header_fg, 0.45);
-    background-image: linear-gradient(to bottom, transparentize($header_entry_bg, 0.15));
+    border-color: $header_entry_border;
+    background-color: transparentize($header_entry_bg, 0.15);
   }
 
   @else if $t==osd {
@@ -82,8 +84,7 @@
   //
     color: $osd_fg_color;
     border-color: $osd_entry_border;
-    background-image: linear-gradient(to bottom, $osd_entry_bg);
-    background-color: transparent;
+    background-color: $osd_entry_bg;
 
     image, image:hover { color: inherit; }
   }
@@ -94,7 +95,7 @@
   //
     color: $selected_fg_color;
     border-color: $osd_entry_border;
-    background-image: linear-gradient(to bottom, $selected_bg_color);
+    background-color: $selected_bg_color;
   }
 
   @else if $t==osd-insensitive {
@@ -102,25 +103,24 @@
   // insensitive osd entry
   //
     color: transparentize($osd_fg_color, 0.45);
-    background-image: linear-gradient(to bottom, transparentize($osd_entry_bg, 0.15));
+    background-color: transparentize($osd_entry_bg, 0.15);
   }
 }
 
 // Buttons
 
-@mixin button($t, $actionb_color:red) {
+@mixin button($t, $actionb_bg:red, $actionb_fg: green) {
 //
 // Button drawing function
 //
 // $t:    button type,
-// $actionb_color: used for destructive and suggested action buttons
+// $actionb_bg, $actionb_fg: used for destructive and suggested action buttons
 
   @if $t==normal {
   //
   // normal button
   //
     color: $fg_color;
-    outline-color: transparentize($fg_color, 0.7);
     border-color: $button_border;
     background-color: $button_bg;
   }
@@ -130,7 +130,6 @@
   // hovered button
   //
     color: $fg_color;
-    outline-color: transparentize($fg_color, 0.7);
     border-color: $button_border;
     background-color: lighten($button_bg, 5%);
   }
@@ -140,8 +139,6 @@
   // pushed button
   //
     color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
-
     border-color: if($variant=='light', $selected_bg_color, $button_border);
     background-color: $selected_bg_color;
   }
@@ -173,7 +170,6 @@
   // normal header-bar button
   //
     color: $header_fg;
-    outline-color: transparentize($header_fg, 0.7);
     outline-offset: -3px;
     background-color: transparentize($header_bg, 1);
     border-color: transparentize($header_bg, 1);
@@ -184,7 +180,6 @@
   // hovered header-bar button
   //
     color: $header_fg;
-    outline-color: transparentize($header_fg, 0.7);
     border-color: $header_button_border;
     background-color: $header_button_bg;
   }
@@ -194,7 +189,6 @@
   // pushed header-bar button
   //
     color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
     border-color: if($darker=='false' and $variant=='light', $selected_bg_color, transparent);
     background-color: $selected_bg_color;
   }
@@ -223,7 +217,6 @@
   // normal osd button
   //
     color: $osd_fg_color;
-    outline-color: transparentize($osd_fg_color, 0.7);
     border-color: $osd_button_border;
     background-color: $osd_button_bg;
   }
@@ -233,7 +226,6 @@
   // active osd button
   //
     color: $osd_fg_color;
-    outline-color: transparentize($osd_fg_color, 0.7);
     border-color: $osd_button_border;
     background-color: opacify(lighten($osd_button_bg, 7%), 0.1);
   }
@@ -243,7 +235,6 @@
   // active osd button
   //
     color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
     border-color: $osd_button_border;
     background-color: $selected_bg_color;
   }
@@ -263,10 +254,9 @@
   //
     background-clip: border-box;
 
-    color: $selected_fg_color;
-    outline-color: transparentize($selected_fg_color, 0.7);
-    background-color: $actionb_color;
-    border-color: $actionb_color;
+    color: $actionb_fg;
+    background-color: $actionb_bg;
+    border-color: $actionb_bg;
   }
 
   @else if $t==undecorated {
diff --git a/common/gtk-3.0/3.20/sass/_granite.scss b/common/gtk-3.0/3.20/sass/_granite.scss
index a491d31..a564d55 100644
--- a/common/gtk-3.0/3.20/sass/_granite.scss
+++ b/common/gtk-3.0/3.20/sass/_granite.scss
@@ -151,7 +151,7 @@ GraniteWidgetsWelcome {
 
 GraniteWidgetsWelcome label {
   color: mix($fg_color, $bg_color, 50%);
-  font: open sans 11;
+  font-size: 11px;
   text-shadow: none;
 }
 
@@ -182,7 +182,7 @@ GraniteWidgetsPopOver {
 }
 
 .popover_bg {
-  background-image: linear-gradient(to bottom, $base_color);
+  background-image: _solid($base_color);
   border: 1px solid transparentize(black, 0.7);
 }
 
@@ -199,9 +199,9 @@ GraniteWidgetsXsEntry entry { padding: 4px; }
 //
 // Text Styles
 //
-.h1 { font: open sans 24px; }
-.h2 { font: open sans light 18px; }
-.h3 { font: open sans 11px; }
+.h1 { font-size: 24px; }
+.h2 { font-size: 18px; }
+.h3 { font-size: 11px; }
 .h4,
 .category-label {
     color: mix($bg_color, $text_color, 30%);
diff --git a/common/gtk-3.0/3.20/sass/_lightdm.scss b/common/gtk-3.0/3.20/sass/_lightdm.scss
index e5e5530..0b91ff2 100644
--- a/common/gtk-3.0/3.20/sass/_lightdm.scss
+++ b/common/gtk-3.0/3.20/sass/_lightdm.scss
@@ -2,7 +2,7 @@
 #panel_window {
   background-color: $panel_bg;
   color: $panel_fg;
-  font: bold;
+  font-weight: bold;
   box-shadow: inset 0 -1px darken($panel_bg, 7%);
 
   // the menubars/menus of the panel, i.e. indicators
@@ -10,7 +10,7 @@
   menubar > menuitem {
     background-color: transparent;
     color: $panel_fg;
-    font: bold;
+    font-weight: bold;
   }
 
   menubar menuitem:disabled {
@@ -18,14 +18,14 @@
 
     label { color: inherit; }
   }
-  menubar menu > menuitem { font: normal; }
+  menubar menu > menuitem { font-weight: normal; }
 }
 
 // the login window
 #login_window,
 #shutdown_dialog,
 #restart_dialog {
-  font: normal;
+  font-weight: normal;
   border-style: none;
   background-color: transparent;
   color: $fg_color;
@@ -72,9 +72,9 @@
 
 #login_window #user_combobox {
   color: $fg_color;
-  font: 13px;
+  font-size: 13px;
 
-  menu { font: normal; }
+  menu { font-weight: normal; }
 }
 
 // the user's avatar box
@@ -102,5 +102,5 @@
 // the warning, in case a wrong password is entered or something else goes wrong according to PAM
 #greeter_infobar {
   border-bottom-width: 0;
-  font: bold;
+  font-weight: bold;
 }
diff --git a/common/gtk-3.0/3.20/sass/_transparent_widgets.scss b/common/gtk-3.0/3.20/sass/_transparent_widgets.scss
index f6966a5..2b59744 100644
--- a/common/gtk-3.0/3.20/sass/_transparent_widgets.scss
+++ b/common/gtk-3.0/3.20/sass/_transparent_widgets.scss
@@ -3,7 +3,7 @@
 //.nemo-window,
 .nautilus-window {
   paned > separator {
-    background-image: linear-gradient(to top, $dark_sidebar_border);
+    background-image: _solid($dark_sidebar_border);
 
     @if $variant=='light' {
       &:dir(ltr) { margin-left: -1px; }
@@ -12,7 +12,7 @@
   }
 }
 
-filechooser paned > separator { background-image: linear-gradient(to top, $dark_sidebar_border); }
+filechooser paned > separator { background-image: _solid($dark_sidebar_border); }
 
 // Dark transparent sidebars
 filechooser,
@@ -145,8 +145,8 @@ filechooser {
 // Gedit
 .gedit-bottom-panel-paned { background-color: $base_color; }
 
-.gedit-side-panel-paned > separator { background-image: linear-gradient(to top, $dark_sidebar_border); }
-.gedit-bottom-panel-paned > separator { background-image: linear-gradient(to top, $borders_color); }
+.gedit-side-panel-paned > separator { background-image: _solid($dark_sidebar_border); }
+.gedit-bottom-panel-paned > separator { background-image: _solid($borders_color); }
 
 .gedit-document-panel {
   background-color: $dark_sidebar_bg;
diff --git a/common/gtk-3.0/3.20/sass/_unity.scss b/common/gtk-3.0/3.20/sass/_unity.scss
index 53ab2d7..cb18aec 100644
--- a/common/gtk-3.0/3.20/sass/_unity.scss
+++ b/common/gtk-3.0/3.20/sass/_unity.scss
@@ -17,34 +17,34 @@ UnityDecoration {
   -UnityDecoration-title-fade: 35px;
   -UnityDecoration-title-alignment: 0.0;
 
-  &.top {
+  .top {
     border: 1px solid if($darker=='true' or $variant == 'dark', darken($header_bg, 7%), transparentize(black, 0.9));
     border-bottom-width: 0;
     border-radius: 4px 4px 0 0;
     padding: 1px 6px 0 6px;
 
-    background-image: linear-gradient(to bottom, opacify($header_bg, 1));
+    background-image: _solid(opacify($header_bg, 1));
     color: $header_fg;                         // The foreground color will be used to paint the text
 
     box-shadow: inset 0  1px lighten($header_bg, 3%);
 
     &:backdrop {
       border-bottom-width: 0;
-      //background-image: linear-gradient(to bottom, opacify($header_bg_backdrop, 1));
+      //background-image: _solid(opacify($header_bg_backdrop, 1));
       color: transparentize($header_fg, 0.3);
     }
   }
-  &.left, &.right, &.bottom,
-  &.left:backdrop, &.right:backdrop, &.bottom:backdrop {
+  .left, .right, .bottom,
+  .left:backdrop, .right:backdrop, .bottom:backdrop {
     background-color: transparent;
-    background-image: linear-gradient(to bottom, if($darker=='true' or $variant == 'dark', darken($header_bg, 7%), transparentize(black, 0.9)));
+    background-image: _solid(if($darker=='true' or $variant == 'dark', darken($header_bg, 7%), transparentize(black, 0.9)));
   }
 }
 
 // Panel Style
 UnityPanelWidget,
 .unity-panel {
-  background-image: linear-gradient(to bottom, #002b36);
+  background-image: _solid(#2f343f);
   color: lighten($panel_fg, 20%);
   box-shadow: none;
 
@@ -55,7 +55,7 @@ UnityPanelWidget,
 .unity-panel.menubar .menuitem *:hover {
   border-radius: 0;
   color: $selected_fg_color;
-  background-image: linear-gradient(to bottom, $selected_bg_color);
+  background-image: _solid($selected_bg_color);
   border-bottom: none;
 }