From 6532bce86f356b5281027242ee8e3c8d9efc840c Mon Sep 17 00:00:00 2001 From: Megax Date: Fri, 22 Apr 2016 23:20:57 +0200 Subject: [PATCH 01/10] * Redesign windows csd decoration. --- gtk-3.20/scss/_global.scss | 7 ++++-- gtk-3.20/scss/widgets/_window.scss | 35 +++++++++++++++--------------- 2 files changed, 22 insertions(+), 20 deletions(-) diff --git a/gtk-3.20/scss/_global.scss b/gtk-3.20/scss/_global.scss index 9f940d5..73aff0b 100755 --- a/gtk-3.20/scss/_global.scss +++ b/gtk-3.20/scss/_global.scss @@ -31,6 +31,9 @@ $white: #fff; $button_border: shade($base_color, .9); $entry_border: alpha($dark_shadow, .06); +$top_hilight: $borders_edge; +$headerbar_color: if($variant == 'light', lighten($bg_color, 5%), darken($bg_color, 3%)); + $scrollbar_bg_color: if($variant == 'light', darken($bg_color, 5%), mix($base_color, $bg_color, .4)); $scrollbar_slider_color: shade($bg_color, .5); $scrollbar_slider_hover_color: shade($bg_color, .3); @@ -81,8 +84,8 @@ $lightdm_bg_color: $dark_bg_color; $lightdm_fg_color: $dark_fg_color; $wm_bg: $titlebar_bg_color; -$wm_border_focused: transparent; -$wm_border_unfocused: transparent; +$wm_border_focused: if($variant=='light', transparentize($black, .5), transparentize($borders_color, .1)); +$wm_border_unfocused: if($variant=='light', transparentize($black, .55), transparentize($borders_color, .1)); $wm_title_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); $wm_title_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, .4); $wm_icons_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index 7ca6ce0..c756159 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -3,44 +3,44 @@ ***************/ @include exports("window") { - %window { - box-shadow: 0 19px 38px rgba(0, 0, 0, .2), 0 15px 12px rgba(0, 0, 0, .1), 0 0 0 1px $wm_border_focused; - - &:backdrop { - box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23), 0 0 0 1px $wm_border_unfocused; - } - } - decoration { - @extend %window; - border-radius: $roundness $roundness 0 0; // lamefun trick to get rounded borders regardless of CSD use - border-width: 0px; + border-width: 0; + + box-shadow: 0 3px 9px 1px transparentize($black, .5), 0 0 0 1px $wm_border_focused; //doing borders with box-shadow /* this is used for the resize cursor area */ margin: $spacing * 3; - .fullscreen &, .tiled & { border-radius: 0; } + &:backdrop { + box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px transparentize($black, .8), 0 0 0 1px $wm_border_unfocused; + transition: 200ms ease-out; + } + + .maximized &, .fullscreen &, .tiled & { border-radius: 0; } .popup & { box-shadow: none; } // this needs to be transparent // see bug #722563 // server-side decorations as used by mutter - .ssd & { box-shadow: 0 0 0 1px if($variant=='light', transparentize(black, .77), transparentize($borders_color, .1)); } //just doing borders, wm draws actual shadows + .ssd & { box-shadow: 0 0 0 1px $wm_border_focused; } //just doing borders, wm draws actual shadows .solid-csd & { border-radius: 0; margin: 1px; - background-color: $bg_color; box-shadow: none; + background-color: $bg_color; + //border: solid 1px $dark_bg_color; + box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight; + + &:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight; } } .csd.popup & { - @extend %window; - border-radius: 0; + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); } tooltip.csd & { @@ -49,9 +49,8 @@ } messagedialog.csd & { - @extend %window; - border-radius: $roundness; + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); } } } From e8bae3d2f807336fca77ddde17b70ea6a9e48e2f Mon Sep 17 00:00:00 2001 From: Megax Date: Fri, 22 Apr 2016 23:30:02 +0200 Subject: [PATCH 02/10] * Minimal shadow and code style fix. --- gtk-3.20/scss/_global.scss | 4 ++-- gtk-3.20/scss/widgets/_window.scss | 6 ++---- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/gtk-3.20/scss/_global.scss b/gtk-3.20/scss/_global.scss index 73aff0b..43e4796 100755 --- a/gtk-3.20/scss/_global.scss +++ b/gtk-3.20/scss/_global.scss @@ -84,8 +84,8 @@ $lightdm_bg_color: $dark_bg_color; $lightdm_fg_color: $dark_fg_color; $wm_bg: $titlebar_bg_color; -$wm_border_focused: if($variant=='light', transparentize($black, .5), transparentize($borders_color, .1)); -$wm_border_unfocused: if($variant=='light', transparentize($black, .55), transparentize($borders_color, .1)); +$wm_border_focused: if($variant == 'light', transparentize($black, .5), transparentize($borders_color, .1)); +$wm_border_unfocused: if($variant == 'light', transparentize($black, .55), transparentize($borders_color, .1)); $wm_title_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); $wm_title_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, .4); $wm_icons_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index c756159..1cd8896 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -8,13 +8,13 @@ // lamefun trick to get rounded borders regardless of CSD use border-width: 0; - box-shadow: 0 3px 9px 1px transparentize($black, .5), 0 0 0 1px $wm_border_focused; //doing borders with box-shadow + box-shadow: 0 3px 9px 1px transparentize($black, .3), 0 0 0 1px $wm_border_focused; //doing borders with box-shadow /* this is used for the resize cursor area */ margin: $spacing * 3; &:backdrop { - box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px transparentize($black, .8), 0 0 0 1px $wm_border_unfocused; + box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px transparentize($black, .6), 0 0 0 1px $wm_border_unfocused; transition: 200ms ease-out; } @@ -30,9 +30,7 @@ .solid-csd & { border-radius: 0; margin: 1px; - box-shadow: none; background-color: $bg_color; - //border: solid 1px $dark_bg_color; box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight; &:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight; } From bd091fd0b974b1a89296dda5a8dc783b29c438ec Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 10:05:32 +0200 Subject: [PATCH 03/10] * Fixed Unity/compiz regression. --- gtk-3.20/scss/widgets/_window.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index 1cd8896..fd75a80 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -31,9 +31,11 @@ border-radius: 0; margin: 1px; background-color: $bg_color; - box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight; + // Unity/compiz regression: Issue: https://github.com/numixproject/numix-gtk-theme/issues/206 + box-shadow: none; + //box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight; - &:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight; } + //&:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight; } } .csd.popup & { From aa2c9936eb370da8078e522b136ea520bb77ce8b Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 14:35:18 +0200 Subject: [PATCH 04/10] * Popup menu shadow fix. --- gtk-3.20/scss/widgets/_window.scss | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index fd75a80..8bcae7c 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -1,9 +1,7 @@ -/************** - ! Window frame -***************/ - @include exports("window") { decoration { + $_wm_border: if($variant == 'light', transparentize($black, .77), transparentize($borders_color, .1)); + border-radius: $roundness $roundness 0 0; // lamefun trick to get rounded borders regardless of CSD use border-width: 0; @@ -40,7 +38,7 @@ .csd.popup & { border-radius: 0; - box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($_wm_border, .1); } tooltip.csd & { @@ -50,7 +48,7 @@ messagedialog.csd & { border-radius: $roundness; - box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($_wm_border, .1); } } } From 2a27a4646deb01e2988d78998a4e04e0869a11a7 Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 16:06:43 +0200 Subject: [PATCH 05/10] * ssd unity/compiz fix. --- gtk-3.20/scss/widgets/_window.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index 8bcae7c..29397aa 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -23,7 +23,8 @@ // this needs to be transparent // see bug #722563 // server-side decorations as used by mutter - .ssd & { box-shadow: 0 0 0 1px $wm_border_focused; } //just doing borders, wm draws actual shadows + //.ssd & { box-shadow: 0 0 0 1px $wm_border_focused; } //just doing borders, wm draws actual shadows + .ssd & { box-shadow: 0 0 0 1px transparent; } //just doing borders, wm draws actual shadows .solid-csd & { border-radius: 0; From 7f6bf0d24730d9339bcad5575c2ce63133acd051 Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 16:28:31 +0200 Subject: [PATCH 06/10] * Fixed. --- gtk-3.20/scss/widgets/_window.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index 29397aa..5cabeea 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -23,8 +23,8 @@ // this needs to be transparent // see bug #722563 // server-side decorations as used by mutter - //.ssd & { box-shadow: 0 0 0 1px $wm_border_focused; } //just doing borders, wm draws actual shadows - .ssd & { box-shadow: 0 0 0 1px transparent; } //just doing borders, wm draws actual shadows + // Fixed gtk-3.18 Unity bug (https://github.com/numixproject/numix-gtk-theme/issues/270) + .ssd & { box-shadow: 0 0 0 1px $wm_border_focused; } //just doing borders, wm draws actual shadows .solid-csd & { border-radius: 0; From 6485478945f58e90ad77a5e1ee060966a7bd7d2a Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 16:34:30 +0200 Subject: [PATCH 07/10] * Fixed gtk3.18 --- gtk-3.0/scss/widgets/_window.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/gtk-3.0/scss/widgets/_window.scss b/gtk-3.0/scss/widgets/_window.scss index 7e965b8..18d924d 100755 --- a/gtk-3.0/scss/widgets/_window.scss +++ b/gtk-3.0/scss/widgets/_window.scss @@ -51,6 +51,8 @@ } &.ssd { + // Fixed gtk-3.18 Unity bug (https://github.com/numixproject/numix-gtk-theme/issues/270) + box-shadow: 0 0 0 1px transparent; &.maximized { border-radius: 0; } } } From 965778ed2a80b769afa58fadcb2f85819064ccc8 Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 16:49:46 +0200 Subject: [PATCH 08/10] * Style optimize. --- gtk-3.20/scss/_global.scss | 7 ++----- gtk-3.20/scss/widgets/_window.scss | 13 ++++++------- 2 files changed, 8 insertions(+), 12 deletions(-) diff --git a/gtk-3.20/scss/_global.scss b/gtk-3.20/scss/_global.scss index 43e4796..9f940d5 100755 --- a/gtk-3.20/scss/_global.scss +++ b/gtk-3.20/scss/_global.scss @@ -31,9 +31,6 @@ $white: #fff; $button_border: shade($base_color, .9); $entry_border: alpha($dark_shadow, .06); -$top_hilight: $borders_edge; -$headerbar_color: if($variant == 'light', lighten($bg_color, 5%), darken($bg_color, 3%)); - $scrollbar_bg_color: if($variant == 'light', darken($bg_color, 5%), mix($base_color, $bg_color, .4)); $scrollbar_slider_color: shade($bg_color, .5); $scrollbar_slider_hover_color: shade($bg_color, .3); @@ -84,8 +81,8 @@ $lightdm_bg_color: $dark_bg_color; $lightdm_fg_color: $dark_fg_color; $wm_bg: $titlebar_bg_color; -$wm_border_focused: if($variant == 'light', transparentize($black, .5), transparentize($borders_color, .1)); -$wm_border_unfocused: if($variant == 'light', transparentize($black, .55), transparentize($borders_color, .1)); +$wm_border_focused: transparent; +$wm_border_unfocused: transparent; $wm_title_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); $wm_title_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, .4); $wm_icons_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index 5cabeea..da2eed2 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -1,7 +1,9 @@ +/************** + ! Window frame +***************/ + @include exports("window") { decoration { - $_wm_border: if($variant == 'light', transparentize($black, .77), transparentize($borders_color, .1)); - border-radius: $roundness $roundness 0 0; // lamefun trick to get rounded borders regardless of CSD use border-width: 0; @@ -32,14 +34,11 @@ background-color: $bg_color; // Unity/compiz regression: Issue: https://github.com/numixproject/numix-gtk-theme/issues/206 box-shadow: none; - //box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight; - - //&:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight; } } .csd.popup & { border-radius: 0; - box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($_wm_border, .1); + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); } tooltip.csd & { @@ -49,7 +48,7 @@ messagedialog.csd & { border-radius: $roundness; - box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($_wm_border, .1); + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); } } } From 220596b43a2c47ac0bcf436de6fc68bade6e8ab1 Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 16:58:19 +0200 Subject: [PATCH 09/10] * Minimal code style fix. --- gtk-3.0/scss/widgets/_window.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/gtk-3.0/scss/widgets/_window.scss b/gtk-3.0/scss/widgets/_window.scss index 18d924d..7742fbb 100755 --- a/gtk-3.0/scss/widgets/_window.scss +++ b/gtk-3.0/scss/widgets/_window.scss @@ -52,7 +52,8 @@ &.ssd { // Fixed gtk-3.18 Unity bug (https://github.com/numixproject/numix-gtk-theme/issues/270) - box-shadow: 0 0 0 1px transparent; + box-shadow: 0 0 0 1px $wm_border_focused; + &.maximized { border-radius: 0; } } } From 081e3162d02dd496e2a87e89c108f8de38341909 Mon Sep 17 00:00:00 2001 From: Megax Date: Sat, 23 Apr 2016 17:02:29 +0200 Subject: [PATCH 10/10] * Popup and messagedialog revert code. --- gtk-3.20/scss/widgets/_window.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/gtk-3.20/scss/widgets/_window.scss b/gtk-3.20/scss/widgets/_window.scss index da2eed2..cd0b3d3 100755 --- a/gtk-3.20/scss/widgets/_window.scss +++ b/gtk-3.20/scss/widgets/_window.scss @@ -4,6 +4,8 @@ @include exports("window") { decoration { + $_wm_border: if($variant == 'light', transparentize($black, .77), transparentize($borders_color, .1)); + border-radius: $roundness $roundness 0 0; // lamefun trick to get rounded borders regardless of CSD use border-width: 0; @@ -38,7 +40,7 @@ .csd.popup & { border-radius: 0; - box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($_wm_border, .1); } tooltip.csd & { @@ -48,7 +50,7 @@ messagedialog.csd & { border-radius: $roundness; - box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1); + box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($_wm_border, .1); } } }