brl/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

OSK variables and key rounding

Browse Source 
- generate the OSK key colors from variables in _colors.scss without changing the design
- add hover and active colors for all key, not only letter keys
- use $button_radius for the OSK keys, buttons and entries (no value change for the latter)

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/610
This commit is contained in:
frederik.feichtmeier 2019-07-02 14:29:40 -04:00 committed by Jakub Steiner
parent 14d7897a93
commit 915415d919
1 changed files with 32 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
data/theme/gnome-shell-sass/_common.scss
View File

@ -25,8 +25,10 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT";
/* GLOBALS */
$panel-corner-radius: 6px;
$medium_radius: 9px;
$modal_radius: 9px;
$button_radius: 5px;
$panel-corner-radius: $button_radius + 1;
$_trough_color: transparentize($fg_color, 0.9);
$_bubble_borders_color: lighten($borders_color, if($variant=='light', 0%, 5%));
@ -46,7 +48,7 @@ stage {
/* Buttons */
.button, %button {
border-radius: 5px;
border-radius: $button_radius;
border-width: 1px;
min-height: 22px;
padding: 4px 32px;
@ -68,21 +70,21 @@ stage {
border-top: 1px solid $_bubble_borders_color;
&:first-child {
border-radius: 0px 0px 0px $medium_radius;
border-radius: 0px 0px 0px $modal_radius;
}
&:last-child {
border-right-width: 0px;
border-radius: 0px 0px $medium_radius 0px;
border-radius: 0px 0px $modal_radius 0px;
}
&:first-child:last-child {
border-right-width: 0px;
border-radius: 0px 0px $medium_radius $medium_radius;
border-radius: 0px 0px $modal_radius $modal_radius;
}
}
/* Entries */
StEntry {
border-radius: 5px;
border-radius: $button_radius;
padding: 4px;
border-width: 1px;
color: $fg_color;
@ -192,7 +194,7 @@ StScrollBar {
.flashspot { background-color: white; }
.modal-dialog {
border-radius: 9px;
border-radius: $modal_radius;
@extend %bubble-panel;
.modal-dialog-content-box {
padding: 24px;
@ -589,7 +591,7 @@ StScrollBar {
}
.popup-menu-boxpointer,
.candidate-popup-boxpointer {
-arrow-border-radius: $medium_radius;
-arrow-border-radius: $button_radius+4;
-arrow-background-color: $bg_color;
-arrow-border-width: 1px;
-arrow-border-color: if($variant=='light', transparentize(black, 0.6), $borders_color);
@ -1518,7 +1520,7 @@ StScrollBar {
%icon_tile {
color: $osd_fg_color;
border-radius: $medium_radius;
border-radius: $button_radius+4;
padding: 6px;
border: 1px solid transparent;
transition-duration: 100ms;
@ -1625,7 +1627,7 @@ StScrollBar {
font-size: 11pt;
width: 34em;
margin: 5px;
border-radius: $medium-radius;
border-radius: $modal_radius;
border: if($variant == 'light', none, $_bubble_borders_color);
min-height: 64px;
box-shadow: 0 1px 2px transparentize(black, 0.7);
@ -1777,30 +1779,36 @@ StScrollBar {
}
.keyboard-key {
background-color: #393f3f;
$_key_bg: opacify(lighten($osd_bg_color, 9%), 1);
background-color: $_key_bg;
min-height: 1.2em;
min-width: 1.2em;
font-size: 16pt;
border-radius: 3px;
border: 1px solid #464d4d;
color: #e5e5e5;
border-radius: $button_radius;
border: 1px solid $osd_outer_borders_color;
color: $osd_fg_color;
&:focus { @include button(focus); }
&:hover,&:checked { @include button(hover); }
&:active { @include button(active);}
&:hover, &:checked { background-color: lighten($_key_bg, 3%); }
&:active { background-color: darken($_key_bg, 2%); }
&:grayed { //FIXME
background-color: $osd_bg_color;
color: $osd_fg_color;
border-color: $osd_borders_color;
}
&.default-key {
border-color: #2d3232;
background-color: #1d2020;
$_default_key_bg: opacify($osd_bg_color, 1);
border-color: $osd_outer_borders_color;
background-color: $_default_key_bg;
background-size: 20px;
&:hover, &:checked { background-color: lighten($_default_key_bg, 3%); }
&:active { background-color: darken($_default_key_bg, 2%); }
}
&.enter-key {
border-color: #005684;
background-color: #006098;
border-color: lighten($selected_bg_color, 5%);
background-color: $selected_bg_color;
background-image: url("resource:///org/gnome/shell/theme/key-enter.svg");
&:hover, &:checked { background-color: lighten($selected_bg_color, 3%); }
&:active { background-color: darken($selected_bg_color, 2%); }
}
&.shift-key-lowercase {
background-image: url("resource:///org/gnome/shell/theme/key-shift.svg");
@ -1839,8 +1847,8 @@ StScrollBar {
.emoji-panel {
.keyboard-key:latched {
border-color: #005684;
background-color: #006098;
border-color: lighten($selected_bg_color, 5%);
background-color: $selected_bg_color;
}
}
@ -1904,7 +1912,7 @@ StScrollBar {
StEntry {
@extend %search_entry;
border-radius: 5px;
border-radius: $button_radius;
@if $variant=='dark' {
$_gdm_entry_bg: transparentize(lighten(desaturate(#241f31, 20%), 2%), 0.5);
background-color: $_gdm_entry_bg;