* Redesign windows csd decoration.

pull/379/head
Megax 2016-04-22 23:20:57 +02:00
parent 5b69b56e69
commit 6532bce86f
2 changed files with 22 additions and 20 deletions

View File

@ -31,6 +31,9 @@ $white: #fff;
$button_border: shade($base_color, .9); $button_border: shade($base_color, .9);
$entry_border: alpha($dark_shadow, .06); $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_bg_color: if($variant == 'light', darken($bg_color, 5%), mix($base_color, $bg_color, .4));
$scrollbar_slider_color: shade($bg_color, .5); $scrollbar_slider_color: shade($bg_color, .5);
$scrollbar_slider_hover_color: shade($bg_color, .3); $scrollbar_slider_hover_color: shade($bg_color, .3);
@ -81,8 +84,8 @@ $lightdm_bg_color: $dark_bg_color;
$lightdm_fg_color: $dark_fg_color; $lightdm_fg_color: $dark_fg_color;
$wm_bg: $titlebar_bg_color; $wm_bg: $titlebar_bg_color;
$wm_border_focused: transparent; $wm_border_focused: if($variant=='light', transparentize($black, .5), transparentize($borders_color, .1));
$wm_border_unfocused: transparent; $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_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1);
$wm_title_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, .4); $wm_title_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, .4);
$wm_icons_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1); $wm_icons_focused: mix($titlebar_fg_color, $titlebar_bg_color, .1);

View File

@ -3,44 +3,44 @@
***************/ ***************/
@include exports("window") { @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 { decoration {
@extend %window;
border-radius: $roundness $roundness 0 0; border-radius: $roundness $roundness 0 0;
// lamefun trick to get rounded borders regardless of CSD use // 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 */ /* this is used for the resize cursor area */
margin: $spacing * 3; 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; } .popup & { box-shadow: none; }
// this needs to be transparent // this needs to be transparent
// see bug #722563 // see bug #722563
// server-side decorations as used by mutter // 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 & { .solid-csd & {
border-radius: 0; border-radius: 0;
margin: 1px; margin: 1px;
background-color: $bg_color;
box-shadow: none; 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 & { .csd.popup & {
@extend %window;
border-radius: 0; border-radius: 0;
box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1);
} }
tooltip.csd & { tooltip.csd & {
@ -49,9 +49,8 @@
} }
messagedialog.csd & { messagedialog.csd & {
@extend %window;
border-radius: $roundness; border-radius: $roundness;
box-shadow: 0 1px 2px transparentize($black, .8), 0 0 0 1px transparentize($wm_border_focused, .1);
} }
} }
} }