[Gtk-3.20] Redecorate OSD: Implement spinbutton and entry. Fixes #457

pull/542/head
Khurshid Alam 2016-08-31 15:47:06 +05:30 committed by GitHub
commit 23fca70ae8
3 changed files with 68 additions and 3 deletions

View File

@ -74,8 +74,12 @@ $panel_bg_color: $dark_bg_color;
$panel_fg_color: $dark_fg_color; $panel_fg_color: $dark_fg_color;
$osd_base: $dark_bg_color; $osd_base: $dark_bg_color;
$osd_text_color: $white;
$osd_fg: $dark_fg_color; $osd_fg: $dark_fg_color;
$osd_bg: alpha($osd_base, .8); $osd_bg: alpha($osd_base, .8);
$osd_insensitive_bg_color: mix($osd_fg, $osd_bg, .5);
$osd_insensitive_fg_color: mix($osd_fg, $osd_base, .6);
$osd_borders_color: shade($osd_bg, .85);
$lightdm_bg_color: $dark_bg_color; $lightdm_bg_color: $dark_bg_color;
$lightdm_fg_color: $dark_fg_color; $lightdm_fg_color: $dark_fg_color;

View File

@ -118,7 +118,7 @@
selection { &:focus, & { @extend %selected_items; } } selection { &:focus, & { @extend %selected_items; } }
} }
@mixin entry($bg, $fg) { @mixin entry($bg, $fg, $border: $borders_color) {
@extend %entry; @extend %entry;
@include linear-gradient($bg, to top); @include linear-gradient($bg, to top);
@include border($bg); @include border($bg);
@ -128,7 +128,7 @@
color: $fg; color: $fg;
caret-color: $fg; caret-color: $fg;
&:focus, &:active { border-color: border_focus($borders_color); } &:focus, &:active { border-color: border_focus($border); }
&:disabled { &:disabled {
@include linear-gradient(shade($bg, .9), to top); @include linear-gradient(shade($bg, .9), to top);

View File

@ -9,6 +9,9 @@
overlay.osd { background-color: transparent; } overlay.osd { background-color: transparent; }
.osd { .osd {
background-color: $osd_bg;
color: $osd_fg;
&.background { &.background {
background-color: alpha($osd_bg, .8); background-color: alpha($osd_bg, .8);
color: $osd_fg; color: $osd_fg;
@ -19,7 +22,7 @@
background-origin: border-box; background-origin: border-box;
} }
button { @include button($osd_bg, $osd_fg); } entry { @include entry($osd_base, $osd_text_color, $osd_borders_color); }
toolbar { toolbar {
@ -104,5 +107,63 @@
/* when there's no pixbuf yet */ /* when there's no pixbuf yet */
background-color: $osd_bg; background-color: $osd_bg;
} }
spinbutton {
// OSD horizontal
&:not(.vertical) {
@include linear-gradient($osd_base, to top);
@include border($osd_base);
padding: 0;
color: $osd_text_color;
caret-color: $osd_text_color;
&:focus, &:active { border-color: border_focus($osd_borders_color); }
&:disabled {
@include linear-gradient(shade($osd_base, .9), to top);
color: mix($osd_base, $osd_text_color, .5);
}
button {
@include button($osd_bg, $osd_fg);
border-radius: 0;
border-color: transparentize($osd_borders_color, .3);
border-style: none none none solid;
background-image: none;
box-shadow: none;
&:dir(rtl) { border-style: none solid none none; }
&:active, &:checked, &:hover { color: $osd_text_color; }
&:disabled { color: alpha($osd_insensitive_fg_color, .8); }
&:backdrop { color: mix($backdrop_base_color, $backdrop_fg_color, .9); }
&:active { box-shadow: inset 0 2px 3px -1px transparentize($black, .8); }
&:backdrop:disabled {
color: alpha($backdrop_insensitive_color, .8);
border-style: none none none solid; // It is needed or it gets overridden
&:dir(rtl) { border-style: none solid none none; }
}
&:dir(rtl):first-child { border-radius: $roundness 0 0 $roundness; }
&:dir(ltr):last-child { border-radius: 0 $roundness $roundness 0; }
}
}
// OSD vertical
&.vertical button:first-child {
@include button($osd_bg, $osd_fg);
}
}
} }
} }