Gnome-Shell: update popover theme tweaks

This commit is contained in:
Daniel Ruiz de Alegría 2022-03-09 08:23:05 +01:00
parent 6cfd361e65
commit fd47a59861
No known key found for this signature in database
GPG Key ID: 59667A77E8BFCB6C
5 changed files with 165 additions and 77 deletions

View File

@ -232,8 +232,8 @@ StEntry {
selection-background-color: #2777ff;
selected-color: #ffffff; }
StEntry:hover {
background-color: #363a48;
border-color: #363a48;
background-color: #3b3f4e;
border-color: #3b3f4e;
color: rgba(238, 238, 236, 0.7); }
StEntry:focus {
background-color: #2d3546;
@ -354,21 +354,21 @@ StScrollBar {
.popup-menu-item:rtl {
padding-right: 6px; }
.popup-menu-item:focus, .popup-menu-item:hover {
background-color: #2b2f3a !important; }
background-color: #303340 !important; }
.popup-menu-item:focus:active, .popup-menu-item:hover:active {
background-color: #303340 !important; }
background-color: #343845 !important; }
.popup-menu-item:checked {
background-color: #363a48 !important; }
background-color: #3b3f4e !important; }
.popup-menu-item:checked {
margin-bottom: 0;
box-shadow: inset 0 -1px 0 0 #2b2f3a;
box-shadow: inset 0 -1px 0 0 #303340;
border-radius: 8px 8px 0 0; }
.popup-menu-item:checked:focus, .popup-menu-item:checked:hover {
background-color: #3d4251 !important; }
.popup-menu-item:checked:active {
background-color: #414657 !important; }
.popup-menu-item:checked:active {
background-color: #464b5d !important; }
.popup-menu-item:active {
background-color: #3b3f4e;
background-color: #3f4454;
color: #fcfcfc; }
.popup-menu-item:insensitive {
color: rgba(238, 238, 236, 0.5); }
@ -387,7 +387,7 @@ StScrollBar {
icon-size: 16px !important; }
.popup-sub-menu {
background-color: #363a48;
background-color: #3b3f4e;
border-radius: 0 0 8px 8px; }
.popup-sub-menu .popup-menu-ornament {
min-width: 1.09em !important; }
@ -397,13 +397,13 @@ StScrollBar {
.popup-sub-menu .popup-menu-item:last-child {
border-radius: 0 0 8px 8px; }
.popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover {
background-color: #414657 !important; }
.popup-sub-menu .popup-menu-item:checked {
background-color: #4c5266 !important; }
.popup-sub-menu .popup-menu-item:checked:focus, .popup-sub-menu .popup-menu-item:checked:hover {
background-color: #484d60 !important; }
.popup-sub-menu .popup-menu-item:active {
background-color: #464b5d !important; }
.popup-sub-menu .popup-menu-item:checked {
background-color: #51576b !important; }
.popup-sub-menu .popup-menu-item:checked:focus, .popup-sub-menu .popup-menu-item:checked:hover {
background-color: #4c5266 !important; }
.popup-sub-menu .popup-menu-item:active {
background-color: #4a5063 !important; }
.popup-sub-menu .popup-menu-section .popup-menu-item:last-child:hover, .popup-sub-menu .popup-menu-section .popup-menu-item:last-child:focus {
border-radius: 0; }
.popup-sub-menu .popup-menu-section:last-child .popup-menu-item:last-child {
@ -551,9 +551,9 @@ StScrollBar {
margin: 2px;
border-radius: 6px; }
.calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus {
background-color: #2b2f3a; }
.calendar .calendar-month-header .pager-button:active {
background-color: #303340; }
.calendar .calendar-month-header .pager-button:active {
background-color: #343845; }
.calendar .calendar-day-base {
text-align: center;
margin: 2px;
@ -562,16 +562,16 @@ StScrollBar {
width: 32px !important;
border-radius: 99px; }
.calendar .calendar-day-base:hover {
background-color: #2b2f3a; }
background-color: #303340; }
.calendar .calendar-day-base:focus {
background-color: #243658;
color: #ffffff;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
.calendar .calendar-day-base:active, .calendar .calendar-day-base:selected {
color: #fcfcfc;
background-color: #303340; }
background-color: #343845; }
.calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus {
background-color: #2e4166; }
background-color: #31456b; }
.calendar .calendar-day-base.calendar-day-heading {
color: #888a8d;
padding-top: 6px;
@ -846,10 +846,10 @@ StScrollBar {
border-radius: 8px;
color: #eeeeec; }
.message-media-control:hover {
background-color: #363a48;
background-color: #3b3f4e;
color: #eeeeec; }
.message-media-control:active {
background-color: #3b3f4e;
background-color: #3f4454;
color: #eeeeec; }
.message-media-control:insensitive {
color: #959799; }
@ -885,7 +885,7 @@ StScrollBar {
background-color: #2777ff;
color: #ffffff; }
.candidate-box:hover {
background-color: #2b2f3a;
background-color: #303340;
color: #f8f8f7; }
.candidate-page-button-box {
@ -1068,7 +1068,7 @@ StScrollBar {
.audio-selection-device {
border-radius: 16px; }
.audio-selection-device:hover, .audio-selection-device:focus {
background-color: #2b2f3a; }
background-color: #303340; }
.audio-selection-device:active {
background-color: #2777ff;
color: #ffffff; }
@ -1119,7 +1119,7 @@ StScrollBar {
border-radius: 5px;
color: #ffffff; }
.nm-dialog-item:hover {
background-color: #2b2f3a; }
background-color: #303340; }
.nm-dialog-icon {
icon-size: 1.09em; }
@ -1294,7 +1294,7 @@ StScrollBar {
transition-duration: 200ms;
border-radius: 99px; }
.screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus {
background-color: #2b2f3a; }
background-color: #303340; }
.screenshot-ui-capture-button:hover .screenshot-ui-capture-button-circle, .screenshot-ui-capture-button:focus .screenshot-ui-capture-button-circle {
background-color: #d9d9d9; }
.screenshot-ui-capture-button:active .screenshot-ui-capture-button-circle {
@ -1307,7 +1307,7 @@ StScrollBar {
background-color: #360707; }
.screenshot-ui-shot-cast-container {
background-color: #2b2f3a;
background-color: #303340;
border-radius: 16px;
padding: 3px;
spacing: 3px; }
@ -1321,9 +1321,9 @@ StScrollBar {
background-color: transparent;
border-radius: 13px; }
.screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus {
background-color: #363a48; }
.screenshot-ui-shot-cast-button:active {
background-color: #3b3f4e; }
.screenshot-ui-shot-cast-button:active {
background-color: #3f4454; }
.screenshot-ui-shot-cast-button:checked {
background-color: white;
color: black; }
@ -1572,8 +1572,8 @@ StScrollBar {
border: 2px solid #2e313d; }
.search-entry:hover {
background-color: #363a48;
border-color: #363a48;
background-color: #3b3f4e;
border-color: #3b3f4e;
color: rgba(238, 238, 236, 0.7); }
.search-entry:focus {
@ -2596,14 +2596,38 @@ $_osd_color: if($variant=='light', black, $fg_color);
-slider-handle-radius: 0; }
/* Popovers/Menus */
/*
// menu items
.popup-menu-content, .candidate-popup-content {
padding: 4px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
background-color: #272a34; }
.popup-menu-item {
&.selected, &:active {
background-color: $popover_hover_color;
color: $fg_color;
}
}
border: 1px solid transparent;
border-bottom: 0;
margin-top: 0;
margin-bottom: 0;
padding-top: 8px;
padding-bottom: 8px; }
.popup-menu-item:checked {
border-color: #0d0e11;
background-color: #23252e !important; }
.popup-sub-menu {
background-color: #23252e;
border: 1px solid #0d0e11;
border-top: 0; }
.popup-sub-menu .popup-menu-item {
padding-top: 7px;
padding-bottom: 7px; }
.popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover {
background-color: #303340 !important; }
.popup-sub-menu .popup-menu-item:checked {
background-color: #3b3f4e !important; }
.popup-sub-menu .popup-menu-item:active {
background-color: #343845 !important; }
.popup-separator-menu-item {
margin: 6px 0; }
/* Message List */
.message-list .message-list-placeholder,

View File

@ -354,21 +354,21 @@ StScrollBar {
.popup-menu-item:rtl {
padding-right: 6px; }
.popup-menu-item:focus, .popup-menu-item:hover {
background-color: #f7f7f7 !important; }
background-color: #f2f2f2 !important; }
.popup-menu-item:focus:active, .popup-menu-item:hover:active {
background-color: #f2f2f2 !important; }
background-color: #ededed !important; }
.popup-menu-item:checked {
background-color: #ededed !important; }
background-color: #e8e8e8 !important; }
.popup-menu-item:checked {
margin-bottom: 0;
box-shadow: inset 0 -1px 0 0 #e0e0e0;
box-shadow: inset 0 -1px 0 0 #dbdbdb;
border-radius: 8px 8px 0 0; }
.popup-menu-item:checked:focus, .popup-menu-item:checked:hover {
background-color: whitesmoke !important; }
background-color: #f0f0f0 !important; }
.popup-menu-item:checked:active {
background-color: #fafafa !important; }
background-color: whitesmoke !important; }
.popup-menu-item:active {
background-color: white;
background-color: #fafafa;
color: #50555e; }
.popup-menu-item:insensitive {
color: rgba(92, 97, 108, 0.5); }
@ -387,7 +387,7 @@ StScrollBar {
icon-size: 16px !important; }
.popup-sub-menu {
background-color: #ededed;
background-color: #e8e8e8;
border-radius: 0 0 8px 8px; }
.popup-sub-menu .popup-menu-ornament {
min-width: 1.09em !important; }
@ -401,7 +401,7 @@ StScrollBar {
.popup-sub-menu .popup-menu-item:checked {
background-color: white !important; }
.popup-sub-menu .popup-menu-item:checked:focus, .popup-sub-menu .popup-menu-item:checked:hover {
background-color: white !important; }
background-color: #fcfcfc !important; }
.popup-sub-menu .popup-menu-item:active {
background-color: white !important; }
.popup-sub-menu .popup-menu-section .popup-menu-item:last-child:hover, .popup-sub-menu .popup-menu-section .popup-menu-item:last-child:focus {
@ -551,9 +551,9 @@ StScrollBar {
margin: 2px;
border-radius: 6px; }
.calendar .calendar-month-header .pager-button:hover, .calendar .calendar-month-header .pager-button:focus {
background-color: #f7f7f7; }
.calendar .calendar-month-header .pager-button:active {
background-color: #f2f2f2; }
.calendar .calendar-month-header .pager-button:active {
background-color: #ededed; }
.calendar .calendar-day-base {
text-align: center;
margin: 2px;
@ -562,16 +562,16 @@ StScrollBar {
width: 32px !important;
border-radius: 99px; }
.calendar .calendar-day-base:hover {
background-color: #f7f7f7; }
background-color: #f2f2f2; }
.calendar .calendar-day-base:focus {
background-color: #d4e4ff;
color: #ffffff;
box-shadow: inset 0 0 0 2px rgba(39, 119, 255, 0.6); }
.calendar .calendar-day-base:active, .calendar .calendar-day-base:selected {
color: #50555e;
background-color: #f2f2f2; }
background-color: #ededed; }
.calendar .calendar-day-base:active:focus, .calendar .calendar-day-base:selected:focus {
background-color: #cadaf5; }
background-color: #c6d6f1; }
.calendar .calendar-day-base.calendar-day-heading {
color: #aeb0b6;
padding-top: 6px;
@ -849,7 +849,7 @@ StScrollBar {
background-color: white;
color: #5c616c; }
.message-media-control:active {
background-color: white;
background-color: #fafafa;
color: #5c616c; }
.message-media-control:insensitive {
color: #bbbdc2; }
@ -885,7 +885,7 @@ StScrollBar {
background-color: #2777ff;
color: #ffffff; }
.candidate-box:hover {
background-color: #f7f7f7;
background-color: #f2f2f2;
color: #50555e; }
.candidate-page-button-box {
@ -1068,7 +1068,7 @@ StScrollBar {
.audio-selection-device {
border-radius: 16px; }
.audio-selection-device:hover, .audio-selection-device:focus {
background-color: #f7f7f7; }
background-color: #f2f2f2; }
.audio-selection-device:active {
background-color: #2777ff;
color: #ffffff; }
@ -1119,7 +1119,7 @@ StScrollBar {
border-radius: 5px;
color: #ffffff; }
.nm-dialog-item:hover {
background-color: #f7f7f7; }
background-color: #f2f2f2; }
.nm-dialog-icon {
icon-size: 1.09em; }
@ -1294,7 +1294,7 @@ StScrollBar {
transition-duration: 200ms;
border-radius: 99px; }
.screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus {
background-color: #f7f7f7; }
background-color: #f2f2f2; }
.screenshot-ui-capture-button:hover .screenshot-ui-capture-button-circle, .screenshot-ui-capture-button:focus .screenshot-ui-capture-button-circle {
background-color: #d9d9d9; }
.screenshot-ui-capture-button:active .screenshot-ui-capture-button-circle {
@ -1307,7 +1307,7 @@ StScrollBar {
background-color: #360707; }
.screenshot-ui-shot-cast-container {
background-color: #f7f7f7;
background-color: #f2f2f2;
border-radius: 16px;
padding: 3px;
spacing: 3px; }
@ -1323,7 +1323,7 @@ StScrollBar {
.screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus {
background-color: white; }
.screenshot-ui-shot-cast-button:active {
background-color: white; }
background-color: #fafafa; }
.screenshot-ui-shot-cast-button:checked {
background-color: white;
color: black; }
@ -2592,14 +2592,38 @@ $_osd_color: if($variant=='light', black, $fg_color);
-slider-handle-radius: 0; }
/* Popovers/Menus */
/*
// menu items
.popup-menu-content, .candidate-popup-content {
padding: 4px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
background-color: #fafafa; }
.popup-menu-item {
&.selected, &:active {
background-color: $popover_hover_color;
color: $fg_color;
}
}
border: 1px solid transparent;
border-bottom: 0;
margin-top: 0;
margin-bottom: 0;
padding-top: 8px;
padding-bottom: 8px; }
.popup-menu-item:checked {
border-color: #d9d9d9;
background-color: #ffffff !important; }
.popup-sub-menu {
background-color: #ffffff;
border: 1px solid #d9d9d9;
border-top: 0; }
.popup-sub-menu .popup-menu-item {
padding-top: 7px;
padding-bottom: 7px; }
.popup-sub-menu .popup-menu-item:focus, .popup-sub-menu .popup-menu-item:hover {
background-color: #f2f2f2 !important; }
.popup-sub-menu .popup-menu-item:checked {
background-color: #e8e8e8 !important; }
.popup-sub-menu .popup-menu-item:active {
background-color: #ededed !important; }
.popup-separator-menu-item {
margin: 6px 0; }
/* Message List */
.message-list .message-list-placeholder,

View File

@ -38,15 +38,43 @@ $_osd_color: if($variant=='light', black, $fg_color);
}
/* Popovers/Menus */
/*
// menu items
.popup-menu-item {
&.selected, &:active {
background-color: $popover_hover_color;
color: $fg_color;
}
.popup-menu-content {
padding: 4px;
box-shadow: 0 2px 4px transparentize(black, .8);
background-color: $base_color;
}
.popup-menu-item {
border: 1px solid transparent;
border-bottom: 0;
margin-top: 0;
margin-bottom: 0;
padding-top: 8px;
padding-bottom: 8px;
&:checked {
border-color: $borders_color;
background-color: $bg_color!important;
}
}
.popup-sub-menu {
background-color: $bg_color;
border: 1px solid $borders_color;
border-top: 0;
.popup-menu-item {
padding-top: 7px;
padding-bottom: 7px;
&:focus, &:hover { background-color: $hover_bg_color!important; }
&:checked { background-color: $checked_bg_color!important; }
&:active { background-color: $active_bg_color!important; }
}
}
.popup-separator-menu-item { margin: 6px 0; }
/* Message List */
.message-list .message-list-placeholder,
.message-list-controls {

View File

@ -36,15 +36,15 @@ $base_border_radius: 8px;
$modal_radius: $base_border_radius*2; // 24px
// derived hover colors
$hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 4%));
$hover_bg_color: if($variant=='light', darken($base_color, 3%), lighten($base_color, 4%));
$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 4%));
// derived active colors
$active_bg_color: if($variant=='light', darken($bg_color, 5%), lighten($bg_color, 6%));
$active_bg_color: if($variant=='light', darken($base_color, 5%), lighten($base_color, 6%));
$active_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 6%));
// derived checked colors
$checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 9%));
$checked_bg_color: if($variant=='light', darken($base_color, 7%), lighten($base_color, 9%));
$checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 9%));
// fonts

View File

@ -1,3 +1,15 @@
39c39
< $hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 4%));
---
> $hover_bg_color: if($variant=='light', darken($base_color, 3%), lighten($base_color, 4%));
43c43
< $active_bg_color: if($variant=='light', darken($bg_color, 5%), lighten($bg_color, 6%));
---
> $active_bg_color: if($variant=='light', darken($base_color, 5%), lighten($base_color, 6%));
47c47
< $checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 9%));
---
> $checked_bg_color: if($variant=='light', darken($base_color, 7%), lighten($base_color, 9%));
51c51
< $base_font_size: 11;
---