theme: use spaces instead of tabs

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/904
This commit is contained in:
Sam Hewitt 2019-12-19 10:38:27 -05:00 committed by Florian Müllner
parent 9ea745bcd4
commit 891f2201c5
37 changed files with 1863 additions and 1981 deletions

View File

@ -268,7 +268,7 @@ stage {
padding: 8px 0; } padding: 8px 0; }
.calendar .calendar-change-month-back StIcon, .calendar .calendar-change-month-back StIcon,
.calendar .calendar-change-month-forward StIcon { .calendar .calendar-change-month-forward StIcon {
icon-size: 1.09em; } icon-size: 16px; }
.calendar .pager-button { .calendar .pager-button {
background-color: transparent; background-color: transparent;
height: 32px; height: 32px;
@ -352,7 +352,7 @@ stage {
spacing-rows: 6px; spacing-rows: 6px;
spacing-columns: 12px; } spacing-columns: 12px; }
.weather-box .weather-forecast-icon { .weather-box .weather-forecast-icon {
icon-size: 2.18em; } icon-size: 32px; }
.weather-box .weather-forecast-time { .weather-box .weather-forecast-time {
color: #b3b3b3; color: #b3b3b3;
font-feature-settings: "tnum"; font-feature-settings: "tnum";
@ -495,8 +495,8 @@ stage {
spacing: 20px; } spacing: 20px; }
.message-dialog-icon { .message-dialog-icon {
min-width: 3.27em; min-width: 48px;
icon-size: 3.27em; } icon-size: 48px; }
.message-dialog-title { .message-dialog-title {
font-weight: bold; } font-weight: bold; }
@ -507,7 +507,7 @@ stage {
/* ShellMountOperation Dialogs */ /* ShellMountOperation Dialogs */
.shell-mount-operation-icon { .shell-mount-operation-icon {
icon-size: 3.27em; } icon-size: 48px; }
.mount-dialog { .mount-dialog {
spacing: 24px; } spacing: 24px; }
@ -649,7 +649,7 @@ stage {
spacing: 20px; } spacing: 20px; }
.audio-selection-device-icon { .audio-selection-device-icon {
icon-size: 4.36em; } icon-size: 64px; }
/* Access Dialog */ /* Access Dialog */
.access-dialog { .access-dialog {
@ -708,14 +708,14 @@ stage {
.end-session-dialog-logout-icon { .end-session-dialog-logout-icon {
border-radius: 99px; border-radius: 99px;
width: 3.27em; width: 48px;
height: 3.27em; height: 48px;
background-size: contain; } background-size: contain; }
.end-session-dialog-shutdown-icon { .end-session-dialog-shutdown-icon {
color: #fff; color: #fff;
width: 3.27em; width: 48px;
height: 3.27em; } height: 48px; }
.end-session-dialog-inhibitor-layout { .end-session-dialog-inhibitor-layout {
spacing: 24px; spacing: 24px;
@ -765,7 +765,7 @@ StEntry {
warning-color: #f57900; warning-color: #f57900;
padding: 0 4px; } padding: 0 4px; }
StEntry StIcon.peek-password { StEntry StIcon.peek-password {
icon-size: 1.09em; icon-size: 16px;
padding: 0 4px; } padding: 0 4px; }
.hotplug-transient-box { .hotplug-transient-box {
@ -844,7 +844,20 @@ StEntry {
icon-size: 1em; } icon-size: 1em; }
/* On-screen Keyboard */ /* On-screen Keyboard */
.keyboard-key, .keyboard-subkeys .keyboard-key { #keyboard {
background-color: rgba(0, 0, 0, 0.9);
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1) !important; }
#keyboard .page-indicator {
padding: 6px; }
#keyboard .page-indicator .page-indicator-icon {
width: 6px;
height: 6px; }
.key-container {
padding: 4px;
spacing: 4px; }
.keyboard-key {
color: #fff; color: #fff;
background-color: #080808 !important; background-color: #080808 !important;
border-width: 1px; border-width: 1px;
@ -852,7 +865,11 @@ StEntry {
border-color: black; border-color: black;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9);
text-shadow: 0 1px rgba(255, 255, 255, 0.3); text-shadow: 0 1px rgba(255, 255, 255, 0.3);
icon-shadow: 0 1px rgba(255, 255, 255, 0.3); } icon-shadow: 0 1px rgba(255, 255, 255, 0.3);
font-size: 16pt;
min-height: 1.2em;
min-width: 1.2em;
border-radius: 8px; }
.keyboard-key:focus { .keyboard-key:focus {
color: #fff; color: #fff;
text-shadow: 0 1px rgba(255, 255, 255, 0.3); text-shadow: 0 1px rgba(255, 255, 255, 0.3);
@ -876,27 +893,6 @@ StEntry {
text-shadow: none; text-shadow: none;
icon-shadow: none; icon-shadow: none;
box-shadow: none; } box-shadow: none; }
#keyboard {
background-color: rgba(0, 0, 0, 0.9);
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1) !important; }
#keyboard .page-indicator {
padding: 6px; }
#keyboard .page-indicator .page-indicator-icon {
width: 6px;
height: 6px; }
#keyboard .page-indicator .page-indicator-icon:checked {
background-color: red; }
.key-container {
padding: 4px;
spacing: 4px; }
.keyboard-key {
font-size: 16pt;
min-height: 1.2em;
min-width: 1.2em;
border-radius: 8px; }
.keyboard-key:grayed { .keyboard-key:grayed {
background-color: black; background-color: black;
color: #eeeeec; color: #eeeeec;
@ -910,8 +906,7 @@ StEntry {
border-color: black; border-color: black;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9);
text-shadow: 0 1px rgba(255, 255, 255, 0.3); text-shadow: 0 1px rgba(255, 255, 255, 0.3);
icon-shadow: 0 1px rgba(255, 255, 255, 0.3); icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important; }
.keyboard-key.default-key:hover, .keyboard-key.default-key:checked { .keyboard-key.default-key:hover, .keyboard-key.default-key:checked {
color: #fff; color: #fff;
background-color: #272c2e !important; background-color: #272c2e !important;
@ -939,8 +934,7 @@ StEntry {
border-color: #113050; border-color: #113050;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9);
text-shadow: 0 1px rgba(255, 255, 255, 0.3); text-shadow: 0 1px rgba(255, 255, 255, 0.3);
icon-shadow: 0 1px rgba(255, 255, 255, 0.3); icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important; }
.keyboard-key.enter-key:hover, .keyboard-key.enter-key:checked { .keyboard-key.enter-key:hover, .keyboard-key.enter-key:checked {
color: #fff; color: #fff;
background-color: #2b79cb !important; background-color: #2b79cb !important;
@ -980,7 +974,38 @@ StEntry {
-arrow-rise: 10px; -arrow-rise: 10px;
-boxpointer-gap: 6px; } -boxpointer-gap: 6px; }
.keyboard-subkeys .keyboard-key { .keyboard-subkeys .keyboard-key {
color: #fff;
background-color: #080808 !important;
border-width: 1px;
border-style: solid;
border-color: black;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9);
text-shadow: 0 1px rgba(255, 255, 255, 0.3);
icon-shadow: 0 1px rgba(255, 255, 255, 0.3);
border-radius: 5px; } border-radius: 5px; }
.keyboard-subkeys .keyboard-key:focus {
color: #fff;
text-shadow: 0 1px rgba(255, 255, 255, 0.3);
icon-shadow: 0 1px rgba(255, 255, 255, 0.3);
box-shadow: inset 0 0 0 2px rgba(33, 93, 156, 0.3); }
.keyboard-subkeys .keyboard-key:hover, .keyboard-subkeys .keyboard-key:checked {
color: #fff;
background-color: #141414 !important;
border-width: 1px;
border-style: solid;
border-color: black;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.9);
text-shadow: 0 1px rgba(255, 255, 255, 0.3);
icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
.keyboard-subkeys .keyboard-key:active {
color: #fff;
background-color: black !important;
border-width: 1px;
border-style: solid;
border-color: black;
text-shadow: none;
icon-shadow: none;
box-shadow: none; }
.emoji-page .keyboard-key { .emoji-page .keyboard-key {
background-color: transparent; background-color: transparent;
@ -1291,16 +1316,17 @@ StEntry {
.message .message-close-button:hover { .message .message-close-button:hover {
color: #e6e6e6; } color: #e6e6e6; }
.message .message-icon-bin { .message .message-icon-bin {
padding: 6px;
margin: 6px 0; } margin: 6px 0; }
.message .message-icon-bin > StIcon { .message .message-icon-bin > StIcon {
color: #fff; color: #fff;
icon-size: 2.18em; icon-size: 32px;
-st-icon-style: symbolic; -st-icon-style: symbolic;
padding: 0; padding: 0;
margin: 6px; } margin: 6px; }
.message .message-icon-bin > .fallback-window-icon { .message .message-icon-bin > .fallback-window-icon {
width: 1.09em; width: 16px;
height: 1.09em; } height: 16px; }
.message .message-secondary-bin { .message .message-secondary-bin {
padding: 0; } padding: 0; }
.message .message-secondary-bin > .event-time { .message .message-secondary-bin > .event-time {
@ -1329,14 +1355,14 @@ StEntry {
border-radius: 7px 0 0 7px; } border-radius: 7px 0 0 7px; }
.media-message-cover-icon { .media-message-cover-icon {
icon-size: 2.18em !important; icon-size: 32px !important;
border-radius: 5px; } border-radius: 5px; }
.media-message-cover-icon.fallback { .media-message-cover-icon.fallback {
color: #d4d4d4; color: #d4d4d4;
background-color: #000; background-color: #000;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: 5px; border-radius: 5px;
icon-size: 2.18em !important; icon-size: 32px !important;
padding: 12px; } padding: 12px; }
/* Notifications & Mesage Tray */ /* Notifications & Mesage Tray */
@ -1359,7 +1385,7 @@ StEntry {
.notification-banner .message-content, .notification-banner:focus .message-content, .notification-banner:active .message-content { .notification-banner .message-content, .notification-banner:focus .message-content, .notification-banner:active .message-content {
color: #fff; } color: #fff; }
.notification-banner .message-icon-bin > StIcon { .notification-banner .message-icon-bin > StIcon {
icon-size: 2.18em; icon-size: 32px;
color: #fff; } color: #fff; }
.notification-banner .notification-icon { .notification-banner .notification-icon {
padding: 5px; } padding: 5px; }
@ -1367,7 +1393,7 @@ StEntry {
padding: 5px; padding: 5px;
spacing: 5px; } spacing: 5px; }
.notification-banner .secondary-icon { .notification-banner .secondary-icon {
icon-size: 1.09em; } icon-size: 16px; }
.notification-banner .notification-actions { .notification-banner .notification-actions {
padding-top: 0; padding-top: 0;
color: #fff; color: #fff;
@ -1394,7 +1420,7 @@ StEntry {
border-radius: 0.9em; } border-radius: 0.9em; }
.secondary-icon { .secondary-icon {
icon-size: 1.09em; } icon-size: 16px; }
.chat-body { .chat-body {
spacing: 5px; } spacing: 5px; }
@ -1502,7 +1528,7 @@ StEntry {
font-weight: bold; } font-weight: bold; }
.nm-dialog-header-icon { .nm-dialog-header-icon {
icon-size: 2.18em; } icon-size: 32px; }
.nm-dialog-header-hbox { .nm-dialog-header-hbox {
spacing: 10px; } spacing: 10px; }
@ -1522,7 +1548,7 @@ StEntry {
color: #ffffff; } color: #ffffff; }
.nm-dialog-icon { .nm-dialog-icon {
icon-size: 1.09em; } icon-size: 16px; }
.nm-dialog-icons { .nm-dialog-icons {
spacing: 12px; } spacing: 12px; }
@ -1604,7 +1630,7 @@ StEntry {
box-shadow: inset 0 -2px 0 0 #256ab1; box-shadow: inset 0 -2px 0 0 #256ab1;
color: #333333; } color: #333333; }
#panel .panel-button .system-status-icon { #panel .panel-button .system-status-icon {
icon-size: 1.09em; icon-size: 16px;
padding: 5px; } padding: 5px; }
#panel .panel-button .app-menu-icon { #panel .panel-button .app-menu-icon {
margin-left: 4px; margin-left: 4px;
@ -1677,7 +1703,7 @@ StEntry {
.popup-menu-arrow, .popup-menu-arrow,
.popup-menu-icon { .popup-menu-icon {
icon-size: 1.09em; } icon-size: 16px; }
.popup-sub-menu { .popup-sub-menu {
background-color: black; background-color: black;
@ -1709,10 +1735,10 @@ StEntry {
-st-icon-style: symbolic; } -st-icon-style: symbolic; }
.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:ltr { .aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:ltr {
padding-left: 14px; padding-left: 14px;
margin-left: 1.09em; } margin-left: 16px; }
.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:rtl { .aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:rtl {
padding-right: 14px; padding-right: 14px;
margin-right: 1.09em; } margin-right: 16px; }
/* Screen Shield */ /* Screen Shield */
.screen-shield-arrows { .screen-shield-arrows {
@ -1829,11 +1855,14 @@ StScrollBar {
box-shadow: inset 0 1px 2px 1px rgba(0, 0, 0, 0.2); } box-shadow: inset 0 1px 2px 1px rgba(0, 0, 0, 0.2); }
.login-dialog StEntry .search-entry-icon, .login-dialog StEntry .search-entry-icon,
.search-entry .search-entry-icon { .search-entry .search-entry-icon {
icon-size: 1.09em; icon-size: 16px;
padding: 0 4px; padding: 0 4px;
color: inherit; } color: inherit; }
/* Search */ /* Search */
#searchResultsContent {
max-width: 1024px; }
.search-section { .search-section {
background-color: rgba(58, 65, 68, 0.8); background-color: rgba(58, 65, 68, 0.8);
border-radius: 13px; border-radius: 13px;
@ -1842,91 +1871,8 @@ StScrollBar {
text-shadow: 0 1px rgba(255, 255, 255, 0.2); text-shadow: 0 1px rgba(255, 255, 255, 0.2);
color: #eeeeec; color: #eeeeec;
padding: 18px; padding: 18px;
margin: 4px; } margin: 4px;
spacing: 12px; }
#searchResultsContent {
max-width: 1024px; }
.search-section {
spacing: 0;
margin-top: 0;
margin-bottom: 0; }
.search-section:first-child .search-section-separator, .search-section:last-child .search-section-separator {
background-color: transparent; }
.search-section .search-section-separator {
height: 0px;
background-color: transparent; }
.search-section .search-section-content {
spacing: 0; }
.grid-search-result > .overview-icon {
color: #eeeeec; }
.grid-search-result > .overview-icon.overview-icon-with-label {
padding: 10px 8px 5px 8px;
spacing: 6px; }
.grid-search-result:hover .overview-icon, .grid-search-result:focus .overview-icon, .grid-search-result:selected .overview-icon {
background-color: rgba(46, 52, 54, 0.2);
color: #eeeeec; }
.grid-search-result:drop .overview-icon {
background-color: rgba(33, 93, 156, 0.85); }
.grid-search-result:active .overview-icon, .grid-search-result:checked .overview-icon {
background-color: rgba(23, 25, 26, 0.5); }
.search-provider-icon {
padding: 0;
spacing: 0;
margin-right: 8px; }
.search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover {
background-color: rgba(238, 238, 236, 0.1);
transition-duration: 200ms; }
.search-provider-icon:active, .search-provider-icon:checked {
background-color: rgba(23, 25, 26, 0.9); }
.search-provider-icon .list-search-provider-content {
spacing: 12px; }
.search-provider-icon .list-search-provider-content .list-search-provider-details {
width: 120px;
margin-top: 0;
color: #dbdbd6; }
.list-search-results {
spacing: 6px; }
.list-search-result {
spacing: 0;
padding: 6px;
color: #eeeeec; }
.list-search-result:focus, .list-search-result:selected, .list-search-result:hover {
background-color: rgba(238, 238, 236, 0.1);
transition-duration: 200ms; }
.list-search-result:active, .list-search-result:checked {
background-color: rgba(23, 25, 26, 0.9); }
.list-search-result .list-search-result-content {
spacing: 0; }
.list-search-result .list-search-result-title {
color: #eeeeec;
spacing: 12px;
padding-right: 6px; }
.list-search-result .list-search-result-description {
color: #a6a69b; }
/* Search */
.search-section {
background-color: rgba(58, 65, 68, 0.8);
border-radius: 13px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.9);
text-shadow: 0 1px rgba(255, 255, 255, 0.2);
color: #eeeeec;
padding: 18px;
margin: 4px; }
#searchResultsContent {
max-width: 1024px; }
.search-section {
spacing: 0;
margin-top: 0;
margin-bottom: 0; }
.search-section:first-child .search-section-separator, .search-section:last-child .search-section-separator { .search-section:first-child .search-section-separator, .search-section:last-child .search-section-separator {
background-color: transparent; } background-color: transparent; }
.search-section .search-section-separator { .search-section .search-section-separator {

File diff suppressed because one or more lines are too long

View File

@ -55,13 +55,13 @@ $base_font_size: 11;
$text_shadow_color: if($variant == 'light', rgba(255,255,255,0.3), rgba(0,0,0,0.2)); $text_shadow_color: if($variant == 'light', rgba(255,255,255,0.3), rgba(0,0,0,0.2));
// icons // icons
$base_icon_size: 1.09em; // $base_icon_size: 1.09em;
// $base_icon_size: 16px; $base_icon_size: 16px;
// Stage // Stage
stage { stage {
@include fontsize($base_font_size); @include fontsize($base_font_size);
color: $fg_color; color: $fg_color;
} }
/* WIDGETS */ /* WIDGETS */
@ -92,7 +92,6 @@ stage {
@import 'widgets/scrollbars'; @import 'widgets/scrollbars';
@import 'widgets/search-entry'; @import 'widgets/search-entry';
@import 'widgets/search-results'; @import 'widgets/search-results';
@import 'widgets/search-results';
@import 'widgets/slider'; @import 'widgets/slider';
@import 'widgets/switches'; @import 'widgets/switches';
@import 'widgets/tiled-previews'; @import 'widgets/tiled-previews';
@ -103,139 +102,139 @@ stage {
// Text // Text
%status_text { %status_text {
font-size: 2em; font-size: 2em;
font-weight: bold; font-weight: bold;
color: $osd_fg_color; color: $osd_fg_color;
} }
// osd panels // osd panels
%osd_panel { %osd_panel {
color: $osd_fg_color; color: $osd_fg_color;
background-color: $osd_bg_color; background-color: $osd_bg_color;
border: 1px solid $osd_outer_borders_color; border: 1px solid $osd_outer_borders_color;
border-radius: $base_border_radius * 2 + 4px; border-radius: $base_border_radius * 2 + 4px;
padding: $base_padding * 2; padding: $base_padding * 2;
} }
// Overview panels // Overview panels
// for the dash and workspace switcher // for the dash and workspace switcher
%overview_panel { %overview_panel {
color: $osd_fg_color; color: $osd_fg_color;
background-color: transparentize($osd_bg_color, 0.2); background-color: transparentize($osd_bg_color, 0.2);
border: 1px solid $osd_outer_borders_color; border: 1px solid $osd_outer_borders_color;
} }
// icon tiles // icon tiles
%icon_tile { %icon_tile {
background-color: transparent; // no background background-color: transparent; // no background
color: $osd_fg_color; color: $osd_fg_color;
border-radius: $base_border_radius + 4px; border-radius: $base_border_radius + 4px;
padding: $base_padding; padding: $base_padding;
border: 2px solid transparent; border: 2px solid transparent;
transition-duration: 100ms; transition-duration: 100ms;
text-align: center; text-align: center;
} }
// dialogs // dialogs
%bubble_panel { %bubble_panel {
color: $fg_color; color: $fg_color;
background-color: $bg_color; background-color: $bg_color;
border: 1px solid if($variant=='light', rgba(0,0,0, 0.6), $borders_color); border: 1px solid if($variant=='light', rgba(0,0,0, 0.6), $borders_color);
// entry // entry
StEntry { @extend %bubble_entry;} StEntry { @extend %bubble_entry;}
// button // button
.button { .button {
background-color: $bg_color; background-color: $bg_color;
color: $fg_color; color: $fg_color;
box-shadow: none; box-shadow: none;
&, &:hover, &:focus, &:active, &:disabled { &, &:hover, &:focus, &:active, &:disabled {
border-color: $bubble_borders_color; border-color: $bubble_borders_color;
} }
&:hover { background-color: $hover_bg_color;} &:hover { background-color: $hover_bg_color;}
&:active { &:active {
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
} }
&:disabled { color: $insensitive_fg_color;} &:disabled { color: $insensitive_fg_color;}
} }
} }
// entries in dialogs // entries in dialogs
%bubble_entry { %bubble_entry {
color: $fg_color; color: $fg_color;
background-color: darken($bg_color, 2%); background-color: darken($bg_color, 2%);
border-color: $bubble_borders_color; border-color: $bubble_borders_color;
box-shadow: none; box-shadow: none;
&:focus { border: 2px solid $selected_bg_color;} &:focus { border: 2px solid $selected_bg_color;}
} }
// buttons in dialogs // buttons in dialogs
%bubble_button { %bubble_button {
@include button(normal); @include button(normal);
padding: $base_padding * 2; padding: $base_padding * 2;
border-color: $bubble_borders_color; border-color: $bubble_borders_color;
border-style: solid; border-style: solid;
border-width: 0 !important; border-width: 0 !important;
border-top-width: 1px !important; border-top-width: 1px !important;
box-shadow:none !important; box-shadow:none !important;
&:insensitive { @include button(insensitive);} &:insensitive { @include button(insensitive);}
&:hover { @include button(hover);} &:hover { @include button(hover);}
&:focus { @include button(focus);} &:focus { @include button(focus);}
&:active { @include button(active);} &:active { @include button(active);}
// radius is 2 pixel less to fit in bubble // radius is 2 pixel less to fit in bubble
&:first-child { &:first-child {
border-right-width: 1px !important; border-right-width: 1px !important;
border-radius: 0px 0px 0px $modal_radius - 2px; border-radius: 0px 0px 0px $modal_radius - 2px;
} }
&:last-child { &:last-child {
border-right-width: 0 !important; border-right-width: 0 !important;
border-radius: 0px 0px $modal_radius - 2px 0px; border-radius: 0px 0px $modal_radius - 2px 0px;
} }
&:first-child:last-child { &:first-child:last-child {
border-radius: 0px 0px $modal_radius - 2px $modal_radius - 2px; border-radius: 0px 0px $modal_radius - 2px $modal_radius - 2px;
} }
} }
// button styling // button styling
%button { %button {
border-radius: $base_border_radius; border-radius: $base_border_radius;
border-width: 1px; border-width: 1px;
min-height: 22px; min-height: 22px;
padding: $base_padding * 0.5 $base_padding * 4; padding: $base_padding * 0.5 $base_padding * 4;
@include button(normal); @include button(normal);
&:focus { @include button(focus);} &:focus { @include button(focus);}
&:hover { @include button(hover);} &:hover { @include button(hover);}
&:insensitive { @include button(insensitive);} &:insensitive { @include button(insensitive);}
&:active { @include button(active);} &:active { @include button(active);}
} }
// notification styling // notification styling
%notification_bubble { %notification_bubble {
border-radius:$base_border_radius + 2px; border-radius:$base_border_radius + 2px;
padding: 0; padding: 0;
margin: $base_margin; margin: $base_margin;
@include button(normal); @include button(normal);
&:focus, &:focus,
&:hover { &:hover {
// margin-top: $base_margin - 1px; // margin-top: $base_margin - 1px;
// margin-bottom: $base_margin + 1px; // margin-bottom: $base_margin + 1px;
@include button(hover); @include button(hover);
} }
&:active { &:active {
@include button(active); @include button(active);
// margin: $base_margin; // margin: $base_margin;
} }
} }

View File

@ -4,23 +4,23 @@
@function draw_widget_edge($c:$borders_edge) { @function draw_widget_edge($c:$borders_edge) {
// outer highlight "used" on most widgets // outer highlight "used" on most widgets
@return 0 1px $c; @return 0 1px $c;
} }
// provide font size in rem, with px fallback // provide font size in rem, with px fallback
@mixin fontsize($size: 24, $base: 16) { @mixin fontsize($size: 24, $base: 16) {
font-size: round($size) + pt; font-size: round($size) + pt;
//font-size: ($size / $base) * 1rem; //font-size: ($size / $base) * 1rem;
} }
@mixin draw_shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) { @mixin draw_shadows($shadow1, $shadow2:none, $shadow3:none, $shadow4:none) {
// //
// Helper function to stack up to 4 box-shadows; // Helper function to stack up to 4 box-shadows;
// //
@if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; } @if $shadow4!=none { box-shadow: $shadow1, $shadow2, $shadow3, $shadow4; }
@else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; } @else if $shadow3!=none { box-shadow: $shadow1, $shadow2, $shadow3; }
@else if $shadow2!=none { box-shadow: $shadow1, $shadow2; } @else if $shadow2!=none { box-shadow: $shadow1, $shadow2; }
@else { box-shadow: $shadow1; } @else { box-shadow: $shadow1; }
} }
// entries // entries
@ -37,31 +37,31 @@
// normal, focus, insensitive // normal, focus, insensitive
// //
@if $t==normal { @if $t==normal {
background-color: $base_color; background-color: $base_color;
border-color: $borders_color; border-color: $borders_color;
} }
@if $t==focus { @if $t==focus {
border-color: if($fc==$selected_bg_color, border-color: if($fc==$selected_bg_color,
$selected_borders_color, $selected_borders_color,
darken($fc,35%)); darken($fc,35%));
} }
@if $t==hover { } @if $t==hover { }
@if $t==insensitive { @if $t==insensitive {
color: $insensitive_fg_color; color: $insensitive_fg_color;
border-color: $insensitive_bg_color; border-color: $insensitive_bg_color;
box-shadow: none; box-shadow: none;
} }
} }
// buttons // buttons
@function draw_border_color ($c) { @function draw_border_color ($c) {
// //
// colored buttons want the border form the base color // colored buttons want the border form the base color
// //
@return if($variant == 'light', darken($c, 18%), darken($c, 4%)); @return if($variant == 'light', darken($c, 18%), darken($c, 4%));
} }
@function draw_text_shadow_color ($tc:$fg_color, $bg:$bg_color) { @function draw_text_shadow_color ($tc:$fg_color, $bg:$bg_color) {
@ -71,9 +71,9 @@
// $tc is the text color // $tc is the text color
// $bg is the background color // $bg is the background color
// //
$lbg: lightness($bg)/100%; $lbg: lightness($bg)/100%;
@if lightness($tc)<50% { @return rgba(255,255,255,$lbg/($lbg*1.3)); } @if lightness($tc)<50% { @return rgba(255,255,255,$lbg/($lbg*1.3)); }
@else { @return rgba(0,0,0,1-$lbg*0.8); } @else { @return rgba(0,0,0,1-$lbg*0.8); }
} }
@function draw_button_hilight_color($c) { @function draw_button_hilight_color($c) {
@ -82,11 +82,11 @@
// //
// $c: base color; // $c: base color;
// //
@if lightness($c)>90% { @return white; } @if lightness($c)>90% { @return white; }
@else if lightness($c)>80% { @return rgba(255,255,255, 0.7); } @else if lightness($c)>80% { @return rgba(255,255,255, 0.7); }
@else if lightness($c)>50% { @return rgba(255,255,255, 0.5); } @else if lightness($c)>50% { @return rgba(255,255,255, 0.5); }
@else if lightness($c)>40% { @return rgba(255,255,255, 0.3); } @else if lightness($c)>40% { @return rgba(255,255,255, 0.3); }
@else { @return rgba(255,255,255, 0.1); } @else { @return rgba(255,255,255, 0.1); }
} }
@mixin draw_button_text_shadow ($tc:$fg_color, $bg:$bg_color) { @mixin draw_button_text_shadow ($tc:$fg_color, $bg:$bg_color) {
@ -98,16 +98,16 @@
// TODO: this functions needs a way to deal with special cases // TODO: this functions needs a way to deal with special cases
// //
$shadow: draw_text_shadow_color($tc, $bg); $shadow: draw_text_shadow_color($tc, $bg);
@if lightness($tc)<50% { @if lightness($tc)<50% {
text-shadow: 0 1px $shadow; text-shadow: 0 1px $shadow;
icon-shadow: 0 1px $shadow; icon-shadow: 0 1px $shadow;
} }
@else { @else {
text-shadow: 0 -1px $shadow; text-shadow: 0 -1px $shadow;
icon-shadow: 0 -1px $shadow; icon-shadow: 0 -1px $shadow;
} }
} }
@mixin button($t, $c:$bg_color, $tc:$fg_color, $edge: $borders_edge) { @mixin button($t, $c:$bg_color, $tc:$fg_color, $edge: $borders_edge) {
@ -126,75 +126,75 @@
// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated // osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
// //
$hilight_color: draw_button_hilight_color($c); $hilight_color: draw_button_hilight_color($c);
$button_edge: if($edge == none, none, draw_widget_edge($edge)); $button_edge: if($edge == none, none, draw_widget_edge($edge));
$blank_edge: if($edge == none, none, draw_widget_edge(transparentize($edge,1))); $blank_edge: if($edge == none, none, draw_widget_edge(transparentize($edge,1)));
// normal button // normal button
@if $t==normal { @if $t==normal {
color: $tc; color: $tc;
background-color: lighten($c, 3%) !important; background-color: lighten($c, 3%) !important;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
border-color: draw_border_color($c); border-color: draw_border_color($c);
@include draw_shadows(0 1px 1px 0 $shadow_color); @include draw_shadows(0 1px 1px 0 $shadow_color);
// box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); // box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
text-shadow: 0 1px $text_shadow_color; text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color; icon-shadow: 0 1px $text_shadow_color;
} }
// focused button // focused button
@if $t==focus { @if $t==focus {
color: $tc; color: $tc;
text-shadow: 0 1px $text_shadow_color; text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color; icon-shadow: 0 1px $text_shadow_color;
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.7); box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.7);
//border-color: $selected_bg_color; //border-color: $selected_bg_color;
} }
// hover osd button // hover osd button
@else if $t==hover { @else if $t==hover {
color: $tc; color: $tc;
background-color: lighten($c, if($variant == 'light', 8%, 5%)) !important; background-color: lighten($c, if($variant == 'light', 8%, 5%)) !important;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
border-color: if($variant == 'light', draw_border_color(lighten($c, 7%)), draw_border_color($c)); border-color: if($variant == 'light', draw_border_color(lighten($c, 7%)), draw_border_color($c));
@include draw_shadows(0 1px 1px 0 $shadow_color); @include draw_shadows(0 1px 1px 0 $shadow_color);
text-shadow: 0 1px $text_shadow_color; text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color; icon-shadow: 0 1px $text_shadow_color;
} }
// active osd button // active osd button
@else if $t==active { @else if $t==active {
color: $tc; color: $tc;
background-color: darken($c,3%) !important; background-color: darken($c,3%) !important;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
border-color: draw_border_color(if($variant == 'light', $c, darken($c,7%))); border-color: draw_border_color(if($variant == 'light', $c, darken($c,7%)));
text-shadow: none; text-shadow: none;
icon-shadow: none; icon-shadow: none;
box-shadow: none; box-shadow: none;
} }
// insensitive button // insensitive button
@else if $t==insensitive { @else if $t==insensitive {
color: $insensitive_fg_color; color: $insensitive_fg_color;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
border-color: $insensitive_borders_color; border-color: $insensitive_borders_color;
background-color: $insensitive_bg_color !important; background-color: $insensitive_bg_color !important;
box-shadow: none; box-shadow: none;
text-shadow: none; text-shadow: none;
icon-shadow: none; icon-shadow: none;
} }
// reset // reset
@else if $t==undecorated { @else if $t==undecorated {
border-color: transparent; border-color: transparent;
background-color: transparent; background-color: transparent;
background-image: none; background-image: none;
@include draw_shadows(inset 0 1px rgba(255,255,255,0),$blank_edge); @include draw_shadows(inset 0 1px rgba(255,255,255,0),$blank_edge);
text-shadow: none; text-shadow: none;
icon-shadow: none; icon-shadow: none;
} }
} }

View File

@ -5,13 +5,13 @@ $app_icon_padding: 20px;
// app icons // app icons
.icon-grid { .icon-grid {
spacing: 30px; spacing: 30px;
-shell-grid-horizontal-item-size: $app_icon_size + $app_icon_padding * 2; -shell-grid-horizontal-item-size: $app_icon_size + $app_icon_padding * 2;
-shell-grid-vertical-item-size: $app_icon_size + $app_icon_padding * 2; -shell-grid-vertical-item-size: $app_icon_size + $app_icon_padding * 2;
.overview-icon { .overview-icon {
icon-size: $app_icon_size; icon-size: $app_icon_size;
} }
} }
//.app-display { spacing: 20px; } //.app-display { spacing: 20px; }
@ -22,135 +22,135 @@ $app_grid_fg_color: #fff;
// Outline for low res icons // Outline for low res icons
.lowres-icon { .lowres-icon {
icon-shadow: 0 1px 2px rgba(0,0,0,0.3); icon-shadow: 0 1px 2px rgba(0,0,0,0.3);
} }
// Dropshadow for large icons // Dropshadow for large icons
.icon-dropshadow { .icon-dropshadow {
icon-shadow: 0 1px 2px rgba(0,0,0,0.4); icon-shadow: 0 1px 2px rgba(0,0,0,0.4);
} }
// Icon tiles in the app grid // Icon tiles in the app grid
.app-well-app, .app-well-app,
.app-folder { .app-folder {
.overview-icon { .overview-icon {
@extend %icon_tile; @extend %icon_tile;
color: $app_grid_fg_color !important; color: $app_grid_fg_color !important;
} }
&:hover, &:hover,
&:selected { &:selected {
.overview-icon { .overview-icon {
background-color: transparentize($osd_bg_color,0.7); background-color: transparentize($osd_bg_color,0.7);
color: $app_grid_fg_color; color: $app_grid_fg_color;
} }
} }
&:hover .overview-icon, &:hover .overview-icon,
&:focus .overview-icon, &:focus .overview-icon,
&:selected .overview-icon { &:selected .overview-icon {
background-color: transparentize($osd_fg_color,0.9); background-color: transparentize($osd_fg_color,0.9);
color: $osd_fg_color; color: $osd_fg_color;
} }
&:focus { &:focus {
.overview-icon { .overview-icon {
background-color: transparentize($osd_fg_color,0.7 ); background-color: transparentize($osd_fg_color,0.7 );
// border-color: $selected_bg_color; // border-color: $selected_bg_color;
color: $app_grid_fg_color; color: $app_grid_fg_color;
} }
} }
&:drop { &:drop {
.overview-icon { .overview-icon {
background-color: transparentize($selected_bg_color,.15); background-color: transparentize($selected_bg_color,.15);
} }
} }
&:active, &:active,
&:checked { &:checked {
.overview-icon { .overview-icon {
background-color: transparentize(darken($osd_bg_color,10%), 0.5); background-color: transparentize(darken($osd_bg_color,10%), 0.5);
} }
} }
} }
/* App Folders */ /* App Folders */
.app-folder { .app-folder {
.overview-icon { .overview-icon {
@extend %icon_tile; @extend %icon_tile;
} }
} }
//expanded folder //expanded folder
.app-folder-popup { .app-folder-popup {
-arrow-border-radius: 8px; -arrow-border-radius: 8px;
-arrow-background-color: transparentize(darken($osd_bg_color,10%), 0.5); -arrow-background-color: transparentize(darken($osd_bg_color,10%), 0.5);
-arrow-base: 24px; -arrow-base: 24px;
-arrow-rise: 11px; -arrow-rise: 11px;
} }
.app-folder-popup-bin { padding: 5px; } .app-folder-popup-bin { padding: 5px; }
.app-folder-icon { .app-folder-icon {
padding: $base_padding; padding: $base_padding;
spacing-rows: $base_spacing; spacing-rows: $base_spacing;
spacing-columns: $base_spacing; spacing-columns: $base_spacing;
} }
// Running app indicator (also shown in dash) // Running app indicator (also shown in dash)
.app-well-app-running-dot { .app-well-app-running-dot {
height: 5px; height: 5px;
width: 5px; width: 5px;
border-radius:5px; border-radius:5px;
background-color: $osd_fg_color; background-color: $osd_fg_color;
margin-bottom: 1px; margin-bottom: 1px;
} }
// Rename popup for app folders // Rename popup for app folders
.rename-folder-popup { .rename-folder-popup {
.rename-folder-popup-item { .rename-folder-popup-item {
spacing: $base_spacing; spacing: $base_spacing;
&:ltr, &:rtl { padding: 0, $base_padding * 2; } &:ltr, &:rtl { padding: 0, $base_padding * 2; }
} }
} }
// right-click app menu // right-click app menu
.app-menu, .app-menu,
.app-well-menu { .app-well-menu {
max-width: 27.25em; max-width: 27.25em;
} }
// App Grid pagination indicators // App Grid pagination indicators
.page-indicator { .page-indicator {
padding: 15px 20px; padding: 15px 20px;
.page-indicator-icon { .page-indicator-icon {
width: 12px; width: 12px;
height: 12px; height: 12px;
background-color: transparent; background-color: transparent;
border: 2px solid rgba(255, 255, 255, 0.4); border: 2px solid rgba(255, 255, 255, 0.4);
border-radius: 12px; border-radius: 12px;
} }
&:hover .page-indicator-icon { border-color: white; } &:hover .page-indicator-icon { border-color: white; }
&:active .page-indicator-icon { border: none; margin: 2px; background-color: white; } &:active .page-indicator-icon { border: none; margin: 2px; background-color: white; }
&:checked .page-indicator-icon, &:checked .page-indicator-icon,
&:checked:active .page-indicator-icon { background-color: white;} &:checked:active .page-indicator-icon { background-color: white;}
} }
// Some hacks I don't even know // Some hacks I don't even know
.all-apps, .all-apps,
.frequent-apps > StBoxLayout { .frequent-apps > StBoxLayout {
// horizontal padding to make sure scrollbars or dash don't overlap content // horizontal padding to make sure scrollbars or dash don't overlap content
padding: 0px 88px 10px 88px; padding: 0px 88px 10px 88px;
} }
.app-well-app > .overview-icon.overview-icon-with-label { .app-well-app > .overview-icon.overview-icon-with-label {
padding: 10px 8px 5px 8px; padding: 10px 8px 5px 8px;
spacing: $base_spacing; spacing: $base_spacing;
} }
// Label when no frequent apps // Label when no frequent apps
@ -158,52 +158,52 @@ $app_grid_fg_color: #fff;
// shutdown and other actions in the grid // shutdown and other actions in the grid
.system-action-icon { .system-action-icon {
background-color: rgba(0,0,0,0.8); background-color: rgba(0,0,0,0.8);
color: #fff; color: #fff;
border-radius: 50%; border-radius: 50%;
icon-size: $app_icon_size * 0.5; icon-size: $app_icon_size * 0.5;
} }
/* Frequent | All toggle */ /* Frequent | All toggle */
// container // container
.app-view-controls { .app-view-controls {
padding-bottom: 32px; padding-bottom: 32px;
} }
// buttons // buttons
.app-view-control { .app-view-control {
padding: 4px 32px; padding: 4px 32px;
margin: 0; margin: 0;
background-color: transparentize($osd_bg_color, 0.5); background-color: transparentize($osd_bg_color, 0.5);
border-width: 1px; border-width: 1px;
color: darken($osd_fg_color, 25%); color: darken($osd_fg_color, 25%);
&:hover { &:hover {
background-color: transparentize($osd_bg_color, 0.5) !important; background-color: transparentize($osd_bg_color, 0.5) !important;
box-shadow:none !important; box-shadow:none !important;
color: darken($osd_fg_color, 25%); color: darken($osd_fg_color, 25%);
} }
&:active { &:active {
box-shadow: inset 0 -2px 0 0 $osd_fg_color; box-shadow: inset 0 -2px 0 0 $osd_fg_color;
background-color: transparentize($selected_bg_color, 0.5) !important; background-color: transparentize($selected_bg_color, 0.5) !important;
font-weight: bold; font-weight: bold;
} }
&:checked { &:checked {
background-color: transparentize(lighten($osd_bg_color, 20%), 0.5); background-color: transparentize(lighten($osd_bg_color, 20%), 0.5);
color: $osd_fg_color; color: $osd_fg_color;
box-shadow: none; box-shadow: none;
font-weight: bold; font-weight: bold;
} }
&:first-child { &:first-child {
border-right-width: 0 !important; border-right-width: 0 !important;
border-radius: $base_border_radius 0 0 $base_border_radius; border-radius: $base_border_radius 0 0 $base_border_radius;
} }
&:last-child { &:last-child {
border-radius: 0 $base_border_radius $base_border_radius 0; border-radius: 0 $base_border_radius $base_border_radius 0;
} }
} }

View File

@ -1,55 +1,55 @@
/* App Switcher */ /* App Switcher */
.switcher-popup { .switcher-popup {
padding: 8px; padding: 8px;
spacing: $base_spacing * 4; spacing: $base_spacing * 4;
} }
// switcher onscreen panel // switcher onscreen panel
.switcher-list { .switcher-list {
@extend %osd_panel; @extend %osd_panel;
.item-box { .item-box {
padding: 8px; padding: 8px;
border-radius: $base_border_radius + 1px; border-radius: $base_border_radius + 1px;
border: 1px solid transparent; border: 1px solid transparent;
&:outlined { &:outlined {
border: 1px solid darken($borders_color,5%); border: 1px solid darken($borders_color,5%);
background-color: transparentize($osd_fg_color, 0.9); background-color: transparentize($osd_fg_color, 0.9);
box-shadow: inset 0 2px 2px 0 rgba(0,0,0,0.4); box-shadow: inset 0 2px 2px 0 rgba(0,0,0,0.4);
} }
&:selected { &:selected {
background-color: transparentize($osd_fg_color, 0.9); background-color: transparentize($osd_fg_color, 0.9);
color: $osd_fg_color; color: $osd_fg_color;
} }
} }
// window thumbnails // window thumbnails
.thumbnail-box { .thumbnail-box {
padding: 2px; padding: 2px;
spacing: $base_spacing; spacing: $base_spacing;
} }
.thumbnail { .thumbnail {
width: 256px; width: 256px;
} }
.separator { .separator {
width: 1px; width: 1px;
background: $borders_color; background: $borders_color;
} }
.switcher-list-item-container { .switcher-list-item-container {
spacing: $base_spacing * 2; spacing: $base_spacing * 2;
} }
} }
.switcher-arrow { .switcher-arrow {
border-color: rgba(0,0,0,0); border-color: rgba(0,0,0,0);
color: transparentize($fg_color,0.2); color: transparentize($fg_color,0.2);
&:highlighted { &:highlighted {
color: $fg_color; color: $fg_color;
} }
} }

View File

@ -1,5 +1,5 @@
/* Buttons */ /* Buttons */
.button { .button {
@extend %button; // that's it @extend %button; // that's it
} }

View File

@ -2,267 +2,267 @@
// overall menu // overall menu
#calendarArea { #calendarArea {
padding:0; padding:0;
margin:0; margin:0;
} }
// Calendar menu side column // Calendar menu side column
.datemenu-calendar-column { .datemenu-calendar-column {
spacing: 0; spacing: 0;
border: 0 solid $bubble_borders_color; border: 0 solid $bubble_borders_color;
padding: $base_padding + $base_margin; padding: $base_padding + $base_margin;
padding-bottom: 3em; // account for the notifications clear button padding-bottom: 3em; // account for the notifications clear button
padding-top:0; padding-top:0;
&:ltr { border-left-width: 1px; } &:ltr { border-left-width: 1px; }
&:rtl { border-right-width: 1px; } &:rtl { border-right-width: 1px; }
// today button (the date) // today button (the date)
.datemenu-today-button { .datemenu-today-button {
padding: $base_padding * 1.5; padding: $base_padding * 1.5;
margin: $base_margin; margin: $base_margin;
border: 1px solid transparent; border: 1px solid transparent;
&:focus, &:focus,
&:hover { &:hover {
border-radius:$base_border_radius + 2px; border-radius:$base_border_radius + 2px;
margin-top: $base_margin - 1px; margin-top: $base_margin - 1px;
margin-bottom: $base_margin + 1px; margin-bottom: $base_margin + 1px;
} }
&:hover { @include button(hover);} &:hover { @include button(hover);}
&:focus { @include button(focus);} &:focus { @include button(focus);}
&:active { &:active {
@include button(active); @include button(active);
margin: $base_margin; margin: $base_margin;
} }
// weekday label // weekday label
.day-label { .day-label {
font-size: $base_font_size + 1pt; font-size: $base_font_size + 1pt;
font-weight: bold; font-weight: bold;
} }
// date label // date label
.date-label { .date-label {
font-size: $base_font_size * 1.5; font-size: $base_font_size * 1.5;
font-weight: 1000; font-weight: 1000;
} }
} }
// calendar // calendar
.calendar { .calendar {
@extend %notification_bubble; @extend %notification_bubble;
margin:$base_margin !important; margin:$base_margin !important;
margin-bottom: $base_padding + $base_margin !important; margin-bottom: $base_padding + $base_margin !important;
padding:$base_padding !important; padding:$base_padding !important;
// more below for sub-elements // more below for sub-elements
} }
.datemenu-displays-section { .datemenu-displays-section {
margin:0; margin:0;
} }
.datemenu-displays-box { .datemenu-displays-box {
spacing: $base_spacing; spacing: $base_spacing;
margin:0; margin:0;
// world clocks and weather // world clocks and weather
.world-clocks-button, .world-clocks-button,
.weather-button { .weather-button {
@extend %notification_bubble; @extend %notification_bubble;
padding:$base_padding !important; padding:$base_padding !important;
} }
} }
} }
.events-section-title { .events-section-title {
color: desaturate(darken($fg_color,40%), 10%); color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold; font-weight: bold;
border-radius: 4px; border-radius: 4px;
padding: .4em; padding: .4em;
} }
/* Calendar */ /* Calendar */
.calendar { .calendar {
// month // month
.calendar-month-label { .calendar-month-label {
color: lighten($fg_color,5%); color: lighten($fg_color,5%);
font-weight: bold; font-weight: bold;
padding: 8px 0; padding: 8px 0;
&:focus {} &:focus {}
} }
// prev/next month icons // prev/next month icons
.calendar-change-month-back StIcon, .calendar-change-month-back StIcon,
.calendar-change-month-forward StIcon { .calendar-change-month-forward StIcon {
icon-size: $base_icon_size; icon-size: $base_icon_size;
} }
.pager-button { .pager-button {
background-color: transparent; background-color: transparent;
height: 32px; height: 32px;
width: 32px; width: 32px;
border-radius: $base_border_radius; border-radius: $base_border_radius;
&:hover, &:focus { background-color: lighten($hover_bg_color, 5%); } &:hover, &:focus { background-color: lighten($hover_bg_color, 5%); }
&:active { background-color: $active_bg_color; } &:active { background-color: $active_bg_color; }
} }
$calendar_day_size: 32px; $calendar_day_size: 32px;
.calendar-day-base { .calendar-day-base {
font-size: 80%; font-size: 80%;
text-align: center; text-align: center;
width: $calendar_day_size; width: $calendar_day_size;
height: $calendar_day_size; height: $calendar_day_size;
padding: 0; padding: 0;
margin: 2px; margin: 2px;
border-radius: $calendar_day_size * 0.5 + 2px; border-radius: $calendar_day_size * 0.5 + 2px;
border: 1px solid transparent; //avoid jumparound due to today border: 1px solid transparent; //avoid jumparound due to today
font-feature-settings: "tnum"; font-feature-settings: "tnum";
&:hover, &:focus { background-color: $hover_bg_color; } &:hover, &:focus { background-color: $hover_bg_color; }
&:active,&:selected { &:active,&:selected {
color: lighten($fg_color,10%); color: lighten($fg_color,10%);
background-color: darken($bg_color,5%); background-color: darken($bg_color,5%);
} }
// day of week heading // day of week heading
&.calendar-day-heading { &.calendar-day-heading {
color: lighten($fg_color,10%); color: lighten($fg_color,10%);
margin-top: 1em; margin-top: 1em;
font-size: 70%; font-size: 70%;
} }
} }
.calendar-day { //border collapse hack - see calendar.js .calendar-day { //border collapse hack - see calendar.js
border-width: 0; border-width: 0;
} }
.calendar-day-top { .calendar-day-top {
border-top-width: 1px; border-top-width: 1px;
} }
.calendar-day-left { border-left-width: 1px; } .calendar-day-left { border-left-width: 1px; }
.calendar-work-day {} .calendar-work-day {}
.calendar-nonwork-day { .calendar-nonwork-day {
color: $insensitive_fg_color; color: $insensitive_fg_color;
} }
// Today // Today
.calendar-today { .calendar-today {
font-weight: bold; font-weight: bold;
border: 1px solid transparent; border: 1px solid transparent;
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
&:hover,&:focus { &:hover,&:focus {
background-color:lighten($selected_bg_color, 3%); background-color:lighten($selected_bg_color, 3%);
color: $selected_fg_color; color: $selected_fg_color;
} }
&:active,&:selected { &:active,&:selected {
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
&:hover,&:focus { &:hover,&:focus {
background-color:lighten($selected_bg_color, 3%); background-color:lighten($selected_bg_color, 3%);
color: $selected_fg_color; color: $selected_fg_color;
} }
} }
} }
.calendar-day-with-events { .calendar-day-with-events {
color: lighten($fg_color,10%); color: lighten($fg_color,10%);
font-weight: bold; font-weight: bold;
background-image: url("resource:///org/gnome/shell/theme/calendar-today.svg"); background-image: url("resource:///org/gnome/shell/theme/calendar-today.svg");
} }
.calendar-other-month-day { .calendar-other-month-day {
color: transparentize($fg_color ,0.5); color: transparentize($fg_color ,0.5);
opacity: 0.5; opacity: 0.5;
} }
.calendar-week-number { .calendar-week-number {
font-size: 70%; font-size: 70%;
font-weight: bold; font-weight: bold;
height: 1.8em; height: 1.8em;
width: 2.3em; width: 2.3em;
border-radius: 2px; border-radius: 2px;
padding: 0.5em 0 0; padding: 0.5em 0 0;
margin: 6px; margin: 6px;
background-color: darken($bg_color, 2%); background-color: darken($bg_color, 2%);
color: lighten($fg_color, 5%); color: lighten($fg_color, 5%);
} }
} }
/* Weather */ /* Weather */
.weather-box { .weather-box {
spacing: $base_spacing; spacing: $base_spacing;
padding:$base_padding; padding:$base_padding;
.weather-header { .weather-header {
color: desaturate(darken($fg_color,40%), 10%); color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold; font-weight: bold;
&.location { &.location {
font-weight: normal; font-weight: normal;
font-size: $base_font_size - 1pt; font-size: $base_font_size - 1pt;
} }
} }
.weather-grid { .weather-grid {
margin-top: $base_margin; margin-top: $base_margin;
spacing-rows: $base_spacing; spacing-rows: $base_spacing;
spacing-columns: $base_spacing * 2; spacing-columns: $base_spacing * 2;
} }
.weather-forecast-icon { .weather-forecast-icon {
icon-size: $base_icon_size * 2; icon-size: $base_icon_size * 2;
} }
.weather-forecast-time { .weather-forecast-time {
color: darken($fg_color,30%); color: darken($fg_color,30%);
font-feature-settings: "tnum"; font-feature-settings: "tnum";
font-size: $base_font_size - 2pt; font-size: $base_font_size - 2pt;
font-weight: normal; font-weight: normal;
} }
} }
/* World clocks */ /* World clocks */
.world-clocks-grid { .world-clocks-grid {
padding:$base_padding; padding:$base_padding;
spacing-rows: $base_spacing; spacing-rows: $base_spacing;
spacing-columns: $base_spacing * 2; spacing-columns: $base_spacing * 2;
// title // title
.world-clocks-header { .world-clocks-header {
color: desaturate(darken($fg_color,40%), 10%); color: desaturate(darken($fg_color,40%), 10%);
font-weight: bold; font-weight: bold;
} }
// city label // city label
.world-clocks-city { .world-clocks-city {
color: $fg_color; color: $fg_color;
font-size: $base_font_size; font-size: $base_font_size;
font-weight: normal; font-weight: normal;
} }
// timezone time // timezone time
.world-clocks-time { .world-clocks-time {
font-weight: bold; font-weight: bold;
color: $fg_color; color: $fg_color;
font-feature-settings: "lnum"; font-feature-settings: "lnum";
font-size: $base_font_size; font-size: $base_font_size;
text-align:right; text-align:right;
} }
// timezone offset label // timezone offset label
.world-clocks-timezone { .world-clocks-timezone {
color: darken($fg_color,20%); color: darken($fg_color,20%);
font-feature-settings: "tnum"; font-feature-settings: "tnum";
font-size: $base_font_size - 1pt; font-size: $base_font_size - 1pt;
} }
} }

View File

@ -6,13 +6,13 @@ $check_width: 24px;
.check-box { .check-box {
StBoxLayout { spacing: .8em; } StBoxLayout { spacing: .8em; }
StBin { StBin {
width: $check_width; width: $check_width;
height: $check_height; height: $check_height;
background-image: url("resource:///org/gnome/shell/theme/checkbox-off.svg"); background-image: url("resource:///org/gnome/shell/theme/checkbox-off.svg");
} }
&:focus StBin { background-image: url("resource:///org/gnome/shell/theme/checkbox-off-focused.svg"); } &:focus StBin { background-image: url("resource:///org/gnome/shell/theme/checkbox-off-focused.svg"); }
&:checked StBin { background-image: url("resource:///org/gnome/shell/theme/checkbox.svg"); } &:checked StBin { background-image: url("resource:///org/gnome/shell/theme/checkbox.svg"); }
&:focus:checked StBin { background-image: url("resource:///org/gnome/shell/theme/checkbox-focused.svg"); } &:focus:checked StBin { background-image: url("resource:///org/gnome/shell/theme/checkbox-focused.svg"); }
} }

View File

@ -3,22 +3,22 @@
$ripple_size: 50px; $ripple_size: 50px;
.ripple-box { .ripple-box {
background-color: lighten(transparentize($selected_bg_color, 0.7), 40%); background-color: lighten(transparentize($selected_bg_color, 0.7), 40%);
box-shadow: 0 0 2px 2px lighten($selected_bg_color, 20%); box-shadow: 0 0 2px 2px lighten($selected_bg_color, 20%);
// plus + 2px for the border (box-shadow) // plus + 2px for the border (box-shadow)
width: $ripple_size + 2px; width: $ripple_size + 2px;
height: $ripple_size + 2px; height: $ripple_size + 2px;
border-radius: 0 0 $ripple_size + 2px 0; // radius equals the size of the box to give us the curve border-radius: 0 0 $ripple_size + 2px 0; // radius equals the size of the box to give us the curve
// just a simple change to the border radius position // just a simple change to the border radius position
&:rtl { border-radius: 0 0 0 $ripple_size + 2px; } &:rtl { border-radius: 0 0 0 $ripple_size + 2px; }
} }
// Pointer location // Pointer location
.ripple-pointer-location { .ripple-pointer-location {
width: $ripple_size; width: $ripple_size;
height: $ripple_size; height: $ripple_size;
border-radius: $ripple_size * 0.5; // radius equals the size of the box to give us the curve border-radius: $ripple_size * 0.5; // radius equals the size of the box to give us the curve
background-color: lighten(transparentize($selected_bg_color, 0.7), 30%); background-color: lighten(transparentize($selected_bg_color, 0.7), 30%);
box-shadow: 0 0 2px 2px lighten($selected_bg_color, 20%); box-shadow: 0 0 2px 2px lighten($selected_bg_color, 20%);
} }

View File

@ -4,81 +4,81 @@ $dash_placeholder_size: 32px;
$dash_border_radius: $modal_radius * 1.5; $dash_border_radius: $modal_radius * 1.5;
#dash { #dash {
@extend %overview_panel; @extend %overview_panel;
font-size: $base_font_size - 2pt; font-size: $base_font_size - 2pt;
padding: 0; padding: 0;
padding-bottom: $base_padding + 4px; padding-bottom: $base_padding + 4px;
//fixme: can't have non uniform borders :( //fixme: can't have non uniform borders :(
border-radius: 0 $dash_border_radius $dash_border_radius 0; border-radius: 0 $dash_border_radius $dash_border_radius 0;
border-left-width: 0 !important; border-left-width: 0 !important;
&:rtl { &:rtl {
border-radius: $dash_border_radius 0 0 $dash_border_radius; border-radius: $dash_border_radius 0 0 $dash_border_radius;
border-right-width: 0 !important; border-right-width: 0 !important;
} }
.placeholder { .placeholder {
// background-image: url("resource:///org/gnome/shell/theme/dash-placeholder.svg"); // background-image: url("resource:///org/gnome/shell/theme/dash-placeholder.svg");
background-image:none; background-image:none;
background-size: contain; background-size: contain;
height: $dash_placeholder_size; height: $dash_placeholder_size;
} }
.empty-dash-drop-target { .empty-dash-drop-target {
width: $dash_placeholder_size; width: $dash_placeholder_size;
height: $dash_placeholder_size; height: $dash_placeholder_size;
} }
} }
// Dash Items // Dash Items
.dash-item-container > StWidget { .dash-item-container > StWidget {
padding: $base_padding + 4px; padding: $base_padding + 4px;
padding-bottom: 0; padding-bottom: 0;
} }
// OSD Tooltip // OSD Tooltip
.dash-label { .dash-label {
background-color: transparentize($osd_bg_color,0.05); background-color: transparentize($osd_bg_color,0.05);
border-radius: $base_border_radius + 2px; border-radius: $base_border_radius + 2px;
border:none; border:none;
box-shadow:0 0 0 1px $osd_outer_borders_color; box-shadow:0 0 0 1px $osd_outer_borders_color;
color: $osd_fg_color; color: $osd_fg_color;
padding: $base_padding $base_padding + 2px; padding: $base_padding $base_padding + 2px;
text-align: center; text-align: center;
margin-top: $base_margin + 4px; margin-top: $base_margin + 4px;
-x-offset: $base_margin * 2; // distance from the dash edge -x-offset: $base_margin * 2; // distance from the dash edge
} }
// Show apps button // Show apps button
.show-apps { .show-apps {
background-color: transparent; background-color: transparent;
color: $osd_fg_color; color: $osd_fg_color;
& .overview-icon { & .overview-icon {
@extend %icon_tile; @extend %icon_tile;
color: $osd_fg_color; color: $osd_fg_color;
} }
&:hover .overview-icon, &:hover .overview-icon,
&:focus .overview-icon, &:focus .overview-icon,
&:selected .overview-icon { &:selected .overview-icon {
background-color: transparentize($osd_fg_color,0.9); background-color: transparentize($osd_fg_color,0.9);
color: $osd_fg_color; color: $osd_fg_color;
} }
&:drop .overview-icon { &:drop .overview-icon {
background-color: transparentize($selected_bg_color,.15); background-color: transparentize($selected_bg_color,.15);
} }
&:active .overview-icon, &:active .overview-icon,
&:checked .overview-icon { &:checked .overview-icon {
background-color: darken($osd_bg_color,10%); background-color: darken($osd_bg_color,10%);
} }
&:checked .show-apps-icon, &:checked .show-apps-icon,
&:focus .show-apps-icon { &:focus .show-apps-icon {
color: $fg_color; color: $fg_color;
transition-duration: 100ms; transition-duration: 100ms;
} }
} }

View File

@ -1,280 +1,280 @@
/* Modal Dialogs */ /* Modal Dialogs */
.modal-dialog { .modal-dialog {
border-radius: $modal_radius; border-radius: $modal_radius;
@extend %bubble_panel; @extend %bubble_panel;
.modal-dialog-content-box { .modal-dialog-content-box {
padding: 24px; padding: 24px;
} }
.run-dialog-entry { width: 20em; margin-bottom: 6px; } .run-dialog-entry { width: 20em; margin-bottom: 6px; }
.run-dialog-error-box { .run-dialog-error-box {
padding-top: 16px; padding-top: 16px;
spacing: 6px; spacing: 6px;
} }
.run-dialog-button-box { padding-top: 1em; } .run-dialog-button-box { padding-top: 1em; }
.run-dialog-label { .run-dialog-label {
@include fontsize($base_font_size + 1.1); @include fontsize($base_font_size + 1.1);
font-weight: normal; font-weight: normal;
color: $fg_color; color: $fg_color;
padding-bottom: .4em; padding-bottom: .4em;
} }
} }
.mount-dialog-subject, .mount-dialog-subject,
.end-session-dialog-subject { //this should be a generic header class .end-session-dialog-subject { //this should be a generic header class
@include fontsize($base_font_size * 1.3); @include fontsize($base_font_size * 1.3);
} }
.modal-dialog-linked-button { .modal-dialog-linked-button {
@extend %bubble_button; @extend %bubble_button;
} }
/* Message Dialog */ /* Message Dialog */
.message-dialog-main-layout { .message-dialog-main-layout {
padding: 12px 20px 0; padding: 12px 20px 0;
spacing: 12px; spacing: 12px;
} }
.message-dialog-content { .message-dialog-content {
max-width: 28em; max-width: 28em;
spacing: 20px; spacing: 20px;
} }
.message-dialog-icon { .message-dialog-icon {
min-width: $base_icon_size * 3; min-width: $base_icon_size * 3;
icon-size: $base_icon_size * 3; icon-size: $base_icon_size * 3;
} }
.message-dialog-title { .message-dialog-title {
font-weight: bold; font-weight: bold;
} }
.message-dialog-subtitle { .message-dialog-subtitle {
color: $fg_color; color: $fg_color;
font-weight: bold; font-weight: bold;
} }
/* ShellMountOperation Dialogs */ /* ShellMountOperation Dialogs */
.shell-mount-operation-icon { .shell-mount-operation-icon {
icon-size: $base_icon_size * 3; icon-size: $base_icon_size * 3;
} }
.mount-dialog { .mount-dialog {
spacing: 24px; spacing: 24px;
.message-dialog-title { .message-dialog-title {
padding-top: 10px; padding-top: 10px;
padding-left: 17px; padding-left: 17px;
padding-bottom: 6px; padding-bottom: 6px;
max-width: 34em; max-width: 34em;
} }
.message-dialog-title:rtl { .message-dialog-title:rtl {
padding-left: 0px; padding-left: 0px;
padding-right: 17px; padding-right: 17px;
} }
.message-dialog-body { .message-dialog-body {
padding-left: 17px; padding-left: 17px;
width: 28em; width: 28em;
} }
.message-dialog-body:rtl { .message-dialog-body:rtl {
padding-left: 0px; padding-left: 0px;
padding-right: 17px; padding-right: 17px;
} }
} }
.mount-dialog-app-list { .mount-dialog-app-list {
max-height: 200px; max-height: 200px;
padding-top: 24px; padding-top: 24px;
padding-left: 49px; padding-left: 49px;
padding-right: 32px; padding-right: 32px;
} }
.mount-dialog-app-list:rtl { .mount-dialog-app-list:rtl {
padding-right: 49px; padding-right: 49px;
padding-left: 32px; padding-left: 32px;
} }
.mount-dialog-app-list-item { .mount-dialog-app-list-item {
color: lighten($fg_color,10%); color: lighten($fg_color,10%);
&:hover { color: $fg_color; } &:hover { color: $fg_color; }
&:ltr { padding-right: 1em; } &:ltr { padding-right: 1em; }
&:rtl { padding-left: 1em; } &:rtl { padding-left: 1em; }
} }
.mount-dialog-app-list-item-icon { .mount-dialog-app-list-item-icon {
&:ltr { padding-right: 17px; } &:ltr { padding-right: 17px; }
&:rtl { padding-left: 17px; } &:rtl { padding-left: 17px; }
} }
.mount-dialog-app-list-item-name { .mount-dialog-app-list-item-name {
font-size: 10pt; font-size: 10pt;
} }
/* Password or Authentication Dialog */ /* Password or Authentication Dialog */
.prompt-dialog { .prompt-dialog {
@extend %bubble_panel; @extend %bubble_panel;
//this is the width of the entire modal popup //this is the width of the entire modal popup
width: 34em; width: 34em;
.message-dialog-main-layout { spacing: 24px; padding: 10px; } .message-dialog-main-layout { spacing: 24px; padding: 10px; }
.message-dialog-content { spacing: $base_spacing * 4; } .message-dialog-content { spacing: $base_spacing * 4; }
.message-dialog-title { color: lighten($fg_color,15%); } .message-dialog-title { color: lighten($fg_color,15%); }
} }
.prompt-dialog-description:rtl { .prompt-dialog-description:rtl {
text-align: right; text-align: right;
} }
.prompt-dialog-password-box { .prompt-dialog-password-box {
spacing: 1em; spacing: 1em;
padding-bottom: 1em; padding-bottom: 1em;
} }
.prompt-dialog-error-label { .prompt-dialog-error-label {
font-size: 10pt; font-size: 10pt;
color: $warning_color; color: $warning_color;
padding-bottom: 8px; padding-bottom: 8px;
} }
.prompt-dialog-info-label { .prompt-dialog-info-label {
font-size: 10pt; font-size: 10pt;
padding-bottom: 8px; padding-bottom: 8px;
} }
.hidden { .hidden {
color: rgba(0,0,0,0); color: rgba(0,0,0,0);
} }
.prompt-dialog-null-label { .prompt-dialog-null-label {
font-size: 10pt; font-size: 10pt;
padding-bottom: 8px; padding-bottom: 8px;
} }
.prompt-dialog-pim-box { .prompt-dialog-pim-box {
spacing: 1em; spacing: 1em;
} }
.prompt-dialog-grid { .prompt-dialog-grid {
spacing-rows: 15px; spacing-rows: 15px;
spacing-columns: 1em; spacing-columns: 1em;
} }
.prompt-dialog-keyfiles-box { .prompt-dialog-keyfiles-box {
spacing: 1em; spacing: 1em;
} }
.prompt-dialog-button.button { .prompt-dialog-button.button {
padding: 8px; padding: 8px;
} }
.prompt-dialog-caps-lock-warning { .prompt-dialog-caps-lock-warning {
@extend .prompt-dialog-error-label; @extend .prompt-dialog-error-label;
padding-left: 6.2em; padding-left: 6.2em;
} }
/* Polkit Dialog */ /* Polkit Dialog */
.polkit-dialog-user-layout { .polkit-dialog-user-layout {
padding-left: 10px; padding-left: 10px;
spacing: 10px; spacing: 10px;
&:rtl { &:rtl {
padding-left: 0px; padding-left: 0px;
padding-right: 10px; padding-right: 10px;
} }
} }
.polkit-dialog-user-root-label { .polkit-dialog-user-root-label {
color: $warning_color; color: $warning_color;
} }
.polkit-dialog-user-icon { .polkit-dialog-user-icon {
border-radius: 99px; border-radius: 99px;
background-size: contain; background-size: contain;
width: 48px; width: 48px;
height: 48px; height: 48px;
} }
/* Audio selection dialog */ /* Audio selection dialog */
.audio-device-selection-dialog { .audio-device-selection-dialog {
@extend %bubble_panel; @extend %bubble_panel;
spacing: 30px; spacing: 30px;
} }
.audio-selection-content { .audio-selection-content {
spacing: 20px; spacing: 20px;
padding: 24px; padding: 24px;
} }
.audio-selection-title { .audio-selection-title {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
} }
.audio-selection-box { .audio-selection-box {
spacing: 20px; spacing: 20px;
} }
.audio-selection-device { .audio-selection-device {
border: 1px solid $bubble_borders_color; border: 1px solid $bubble_borders_color;
border-radius: 12px; border-radius: 12px;
&:hover,&:focus { background-color: $hover_bg_color; } &:hover,&:focus { background-color: $hover_bg_color; }
&:active { &:active {
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
} }
} }
.audio-selection-device-box { .audio-selection-device-box {
padding: 20px; padding: 20px;
spacing: 20px; spacing: 20px;
} }
.audio-selection-device-icon { .audio-selection-device-icon {
icon-size: $base_icon_size * 4; icon-size: $base_icon_size * 4;
} }
/* Access Dialog */ /* Access Dialog */
.access-dialog { .access-dialog {
@extend %bubble_panel; @extend %bubble_panel;
spacing: 30px; spacing: 30px;
} }
/* Geolocation Dialog */ /* Geolocation Dialog */
.geolocation-dialog { .geolocation-dialog {
@extend %bubble_panel; @extend %bubble_panel;
spacing: 30px; spacing: 30px;
} }
/* Extension Dialog */ /* Extension Dialog */
.extension-dialog { .extension-dialog {
@extend %bubble_panel; @extend %bubble_panel;
.message-dialog-main-layout { spacing: 24px; padding: 10px; } .message-dialog-main-layout { spacing: 24px; padding: 10px; }
.message-dialog-title { font-weight: normal; color: $fg_color; } .message-dialog-title { font-weight: normal; color: $fg_color; }
} }
/* Inhibit-Shortcuts Dialog */ /* Inhibit-Shortcuts Dialog */
.inhibit-shortcuts-dialog { .inhibit-shortcuts-dialog {
@extend %bubble_panel; @extend %bubble_panel;
spacing: 30px; spacing: 30px;
} }
/* Network Agent Dialog */ /* Network Agent Dialog */
.network-dialog-secret-table { .network-dialog-secret-table {
spacing-rows: 15px; spacing-rows: 15px;
spacing-columns: 1em; spacing-columns: 1em;
} }
.keyring-dialog-control-table { .keyring-dialog-control-table {
spacing-rows: 15px; spacing-rows: 15px;
spacing-columns: 1em; spacing-columns: 1em;
} }

View File

@ -3,78 +3,78 @@
$end_session_dialog_width: 28em; $end_session_dialog_width: 28em;
.end-session-dialog { .end-session-dialog {
spacing: $base_spacing; spacing: $base_spacing;
border: 1px solid $bubble_borders_color; border: 1px solid $bubble_borders_color;
} }
.end-session-dialog-list { .end-session-dialog-list {
padding-top: 20px; padding-top: 20px;
} }
.end-session-dialog-layout { .end-session-dialog-layout {
padding-left: 17px; padding-left: 17px;
&:rtl { padding-right: 17px; } &:rtl { padding-right: 17px; }
} }
.end-session-dialog-description { .end-session-dialog-description {
width: $end_session_dialog_width; width: $end_session_dialog_width;
padding-bottom: 10px; padding-bottom: 10px;
&:rtl { &:rtl {
text-align: right; text-align: right;
} }
} }
.end-session-dialog-warning { .end-session-dialog-warning {
width: $end_session_dialog_width; width: $end_session_dialog_width;
color: $warning_color; color: $warning_color;
padding-top: 6px; padding-top: 6px;
&:rtl { &:rtl {
text-align: right; text-align: right;
} }
} }
// user profile picture // user profile picture
.end-session-dialog-logout-icon { .end-session-dialog-logout-icon {
border-radius: 99px; border-radius: 99px;
width: $base_icon_size * 3; width: $base_icon_size * 3;
height: $base_icon_size * 3; height: $base_icon_size * 3;
background-size: contain; background-size: contain;
} }
.end-session-dialog-shutdown-icon { .end-session-dialog-shutdown-icon {
color: $fg_color; color: $fg_color;
width: $base_icon_size * 3; width: $base_icon_size * 3;
height: $base_icon_size * 3; height: $base_icon_size * 3;
} }
.end-session-dialog-inhibitor-layout { .end-session-dialog-inhibitor-layout {
spacing: $base_spacing * 4; spacing: $base_spacing * 4;
max-height: 200px; max-height: 200px;
padding-right: 65px; padding-right: 65px;
padding-left: 65px; padding-left: 65px;
} }
.end-session-dialog-session-list, .end-session-dialog-session-list,
.end-session-dialog-app-list { .end-session-dialog-app-list {
spacing: 1em; spacing: 1em;
} }
.end-session-dialog-list-header { .end-session-dialog-list-header {
font-weight: bold; font-weight: bold;
&:rtl { text-align: right; } &:rtl { text-align: right; }
} }
.end-session-dialog-app-list-item, .end-session-dialog-app-list-item,
.end-session-dialog-session-list-item { .end-session-dialog-session-list-item {
spacing: 1em; spacing: 1em;
} }
.end-session-dialog-app-list-item-name, .end-session-dialog-app-list-item-name,
.end-session-dialog-session-list-item-name { .end-session-dialog-session-list-item-name {
font-weight: bold; font-weight: bold;
} }
.end-session-dialog-app-list-item-description { .end-session-dialog-app-list-item-description {
color: darken($fg_color,5%); color: darken($fg_color,5%);
font-size: 10pt; font-size: 10pt;
} }

View File

@ -1,23 +1,23 @@
/* Entries */ /* Entries */
StEntry { StEntry {
border-radius: $base_border_radius; border-radius: $base_border_radius;
padding: 4px; padding: 4px;
border-width: 1px; border-width: 1px;
color: $fg_color; color: $fg_color;
@include entry(normal); @include entry(normal);
//&:hover { @include entry(hover);} //&:hover { @include entry(hover);}
&:focus { @include entry(focus,$fc:transparentize($fg_color,0.5));} &:focus { @include entry(focus,$fc:transparentize($fg_color,0.5));}
&:insensitive { @include entry(insensitive);} &:insensitive { @include entry(insensitive);}
selection-background-color: $selected_bg_color; selection-background-color: $selected_bg_color;
selected-color: $selected_fg_color; selected-color: $selected_fg_color;
StIcon.capslock-warning { StIcon.capslock-warning {
icon-size: 16px; icon-size: 16px;
warning-color: $warning_color; warning-color: $warning_color;
padding: 0 4px; padding: 0 4px;
} }
StIcon.peek-password { StIcon.peek-password {
icon-size: $base_icon_size; icon-size: $base_icon_size;
padding: 0 4px; padding: 0 4px;
} }
} }

View File

@ -1,46 +1,46 @@
// hotplug // hotplug
.hotplug-transient-box { .hotplug-transient-box {
spacing: 6px; spacing: 6px;
padding: 2px 72px 2px 12px; padding: 2px 72px 2px 12px;
} }
.hotplug-notification-item { .hotplug-notification-item {
@extend %bubble_button; @extend %bubble_button;
border: none; box-shadow: none; border: none; box-shadow: none;
padding: 2px 10px; padding: 2px 10px;
&:focus { padding: 1px 71px 1px 11px; } &:focus { padding: 1px 71px 1px 11px; }
} }
.hotplug-notification-item-icon { .hotplug-notification-item-icon {
icon-size: 24px; icon-size: 24px;
padding: 2px 5px; padding: 2px 5px;
} }
.hotplug-resident-box { spacing: $base_spacing * 2; } .hotplug-resident-box { spacing: $base_spacing * 2; }
.hotplug-resident-mount { .hotplug-resident-mount {
spacing: $base_spacing * 2; spacing: $base_spacing * 2;
border-radius: 4px; border-radius: 4px;
&:hover { background-color: $hover_bg_color; } &:hover { background-color: $hover_bg_color; }
} }
.hotplug-resident-mount-label { .hotplug-resident-mount-label {
color: inherit; color: inherit;
padding-left: 6px; padding-left: 6px;
} }
.hotplug-resident-mount-icon { .hotplug-resident-mount-icon {
icon-size: 24px; icon-size: 24px;
padding-left: 6px; padding-left: 6px;
} }
.hotplug-resident-eject-icon { .hotplug-resident-eject-icon {
icon-size: 16px; icon-size: 16px;
} }
.hotplug-resident-eject-button { .hotplug-resident-eject-button {
padding: 7px; padding: 7px;
border-radius: 5px; border-radius: 5px;
color: pink; color: pink;
} }

View File

@ -1,28 +1,28 @@
// IBus Candidate Popup // IBus Candidate Popup
.candidate-popup-content { .candidate-popup-content {
padding: 0.5em; padding: 0.5em;
spacing: 0.3em; spacing: 0.3em;
} }
.candidate-index { .candidate-index {
padding: 0 0.5em 0 0; padding: 0 0.5em 0 0;
color: darken($fg_color,10%); color: darken($fg_color,10%);
} }
.candidate-box { .candidate-box {
padding: 0.3em 0.5em 0.3em 0.5em; padding: 0.3em 0.5em 0.3em 0.5em;
border-radius: $base_border_radius; border-radius: $base_border_radius;
&:selected,&:hover { background-color: $selected_bg_color; color: $selected_fg_color; } &:selected,&:hover { background-color: $selected_bg_color; color: $selected_fg_color; }
} }
.candidate-page-button-box { .candidate-page-button-box {
height: 2em; height: 2em;
.vertical & { padding-top: 0.5em; } .vertical & { padding-top: 0.5em; }
.horizontal & { padding-left: 0.5em; } .horizontal & { padding-left: 0.5em; }
} }
.candidate-page-button { .candidate-page-button {
padding: 4px; padding: 4px;
} }
.candidate-page-button-previous { border-radius: $base_border_radius 0px 0px $base_border_radius; border-right-width: 0; } .candidate-page-button-previous { border-radius: $base_border_radius 0px 0px $base_border_radius; border-right-width: 0; }

View File

@ -8,118 +8,118 @@ $default_key_bg_color: if($variant=='light', darken($osd_bg_color, 11%), lighten
// draw keys using button function // draw keys using button function
%keyboard_key {
@include button(normal, $c:$key_bg_color);
&:focus { @include button(focus);}
&:hover, &:checked { @include button(hover, $c: $key_bg_color);}
&:active { @include button(active, $c: $key_bg_color); }
}
#keyboard { #keyboard {
background-color: transparentize(if($variant=='light', darken($bg_color, 5%), darken($bg_color, 8%)), 0.1); background-color: transparentize(if($variant=='light', darken($bg_color, 5%), darken($bg_color, 8%)), 0.1);
box-shadow: inset 0 1px 0 0 $osd_outer_borders_color !important; box-shadow: inset 0 1px 0 0 $osd_outer_borders_color !important;
.page-indicator { .page-indicator {
padding: $base_padding; padding: $base_padding;
.page-indicator-icon { .page-indicator-icon {
width: 6px; width: 6px;
height: 6px; height: 6px;
&:checked { &:checked {
background-color:red; }
} }
} }
}
} }
// the container for individual keys // the container for individual keys
.key-container { .key-container {
padding: $base_margin; padding: $base_margin;
spacing: $base_margin; spacing: $base_margin;
} }
// the keys // the keys
.keyboard-key { .keyboard-key {
@extend %keyboard_key;
font-size: $base_font_size + 5pt;
min-height: $key_size;
min-width: $key_size;
border-radius: $key_border_radius; @include button(normal, $c:$key_bg_color);
&:grayed { //FIXMEy &:focus { @include button(focus);}
background-color: darken($bg_color, 3%); &:hover, &:checked { @include button(hover, $c: $key_bg_color);}
color: $osd_fg_color; &:active { @include button(active, $c: $key_bg_color); }
border-color: $osd_borders_color;
}
// non-character keys font-size: $base_font_size + 5pt;
&.default-key { min-height: $key_size;
min-width: $key_size;
// size of the icon asset border-radius: $key_border_radius;
background-size: 24px;
@include button(normal, $c:$default_key_bg_color); &:grayed { //FIXMEy
&:hover, &:checked {@include button(hover, $c: $default_key_bg_color);} background-color: darken($bg_color, 3%);
&:active { @include button(active, $c: $default_key_bg_color);} color: $osd_fg_color;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1) !important; // drawing override because of a visual bug border-color: $osd_borders_color;
} }
// enter key is suggested-action // non-character keys
&.enter-key { &.default-key {
background-image: url("resource:///org/gnome/shell/theme/key-enter.svg");
@include button(normal, $c:$selected_bg_color, $tc:$selected_fg_color); // size of the icon asset
&:hover, &:checked { @include button(hover, $c: lighten($selected_bg_color, 3%));} background-size: 24px;
&:active {@include button(active, $c: darken($selected_bg_color, 2%));}
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1) !important; // drawing override because of a visual bug
}
// key assets @include button(normal, $c:$default_key_bg_color);
&.shift-key-lowercase {background-image: url("resource:///org/gnome/shell/theme/key-shift.svg");} &:hover, &:checked {@include button(hover, $c: $default_key_bg_color);}
&.shift-key-uppercase {background-image: url("resource:///org/gnome/shell/theme/key-shift-uppercase.svg");} &:active { @include button(active, $c: $default_key_bg_color);}
&.shift-key-uppercase:latched {background-image: url("resource:///org/gnome/shell/theme/key-shift-latched-uppercase.svg");} }
&.hide-key {background-image: url("resource:///org/gnome/shell/theme/key-hide.svg");}
&.layout-key {background-image: url("resource:///org/gnome/shell/theme/key-layout.svg");} // enter key is suggested-action
&.enter-key {
background-image: url("resource:///org/gnome/shell/theme/key-enter.svg");
@include button(normal, $c:$selected_bg_color, $tc:$selected_fg_color);
&:hover, &:checked { @include button(hover, $c: lighten($selected_bg_color, 3%));}
&:active {@include button(active, $c: darken($selected_bg_color, 2%));}
}
// key assets
&.shift-key-lowercase {background-image: url("resource:///org/gnome/shell/theme/key-shift.svg");}
&.shift-key-uppercase {background-image: url("resource:///org/gnome/shell/theme/key-shift-uppercase.svg");}
&.shift-key-uppercase:latched {background-image: url("resource:///org/gnome/shell/theme/key-shift-latched-uppercase.svg");}
&.hide-key {background-image: url("resource:///org/gnome/shell/theme/key-hide.svg");}
&.layout-key {background-image: url("resource:///org/gnome/shell/theme/key-layout.svg");}
} }
// long press on a key popup // long press on a key popup
.keyboard-subkeys { .keyboard-subkeys {
color: $osd_fg_color; color: $osd_fg_color;
-arrow-border-radius: $modal_radius; -arrow-border-radius: $modal_radius;
-arrow-background-color: $osd_bg_color; -arrow-background-color: $osd_bg_color;
-arrow-border-width: 1px; -arrow-border-width: 1px;
-arrow-border-color: lighten($osd_bg_color, 9%); -arrow-border-color: lighten($osd_bg_color, 9%);
-arrow-base: 20px; -arrow-base: 20px;
-arrow-rise: 10px; -arrow-rise: 10px;
-boxpointer-gap: $base_spacing; -boxpointer-gap: $base_spacing;
.keyboard-key { .keyboard-key {
@extend %keyboard_key; @include button(normal, $c:$key_bg_color);
border-radius:$base_border_radius;
} &:focus { @include button(focus);}
&:hover, &:checked { @include button(hover, $c: $key_bg_color);}
&:active { @include button(active, $c: $key_bg_color); }
border-radius:$base_border_radius;
}
} }
// emoji // emoji
.emoji-page { .emoji-page {
.keyboard-key { .keyboard-key {
background-color: transparent; background-color: transparent;
border: none; border: none;
color: initial; color: initial;
} }
} }
.emoji-panel { .emoji-panel {
.keyboard-key:latched { .keyboard-key:latched {
border-color: lighten($selected_bg_color, 5%); border-color: lighten($selected_bg_color, 5%);
background-color: $selected_bg_color; background-color: $selected_bg_color;
} }
} }
// suggestions // suggestions
.word-suggestions { .word-suggestions {
font-size: $base_font_size + 3pt; font-size: $base_font_size + 3pt;
spacing: 12px; spacing: 12px;
min-height: 20pt; min-height: 20pt;
} }

View File

@ -1,76 +1,76 @@
/* Login Dialog */ /* Login Dialog */
.login-dialog-banner-view { .login-dialog-banner-view {
padding-top: 24px; padding-top: 24px;
max-width: 23em; max-width: 23em;
} }
.login-dialog { .login-dialog {
//reset //reset
border: none; border: none;
background-color: transparent; background-color: transparent;
$_gdm_bg: lighten(#2e3436, 19%); $_gdm_bg: lighten(#2e3436, 19%);
StEntry { StEntry {
@extend %search_entry; @extend %search_entry;
border-radius: $base_border_radius; border-radius: $base_border_radius;
@if $variant=='dark' { @if $variant=='dark' {
$_gdm_entry_bg: transparentize(lighten(desaturate(#241f31, 20%), 2%), 0.5); $_gdm_entry_bg: transparentize(lighten(desaturate(#241f31, 20%), 2%), 0.5);
background-color: $_gdm_entry_bg; background-color: $_gdm_entry_bg;
border-color: $_gdm_entry_bg; border-color: $_gdm_entry_bg;
color: $osd_fg_color; color: $osd_fg_color;
} }
} }
.modal-dialog-button-box { spacing: 3px; } .modal-dialog-button-box { spacing: 3px; }
.modal-dialog-button { .modal-dialog-button {
padding: 4px 18px; padding: 4px 18px;
box-shadow: 0 1px 3px rgba(0,0,0,0.2); box-shadow: 0 1px 3px rgba(0,0,0,0.2);
background-color: $_gdm_bg; background-color: $_gdm_bg;
border-color: $_gdm_bg; border-color: $_gdm_bg;
color: $fg_color; color: $fg_color;
$_hover_c: lighten($_gdm_bg, 5%); $_hover_c: lighten($_gdm_bg, 5%);
&:hover, &:focus { &:hover, &:focus {
background-color: $_hover_c; background-color: $_hover_c;
border-color: $_hover_c; border-color: $_hover_c;
} }
&:active { &:active {
$_active_c: darken($_gdm_bg, 5%); $_active_c: darken($_gdm_bg, 5%);
box-shadow: none; box-shadow: none;
background-color: $_active_c; background-color: $_active_c;
border-color: $_active_c; border-color: $_active_c;
} }
&:insensitive { &:insensitive {
@include button(insensitive); @include button(insensitive);
border-color: darken($_gdm_bg, 5%); border-color: darken($_gdm_bg, 5%);
background-color: darken($_gdm_bg, 5%); background-color: darken($_gdm_bg, 5%);
color: transparentize($fg_color, 0.3); color: transparentize($fg_color, 0.3);
} }
&:default { &:default {
@include button(normal, $c:$selected_bg_color, $tc:$selected_fg_color); @include button(normal, $c:$selected_bg_color, $tc:$selected_fg_color);
border-color: $selected_bg_color; border-color: $selected_bg_color;
&:hover, &:focus { &:hover, &:focus {
@include button(hover,$c:$selected_bg_color, $tc:$selected_fg_color); @include button(hover,$c:$selected_bg_color, $tc:$selected_fg_color);
$_def_hover_c: lighten($selected_bg_color, 5%); $_def_hover_c: lighten($selected_bg_color, 5%);
background-color: $_def_hover_c; background-color: $_def_hover_c;
border-color: $_def_hover_c; border-color: $_def_hover_c;
} }
&:active { &:active {
@include button(active,$c:$selected_bg_color, $tc:$selected_fg_color); @include button(active,$c:$selected_bg_color, $tc:$selected_fg_color);
$_def_active_c: darken($selected_bg_color, 5%); $_def_active_c: darken($selected_bg_color, 5%);
background-color: $_def_active_c; background-color: $_def_active_c;
border-color: $_def_active_c; border-color: $_def_active_c;
} }
&:insensitive { &:insensitive {
@include button(insensitive); @include button(insensitive);
border-color: darken($selected_bg_color, 10%); border-color: darken($selected_bg_color, 10%);
background-color: darken($selected_bg_color, 10%); background-color: darken($selected_bg_color, 10%);
color: transparentize($selected_fg_color, 0.3); color: transparentize($selected_fg_color, 0.3);
} }
} }
} }
} }
.login-dialog-logo-bin { padding: 24px 0px; } .login-dialog-logo-bin { padding: 24px 0px; }
@ -80,75 +80,75 @@
.login-dialog-message-hint { padding-top: 0; padding-bottom: 20px; } .login-dialog-message-hint { padding-top: 0; padding-bottom: 20px; }
.login-dialog-user-selection-box { padding: 100px 0px; } .login-dialog-user-selection-box { padding: 100px 0px; }
.login-dialog-not-listed-label { .login-dialog-not-listed-label {
padding-left: 2px; padding-left: 2px;
.login-dialog-not-listed-button:focus &, .login-dialog-not-listed-button:focus &,
.login-dialog-not-listed-button:hover & { .login-dialog-not-listed-button:hover & {
color: $osd_fg_color; color: $osd_fg_color;
} }
} }
.login-dialog-not-listed-label { .login-dialog-not-listed-label {
font-size: 90%; font-size: 90%;
font-weight: bold; font-weight: bold;
color: darken($osd_fg_color,30%); color: darken($osd_fg_color,30%);
padding-top: 1em; padding-top: 1em;
} }
.login-dialog-user-list-view { -st-vfade-offset: 1em; } .login-dialog-user-list-view { -st-vfade-offset: 1em; }
.login-dialog-user-list { .login-dialog-user-list {
spacing: 12px; spacing: 12px;
width: 23em; width: 23em;
&:expanded .login-dialog-user-list-item:selected { background-color: $selected_bg_color; color: $selected_fg_color; } &:expanded .login-dialog-user-list-item:selected { background-color: $selected_bg_color; color: $selected_fg_color; }
&:expanded .login-dialog-user-list-item:logged-in { border-right: 2px solid $selected_bg_color; } &:expanded .login-dialog-user-list-item:logged-in { border-right: 2px solid $selected_bg_color; }
} }
.login-dialog-user-list-item { .login-dialog-user-list-item {
border-radius: 5px; border-radius: 5px;
padding: 6px; padding: 6px;
color: darken($osd_fg_color,30%); color: darken($osd_fg_color,30%);
&:ltr .user-widget { padding-right: 1em; } &:ltr .user-widget { padding-right: 1em; }
&:rtl .user-widget { padding-left: 1em; } &:rtl .user-widget { padding-left: 1em; }
.login-dialog-timed-login-indicator { .login-dialog-timed-login-indicator {
height: 2px; height: 2px;
margin-top: 6px; margin-top: 6px;
background-color: $osd_fg_color; background-color: $osd_fg_color;
} }
&:focus .login-dialog-timed-login-indicator { background-color: $selected_fg_color; } &:focus .login-dialog-timed-login-indicator { background-color: $selected_fg_color; }
} }
.login-dialog-username, .login-dialog-username,
.user-widget-label { .user-widget-label {
color: $osd_fg_color; color: $osd_fg_color;
font-size: 120%; font-size: 120%;
font-weight: bold; font-weight: bold;
text-align: left; text-align: left;
padding-left: 15px; padding-left: 15px;
} }
.user-widget-label { .user-widget-label {
&:ltr { padding-left: 14px; } &:ltr { padding-left: 14px; }
&:rtl { padding-right: 14px; } &:rtl { padding-right: 14px; }
} }
.login-dialog-prompt-layout { .login-dialog-prompt-layout {
padding-top: 24px; padding-top: 24px;
padding-bottom: 12px; padding-bottom: 12px;
spacing: $base_spacing * 2; spacing: $base_spacing * 2;
width: 23em; width: 23em;
} }
.login-dialog-prompt-label { .login-dialog-prompt-label {
color: darken($osd_fg_color, 20%); color: darken($osd_fg_color, 20%);
font-size: 110%; font-size: 110%;
padding-top: 1em; padding-top: 1em;
} }
.login-dialog-session-list-button StIcon { .login-dialog-session-list-button StIcon {
icon-size: 1.25em; icon-size: 1.25em;
} }
.login-dialog-session-list-button { .login-dialog-session-list-button {
color: darken($osd_fg_color,30%); color: darken($osd_fg_color,30%);
&:hover,&:focus { color: $osd_fg_color; } &:hover,&:focus { color: $osd_fg_color; }
&:active { color: darken($osd_fg_color, 50%); } &:active { color: darken($osd_fg_color, 50%); }
} }

View File

@ -2,96 +2,96 @@
// Dialog // Dialog
#LookingGlassDialog { #LookingGlassDialog {
background-color: $osd_bg_color; background-color: $osd_bg_color;
spacing: $base_spacing; spacing: $base_spacing;
padding: 4px; padding: 4px;
border: 2px solid transparentize($osd_fg_color, 0.8); border: 2px solid transparentize($osd_fg_color, 0.8);
border-top-width:0; border-top-width:0;
border-radius: 0 0 $base_border_radius $base_border_radius; border-radius: 0 0 $base_border_radius $base_border_radius;
& > #Toolbar { & > #Toolbar {
border: none; border: none;
border-radius: $base_border_radius; border-radius: $base_border_radius;
background-color: darken($osd_bg_color, 10%); background-color: darken($osd_bg_color, 10%);
} }
.labels { spacing: $base_spacing; } .labels { spacing: $base_spacing; }
.notebook-tab { .notebook-tab {
-natural-hpadding: $base_padding * 2; -natural-hpadding: $base_padding * 2;
-minimum-hpadding: 6px; -minimum-hpadding: 6px;
font-weight: bold; font-weight: bold;
color: $fg_color; color: $fg_color;
transition-duration: 100ms; transition-duration: 100ms;
padding-left: .3em; padding-left: .3em;
padding-right: .3em; padding-right: .3em;
&:hover { &:hover {
color: white; color: white;
text-shadow: black 0px 2px 2px; text-shadow: black 0px 2px 2px;
} }
&:selected { &:selected {
border-bottom-width: 2px; border-bottom-width: 2px;
border-color: lighten($selected_bg_color,5%); border-color: lighten($selected_bg_color,5%);
color: white; color: white;
text-shadow: black 0px 2px 2px; text-shadow: black 0px 2px 2px;
} }
} }
StBoxLayout#EvalBox { padding: 4px; spacing: $base_spacing; } StBoxLayout#EvalBox { padding: 4px; spacing: $base_spacing; }
StBoxLayout#ResultsArea { spacing: $base_spacing; } StBoxLayout#ResultsArea { spacing: $base_spacing; }
} }
.lg-dialog { .lg-dialog {
StEntry { StEntry {
selection-background-color: #bbbbbb; selection-background-color: #bbbbbb;
selected-color: $osd_bg_color; selected-color: $osd_bg_color;
} }
.shell-link { .shell-link {
color: #999999; color: #999999;
&:hover { color: #dddddd; } &:hover { color: #dddddd; }
} }
} }
.lg-completions-text { .lg-completions-text {
font-size: .9em; font-size: .9em;
font-style: italic; font-style: italic;
} }
.lg-obj-inspector-title { .lg-obj-inspector-title {
spacing: $base_spacing; spacing: $base_spacing;
} }
.lg-obj-inspector-button { .lg-obj-inspector-button {
border: 1px solid gray; border: 1px solid gray;
padding: 4px; padding: 4px;
border-radius: $base_border_radius; border-radius: $base_border_radius;
&:hover { border: 1px solid #ffffff; } &:hover { border: 1px solid #ffffff; }
} }
// Extensions // Extensions
#lookingGlassExtensions { padding: 4px; } #lookingGlassExtensions { padding: 4px; }
.lg-extensions-list { .lg-extensions-list {
padding: 4px; padding: 4px;
spacing: 6px; spacing: 6px;
} }
.lg-extension { .lg-extension {
border: 1px solid $osd_borders_color; border: 1px solid $osd_borders_color;
border-radius: $base_border_radius; border-radius: $base_border_radius;
padding: 4px; padding: 4px;
} }
.lg-extension-name { .lg-extension-name {
font-weight: bold; font-weight: bold;
} }
.lg-extension-meta { .lg-extension-meta {
spacing: 6px; spacing: 6px;
} }
// Inspector // Inspector
#LookingGlassPropertyInspector { #LookingGlassPropertyInspector {
background: $osd_bg_color; background: $osd_bg_color;
border: 1px solid $osd_borders_color; border: 1px solid $osd_borders_color;
border-radius: $base_border_radius; border-radius: $base_border_radius;
padding: 6px; padding: 6px;
} }

View File

@ -3,143 +3,143 @@
// main list // main list
.message-list { .message-list {
width: 31.5em; width: 31.5em;
padding: 0 $base_padding * 2; padding: 0 $base_padding * 2;
} }
.message-list-sections { .message-list-sections {
margin:0; margin:0;
spacing: $base_spacing; spacing: $base_spacing;
} }
.message-list-section, .message-list-section,
.message-list-section-list { .message-list-section-list {
spacing: $base_spacing; spacing: $base_spacing;
} }
.message-list-section-list { .message-list-section-list {
&:ltr {padding:0;} &:ltr {padding:0;}
&:rtl {padding:0;} &:rtl {padding:0;}
} }
// clear button // clear button
.message-list-clear-button { .message-list-clear-button {
margin:$base_margin; margin:$base_margin;
.button { .button {
@extend %button; @extend %button;
} }
} }
// message bubbles // message bubbles
.message { .message {
@extend %notification_bubble; @extend %notification_bubble;
// title // title
.message-title { .message-title {
color: $fg_color; color: $fg_color;
font-weight: bold; font-weight: bold;
margin-bottom:4px; margin-bottom:4px;
} }
// content // content
.message-content { .message-content {
color: darken($fg_color, 10%); color: darken($fg_color, 10%);
padding: $base_padding 0; padding: $base_padding 0;
margin:$base_margin * 2; margin:$base_margin * 2;
&:ltr { &:ltr {
margin-left: $base_margin; margin-left: $base_margin;
padding-right:$base_padding; padding-right:$base_padding;
} }
&:rtl { &:rtl {
margin-right: $base_margin; margin-right: $base_margin;
padding-left:$base_padding; padding-left:$base_padding;
} }
} }
// close button // close button
.message-close-button { .message-close-button {
color: lighten($fg_color, 15%); color: lighten($fg_color, 15%);
&:hover { color: darken($fg_color, 10%);} &:hover { color: darken($fg_color, 10%);}
} }
// icon container // icon container
.message-icon-bin { .message-icon-bin {
// padding: $base_padding; padding: $base_padding;
margin:$base_padding 0; margin:$base_padding 0;
&:rtl { &:rtl {
// padding: $base_padding; // padding: $base_padding;
} }
// icon size and color // icon size and color
> StIcon { > StIcon {
color: $fg_color; color: $fg_color;
icon-size: $base_icon_size * 2; // 32px icon-size: $base_icon_size*2; // 32px
-st-icon-style: symbolic; -st-icon-style: symbolic;
padding:0; padding:0;
margin:$base_padding; margin:$base_padding;
} }
// fallback // fallback
> .fallback-window-icon { > .fallback-window-icon {
width: $base_icon_size; width: $base_icon_size;
height: $base_icon_size; height: $base_icon_size;
} }
} }
// secondary container in title box // secondary container in title box
.message-secondary-bin { .message-secondary-bin {
padding: 0; padding: 0;
// notification time stamp // notification time stamp
> .event-time { > .event-time {
color: transparentize($fg_color, 0.5); color: transparentize($fg_color, 0.5);
font-size: 80%; font-size: 80%;
text-align: right; text-align: right;
margin: 0 $base_margin * 2; margin: 0 $base_margin * 2;
/* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */
padding-bottom: $base_padding; padding-bottom: $base_padding;
} }
} }
} }
/* Media Controls */ /* Media Controls */
.message-media-control { .message-media-control {
padding: $base_padding * 2 $base_padding * 4; padding: $base_padding * 2 $base_padding * 4;
color: darken($fg_color, 15%); color: darken($fg_color, 15%);
// uses $hover_bg_color since the media controls are in a notification_bubble // uses $hover_bg_color since the media controls are in a notification_bubble
&:hover { &:hover {
background-color: lighten($hover_bg_color, 5%); background-color: lighten($hover_bg_color, 5%);
color: $fg_color; color: $fg_color;
} }
&:active { &:active {
background-color: darken($hover_bg_color, 2%); background-color: darken($hover_bg_color, 2%);
color: $fg_color; color: $fg_color;
} }
&:insensitive { color: darken($fg_color,40%); } &:insensitive { color: darken($fg_color,40%); }
// fix border-radius for last button on hover // fix border-radius for last button on hover
&:last-child:ltr { &:hover {border-radius: 0 $base_border_radius+2 $base_border_radius+2 0;} } &:last-child:ltr { &:hover {border-radius: 0 $base_border_radius+2 $base_border_radius+2 0;} }
&:last-child:rtl { &:hover {border-radius: $base_border_radius+2 0 0 $base_border_radius+2;} } &:last-child:rtl { &:hover {border-radius: $base_border_radius+2 0 0 $base_border_radius+2;} }
} }
// album-art // album-art
.media-message-cover-icon { .media-message-cover-icon {
icon-size: $base_icon_size * 2 !important; // 48px icon-size: $base_icon_size*2 !important; // 48px
border-radius: $base_border_radius; border-radius: $base_border_radius;
// when there is no artwork // when there is no artwork
&.fallback { &.fallback {
color: darken($fg_color, 17%); color: darken($fg_color, 17%);
background-color: $bg_color; background-color: $bg_color;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: $base_border_radius; border-radius: $base_border_radius;
icon-size: $base_icon_size * 2 !important; icon-size: $base_icon_size * 2 !important;
padding: $base_padding * 2; padding: $base_padding * 2;
} }
} }

View File

@ -1,52 +1,52 @@
// Links/URLs // Links/URLs
.shell-link { .shell-link {
color: $link_color; color: $link_color;
&:hover { color: lighten($link_color,10%); } &:hover { color: lighten($link_color,10%); }
} }
.url-highlighter { link-color: $link_color; } .url-highlighter { link-color: $link_color; }
// Rubberband for select-area screenshots // Rubberband for select-area screenshots
.select-area-rubberband { .select-area-rubberband {
background-color: transparentize($selected_bg_color,0.7); background-color: transparentize($selected_bg_color,0.7);
border: 1px solid $selected_bg_color; border: 1px solid $selected_bg_color;
} }
// Pointer accessibility notifications // Pointer accessibility notifications
.pie-timer { .pie-timer {
width: 60px; width: 60px;
height: 60px; height: 60px;
-pie-border-width: 3px; -pie-border-width: 3px;
-pie-border-color: $selected_bg_color; -pie-border-color: $selected_bg_color;
-pie-background-color: lighten(transparentize($selected_bg_color, 0.7), 40%); -pie-background-color: lighten(transparentize($selected_bg_color, 0.7), 40%);
} }
// Screen zoom/Magnifier // Screen zoom/Magnifier
.magnifier-zoom-region { .magnifier-zoom-region {
border: 2px solid $selected_bg_color; border: 2px solid $selected_bg_color;
&.full-screen { border-width: 0; } &.full-screen { border-width: 0; }
} }
// User icon // User icon
.user-icon { .user-icon {
background-size: contain; background-size: contain;
color: $osd_fg_color; color: $osd_fg_color;
border-radius: 99px; border-radius: 99px;
&:hover { &:hover {
color: lighten($osd_fg_color,30%); color: lighten($osd_fg_color,30%);
} }
} }
// Input Source Switcher // Input Source Switcher
.input-source-switcher-symbol { .input-source-switcher-symbol {
font-size: 34pt; font-size: 34pt;
width: 96px; width: 96px;
height: 96px; height: 96px;
} }
// Window cycler highlight // Window cycler highlight
.cycler-highlight { .cycler-highlight {
border: 5px solid $selected_bg_color; border: 5px solid $selected_bg_color;
} }

View File

@ -1,51 +1,51 @@
/* Network Dialogs */ /* Network Dialogs */
.nm-dialog { .nm-dialog {
@extend %bubble_panel; @extend %bubble_panel;
max-height: 34em; max-height: 34em;
min-height: 31em; min-height: 31em;
min-width: 32em; min-width: 32em;
} }
.nm-dialog-content { .nm-dialog-content {
spacing: 20px; spacing: 20px;
padding: 24px; padding: 24px;
} }
.nm-dialog-airplane-box { spacing: 12px; } .nm-dialog-airplane-box { spacing: 12px; }
.nm-dialog-airplane-headline { .nm-dialog-airplane-headline {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
} }
.nm-dialog-airplane-text { color: $fg_color; } .nm-dialog-airplane-text { color: $fg_color; }
// header // header
.nm-dialog-header { .nm-dialog-header {
font-weight: bold; font-weight: bold;
} }
.nm-dialog-header-icon { .nm-dialog-header-icon {
icon-size: $base_icon_size * 2; icon-size: $base_icon_size * 2;
} }
.nm-dialog-header-hbox { spacing: 10px; } .nm-dialog-header-hbox { spacing: 10px; }
// list of networks // list of networks
.nm-dialog-scroll-view { .nm-dialog-scroll-view {
border: 1px solid $borders_color; border: 1px solid $borders_color;
padding:0; padding:0;
background-color: darken($bg_color, 3%); background-color: darken($bg_color, 3%);
} }
// list item // list item
.nm-dialog-item { .nm-dialog-item {
font-size: $base_font_size; font-size: $base_font_size;
border-bottom: 1px solid $borders_color; border-bottom: 1px solid $borders_color;
padding: $base_padding * 2; padding: $base_padding * 2;
spacing: 0px; spacing: 0px;
&:selected { &:selected {
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
} }
} }
// icons in list // icons in list

View File

@ -5,72 +5,72 @@ $notification_banner_width: 34em;
// Banner notifications // Banner notifications
.notification-banner { .notification-banner {
min-height: $notification_banner_height; min-height: $notification_banner_height;
width: $notification_banner_width; width: $notification_banner_width;
font-size: $base_font_size; font-size: $base_font_size;
margin: $base_margin; margin: $base_margin;
border-radius: $modal_radius; border-radius: $modal_radius;
.message-title { color: $fg_color } .message-title { color: $fg_color }
.message-content { color: $fg_color; } .message-content { color: $fg_color; }
&:hover { background: $bg_color; } &:hover { background: $bg_color; }
&, &:focus, &:active { &, &:focus, &:active {
background-color: $bg_color; background-color: $bg_color;
.message-title { color: $fg_color } .message-title { color: $fg_color }
.message-content { color: $fg_color; } .message-content { color: $fg_color; }
} }
// icon // icon
.message-icon-bin > StIcon { .message-icon-bin > StIcon {
icon-size: $base_icon_size * 2; icon-size: $base_icon_size * 2;
color: $fg_color; color: $fg_color;
} }
// entries // entries
StEntry { @extend %bubble_entry; } StEntry { @extend %bubble_entry; }
.notification-icon { .notification-icon {
padding: 5px; padding: 5px;
} }
.notification-content { .notification-content {
padding: 5px; padding: 5px;
spacing: 5px; spacing: 5px;
} }
.secondary-icon { icon-size: $base_icon_size; } .secondary-icon { icon-size: $base_icon_size; }
.notification-actions { .notification-actions {
padding-top: 0; padding-top: 0;
color: $fg_color; color: $fg_color;
border-top: 1px solid $bubble_borders_color; border-top: 1px solid $bubble_borders_color;
spacing: 0; spacing: 0;
} }
.notification-button { .notification-button {
@extend %bubble_button; @extend %bubble_button;
min-height: $notification_banner_height * 0.5; min-height: $notification_banner_height * 0.5;
padding: $base_padding !important; padding: $base_padding !important;
border-top-width: 0 !important; border-top-width: 0 !important;
&:focus { box-shadow: none; } &:focus { box-shadow: none; }
} }
} }
// counter // counter
.summary-source-counter { .summary-source-counter {
font-size: $base_font_size - 1pt; font-size: $base_font_size - 1pt;
font-weight: bold; font-weight: bold;
height: 1.6em; height: 1.6em;
width: 1.6em; width: 1.6em;
-shell-counter-overlap-x: 3px; -shell-counter-overlap-x: 3px;
-shell-counter-overlap-y: 3px; -shell-counter-overlap-y: 3px;
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
border: 2px solid $fg_color; border: 2px solid $fg_color;
box-shadow: 0 2px 2px rgba(0,0,0,0.5); box-shadow: 0 2px 2px rgba(0,0,0,0.5);
border-radius: 0.9em; // should be 0.8 but whatever; wish I could do 50%; border-radius: 0.9em; // should be 0.8 but whatever; wish I could do 50%;
} }
.secondary-icon { icon-size: $base_icon_size; } .secondary-icon { icon-size: $base_icon_size; }
@ -81,20 +81,20 @@ $notification_banner_width: 34em;
.chat-log-message { color: darken($fg_color,10%); } .chat-log-message { color: darken($fg_color,10%); }
.chat-new-group { padding-top: 1em; } .chat-new-group { padding-top: 1em; }
.chat-received { .chat-received {
padding-left: 4px; padding-left: 4px;
&:rtl { padding-left: 0px; padding-right: 4px; } &:rtl { padding-left: 0px; padding-right: 4px; }
} }
.chat-sent { .chat-sent {
padding-left: 18pt; padding-left: 18pt;
color: lighten($fg_color, 15%); color: lighten($fg_color, 15%);
&:rtl { padding-left: 0; padding-right: 18pt; } &:rtl { padding-left: 0; padding-right: 18pt; }
} }
.chat-meta-message { .chat-meta-message {
padding-left: 4px; padding-left: 4px;
font-size: 9pt; font-size: 9pt;
font-weight: bold; font-weight: bold;
color: lighten($fg_color,18%); color: lighten($fg_color,18%);
&:rtl { padding-left: 0; padding-right: 4px; } &:rtl { padding-left: 0; padding-right: 4px; }
} }

View File

@ -1,37 +1,37 @@
/* OSD */ /* OSD */
.osd-window { .osd-window {
@extend %osd_panel; @extend %osd_panel;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
spacing: 1em; spacing: 1em;
margin: 32px; margin: 32px;
min-width: 64px; min-width: 64px;
min-height: 64px; min-height: 64px;
.osd-monitor-label { font-size: 3em; } .osd-monitor-label { font-size: 3em; }
.level { .level {
height: 0.6em; height: 0.6em;
-barlevel-height: 0.6em; -barlevel-height: 0.6em;
-barlevel-background-color: transparentize($fg_color, if($variant=='light', 0.2, 0.9)); -barlevel-background-color: transparentize($fg_color, if($variant=='light', 0.2, 0.9));
-barlevel-active-background-color: $osd_fg_color; -barlevel-active-background-color: $osd_fg_color;
-barlevel-overdrive-color: $destructive_color; -barlevel-overdrive-color: $destructive_color;
-barlevel-overdrive-separator-width: 0.2em; -barlevel-overdrive-separator-width: 0.2em;
} }
} }
/* Pad OSD */ /* Pad OSD */
.pad-osd-window { .pad-osd-window {
padding: 32px; padding: 32px;
background-color: transparentize(#000, 0.2); background-color: transparentize(#000, 0.2);
.pad-osd-title-box { spacing: 12px; } .pad-osd-title-box { spacing: 12px; }
.pad-osd-title-menu-box { spacing: 6px; } .pad-osd-title-menu-box { spacing: 6px; }
} }
.combo-box-label { .combo-box-label {
width: 15em; width: 15em;
} }
.resize-popup { .resize-popup {
@extend %osd_panel; @extend %osd_panel;
} }

View File

@ -1,10 +1,10 @@
/* OVERVIEW */ /* OVERVIEW */
#overview { #overview {
spacing: 24px; spacing: 24px;
background-color: transparent; background-color: transparent;
} }
.overview-controls { .overview-controls {
padding-bottom: 32px; padding-bottom: 32px;
} }

View File

@ -5,62 +5,62 @@ $popover_arrow_height: 12px;
//.the popover itself //.the popover itself
.popup-menu-boxpointer, .popup-menu-boxpointer,
.candidate-popup-boxpointer { .candidate-popup-boxpointer {
-arrow-border-radius: $base_border_radius+4; -arrow-border-radius: $base_border_radius+4;
-arrow-background-color: $bg_color; -arrow-background-color: $bg_color;
-arrow-border-width: 1px; -arrow-border-width: 1px;
-arrow-border-color: $borders_color; -arrow-border-color: $borders_color;
-arrow-base: $popover_arrow_height * 2; -arrow-base: $popover_arrow_height * 2;
-arrow-rise: $popover_arrow_height; -arrow-rise: $popover_arrow_height;
-arrow-box-shadow: 0 1px 3px rgba(0,0,0,0.5); // dreaming bugzilla #689995 -arrow-box-shadow: 0 1px 3px rgba(0,0,0,0.5); // dreaming bugzilla #689995
} }
// container of the popover menu // container of the popover menu
.popup-menu { .popup-menu {
min-width: 15em; min-width: 15em;
color: $fg_color; color: $fg_color;
//.popup-status-menu-item { font-weight: normal; color: pink; } //dunno what that is //.popup-status-menu-item { font-weight: normal; color: pink; } //dunno what that is
&.panel-menu { &.panel-menu {
-boxpointer-gap: $base_margin; // distance from the panel -boxpointer-gap: $base_margin; // distance from the panel
margin-bottom: 1.75em; margin-bottom: 1.75em;
} }
} }
.popup-menu-content { .popup-menu-content {
padding: $base_padding * 2 + $base_margin 0; padding: $base_padding * 2 + $base_margin 0;
} }
// menu items // menu items
.popup-menu-item { .popup-menu-item {
spacing: $base_padding; spacing: $base_padding;
padding: $base_padding; padding: $base_padding;
&:ltr { padding-right:1.75em; padding-left: 0; } &:ltr { padding-right:1.75em; padding-left: 0; }
&:rtl { padding-right: 0; padding-left:1.75em; } &:rtl { padding-right: 0; padding-left:1.75em; }
&:checked { &:checked {
background-color: lighten($bg_color, 2%); background-color: lighten($bg_color, 2%);
box-shadow: none; box-shadow: none;
} }
&.selected { &.selected {
background-color: transparentize(white, if($variant=='light', 0.2, 0.9)); background-color: transparentize(white, if($variant=='light', 0.2, 0.9));
color: $fg_color; color: $fg_color;
} }
&:active { &:active {
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
} }
&:insensitive { color: transparentize($fg_color,0.5);} &:insensitive { color: transparentize($fg_color,0.5);}
} }
// all icons and other graphical elements // all icons and other graphical elements
.popup-inactive-menu-item { .popup-inactive-menu-item {
color: $fg_color; color: $fg_color;
&:insensitive { color: transparentize($fg_color,0.5); } &:insensitive { color: transparentize($fg_color,0.5); }
} }
// symbolic icons in popover // symbolic icons in popover
@ -69,55 +69,55 @@ $popover_arrow_height: 12px;
// popover submenus // popover submenus
.popup-sub-menu { .popup-sub-menu {
background-color: darken($bg_color, 3%); background-color: darken($bg_color, 3%);
box-shadow: none; box-shadow: none;
border-top: 1px solid transparentize($borders_color, 0.2); border-top: 1px solid transparentize($borders_color, 0.2);
border-bottom: 1px solid transparentize($borders_color, 0.2); border-bottom: 1px solid transparentize($borders_color, 0.2);
.popup-menu-item:hover {background-color: darken($bg_color, 7%);} .popup-menu-item:hover {background-color: darken($bg_color, 7%);}
} }
// container for radio and check boxes // container for radio and check boxes
.popup-menu-ornament { .popup-menu-ornament {
text-align: right; text-align: right;
width: 1.2em; width: 1.2em;
} }
// separator // separator
.popup-separator-menu-item { .popup-separator-menu-item {
//-margin-horizontal: 24px; //-margin-horizontal: 24px;
height: 1px; //not really the whole box height: 1px; //not really the whole box
margin: 6px 64px; margin: 6px 64px;
background-color: lighten($borders_color, 2%); background-color: lighten($borders_color, 2%);
border: none !important; border: none !important;
} }
// desktop background menu // desktop background menu
.background-menu { .background-menu {
-boxpointer-gap: $base_margin; -boxpointer-gap: $base_margin;
-arrow-rise: 0px; // hide the beak on the menu -arrow-rise: 0px; // hide the beak on the menu
} }
// system status menu // system status menu
.aggregate-menu { .aggregate-menu {
min-width: 21em; min-width: 21em;
// lock screen, shutdown, etc. buttons // lock screen, shutdown, etc. buttons
.popup-menu-icon { .popup-menu-icon {
padding:0; padding:0;
margin: 0 $base_margin; margin: 0 $base_margin;
-st-icon-style: symbolic; -st-icon-style: symbolic;
} }
.popup-sub-menu .popup-menu-item > :first-child { .popup-sub-menu .popup-menu-item > :first-child {
// account for icons in submenus with padding // account for icons in submenus with padding
&:ltr { &:ltr {
padding-left: $base_padding + $base_margin * 2; padding-left: $base_padding + $base_margin * 2;
margin-left: $base_icon_size; margin-left: $base_icon_size;
} }
&:rtl { &:rtl {
padding-right: $base_padding + $base_margin * 2; ; padding-right: $base_padding + $base_margin * 2; ;
margin-right: $base_icon_size; margin-right: $base_icon_size;
} }
} }
} }

View File

@ -3,61 +3,61 @@
$_screenshield_shadow: 0px 0px 6px rgba(0, 0, 0, 0.726); $_screenshield_shadow: 0px 0px 6px rgba(0, 0, 0, 0.726);
.screen-shield-arrows { .screen-shield-arrows {
padding-bottom: 3em; padding-bottom: 3em;
} }
.screen-shield-arrows Gjs_Arrow { .screen-shield-arrows Gjs_Arrow {
color: white; color: white;
width: 80px; width: 80px;
height: 48px; height: 48px;
-arrow-thickness: 12px; -arrow-thickness: 12px;
-arrow-shadow: $_screenshield_shadow; -arrow-shadow: $_screenshield_shadow;
} }
.screen-shield-clock { .screen-shield-clock {
color: white; color: white;
text-shadow: $_screenshield_shadow; text-shadow: $_screenshield_shadow;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
padding-bottom: 1.5em; padding-bottom: 1.5em;
} }
.screen-shield-clock-time { .screen-shield-clock-time {
font-size: 72pt; font-size: 72pt;
text-shadow: $_screenshield_shadow; text-shadow: $_screenshield_shadow;
font-feature-settings: "tnum"; font-feature-settings: "tnum";
} }
.screen-shield-clock-date { .screen-shield-clock-date {
font-size: 28pt; font-size: 28pt;
font-weight: normal; font-weight: normal;
} }
.screen-shield-notifications-container { .screen-shield-notifications-container {
spacing: 6px; spacing: 6px;
width: 30em; width: 30em;
background-color: transparent; background-color: transparent;
max-height: 500px; max-height: 500px;
.summary-notification-stack-scrollview { .summary-notification-stack-scrollview {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
} }
.notification, .notification,
.screen-shield-notification-source { .screen-shield-notification-source {
padding: 12px 6px; padding: 12px 6px;
border: 1px solid $osd_outer_borders_color; border: 1px solid $osd_outer_borders_color;
background-color: transparentize($osd_bg_color,0.5); background-color: transparentize($osd_bg_color,0.5);
color: $osd_fg_color; color: $osd_fg_color;
border-radius: 4px; border-radius: 4px;
} }
.notification { margin-right: 15px; } //compensate for space allocated to the scrollbar .notification { margin-right: 15px; } //compensate for space allocated to the scrollbar
} }
.screen-shield-notification-label { .screen-shield-notification-label {
font-weight: bold; font-weight: bold;
padding: 0px 0px 0px 12px; padding: 0px 0px 0px 12px;
} }
.screen-shield-notification-count-text { padding: 0px 0px 0px 12px; } .screen-shield-notification-count-text { padding: 0px 0px 0px 12px; }
@ -65,19 +65,19 @@ $_screenshield_shadow: 0px 0px 6px rgba(0, 0, 0, 0.726);
#panel.lock-screen { background-color: transparentize($osd_bg_color, 0.5); } #panel.lock-screen { background-color: transparentize($osd_bg_color, 0.5); }
.screen-shield-background { //just the shadow, really .screen-shield-background { //just the shadow, really
background: black; background: black;
box-shadow: 0px 2px 4px rgba(0,0,0,0.6); box-shadow: 0px 2px 4px rgba(0,0,0,0.6);
} }
#lockDialogGroup { #lockDialogGroup {
background: lighten(#2e3436, 8%) url(resource:///org/gnome/shell/theme/noise-texture.png); background: lighten(#2e3436, 8%) url(resource:///org/gnome/shell/theme/noise-texture.png);
background-repeat: repeat; background-repeat: repeat;
} }
#screenShieldNotifications { #screenShieldNotifications {
StButton#vhandle, StButton#hhandle { StButton#vhandle, StButton#hhandle {
background-color: transparentize($bg_color,0.7); background-color: transparentize($bg_color,0.7);
&:hover, &:focus { background-color: transparentize($bg_color,0.5); } &:hover, &:focus { background-color: transparentize($bg_color,0.5); }
&:active { background-color: transparentize($selected_bg_color,0.5); } &:active { background-color: transparentize($selected_bg_color,0.5); }
} }
} }

View File

@ -1,29 +1,29 @@
/* Scrollbars */ /* Scrollbars */
StScrollView { StScrollView {
&.vfade { -st-vfade-offset: 68px; } &.vfade { -st-vfade-offset: 68px; }
&.hfade { -st-hfade-offset: 68px; } &.hfade { -st-hfade-offset: 68px; }
} }
StScrollBar { StScrollBar {
padding: 0; padding: 0;
StScrollView & { StScrollView & {
min-width: 14px; min-width: 14px;
min-height: 14px; min-height: 14px;
} }
StBin#trough { StBin#trough {
border-radius: 0; border-radius: 0;
background-color: transparent; background-color: transparent;
} }
StButton#vhandle, StButton#hhandle { StButton#vhandle, StButton#hhandle {
border-radius: 8px; border-radius: 8px;
background-color: mix($fg_color, $bg_color, 60%); background-color: mix($fg_color, $bg_color, 60%);
//border: 3px solid transparent; //would be nice to margin or at least to transparent //border: 3px solid transparent; //would be nice to margin or at least to transparent
margin: 3px; margin: 3px;
&:hover { background-color: mix($fg_color, $bg_color, 80%); } &:hover { background-color: mix($fg_color, $bg_color, 80%); }
&:active { background-color: $selected_bg_color; } &:active { background-color: $selected_bg_color; }
} }
} }

View File

@ -4,30 +4,30 @@ $search_entry_width: 320px;
%search_entry, %search_entry,
.search-entry { .search-entry {
width: $search_entry_width; width: $search_entry_width;
padding: 7px 9px; padding: 7px 9px;
border-radius: 18px; border-radius: 18px;
color: transparentize($fg_color,0.3); color: transparentize($fg_color,0.3);
background-color: $bg_color; background-color: $bg_color;
border-color: $borders_color; border-color: $borders_color;
&:hover { &:hover {
background-color: $hover_bg_color; background-color: $hover_bg_color;
border-color: $hover_borders_color; border-color: $hover_borders_color;
color: $hover_fg_color; color: $hover_fg_color;
} }
&:focus { &:focus {
padding: 6px 8px; // 1px less to account for wider border padding: 6px 8px; // 1px less to account for wider border
border-width: 2px; border-width: 2px;
color: $fg_color; color: $fg_color;
border-color: $selected_bg_color; border-color: $selected_bg_color;
box-shadow: inset 0 1px 2px 1px rgba(0,0,0,0.2); box-shadow: inset 0 1px 2px 1px rgba(0,0,0,0.2);
} }
.search-entry-icon { .search-entry-icon {
icon-size: $base_icon_size; icon-size: $base_icon_size;
padding: 0 4px; padding: 0 4px;
color: inherit; color: inherit;
} }
} }

View File

@ -1,160 +1,151 @@
/* Search */ /* Search */
$overview_search_container_width: 1024px;
%search_result_bubble {
background-color: transparentize(lighten($osd_bg_color, 5%), 0.2);
border-radius: $modal_radius + 3px;
border: 1px solid $osd_outer_borders_color;
box-shadow: 0 2px 4px 0 $shadow_color;
text-shadow: 0 1px if($variant == 'light', rgba(255,255,255,0.2), rgba(0,0,0,0.2));
color: $osd_fg_color;
padding: $base_padding * 3;
margin: $base_margin;
}
// search overview container // search overview container
#searchResultsContent { #searchResultsContent {
max-width: $overview_search_container_width; max-width: 1024px;
} }
// search results sections "the boxes" // search results sections "the boxes"
.search-section { .search-section {
@extend %search_result_bubble; background-color: transparentize(lighten($osd_bg_color, 5%), 0.2);
spacing:0; border-radius: $modal_radius+3;
margin-top:0; border: 1px solid $osd_outer_borders_color;
margin-bottom:0; box-shadow: 0 2px 4px 0 $shadow_color;
text-shadow: 0 1px if($variant == 'light', rgba(255,255,255,0.2), rgba(0,0,0,0.2));
color: $osd_fg_color;
padding: $base_padding * 3;
margin: $base_margin;
spacing:$base_spacing * 2;
// hide separator // hide separator
&:first-child .search-section-separator, &:first-child .search-section-separator,
&:last-child .search-section-separator { &:last-child .search-section-separator {
background-color: transparent; background-color: transparent;
} }
// separator // separator
.search-section-separator { .search-section-separator {
// margin-top: $base_padding * 2; // margin-top: $base_padding * 2;
// height: 1px; // height: 1px;
// background-color: $osd_outer_borders_color; // background-color: $osd_outer_borders_color;
height: 0px; height: 0px;
background-color: transparent; background-color: transparent;
} }
// content // content
.search-section-content { .search-section-content {
spacing: 0; spacing: 0;
} }
} }
// "no results" text // "no results" text
.search-statustext { .search-statustext {
@extend %status_text; @extend %status_text;
} }
// Search results with icons // Search results with icons
.grid-search-result { .grid-search-result {
> .overview-icon { > .overview-icon {
@extend %icon_tile; @extend %icon_tile;
color: $osd_fg_color; color: $osd_fg_color;
} }
> .overview-icon.overview-icon-with-label { > .overview-icon.overview-icon-with-label {
padding: 10px 8px 5px 8px; padding: 10px 8px 5px 8px;
spacing: $base_spacing; spacing: $base_spacing;
} }
&:hover, &:hover,
&:focus, &:focus,
&:selected { &:selected {
.overview-icon { .overview-icon {
background-color: transparentize($osd_bg_color,0.8); background-color: transparentize($osd_bg_color,0.8);
color: $osd_fg_color; color: $osd_fg_color;
} }
} }
&:drop .overview-icon { &:drop .overview-icon {
background-color: transparentize($selected_bg_color,.15); background-color: transparentize($selected_bg_color,.15);
} }
&:active .overview-icon, &:active .overview-icon,
&:checked .overview-icon { &:checked .overview-icon {
background-color: transparentize(darken($osd_bg_color,10%), 0.5); background-color: transparentize(darken($osd_bg_color,10%), 0.5);
} }
} }
// search result provider // search result provider
.search-provider-icon { .search-provider-icon {
@extend %icon_tile; @extend %icon_tile;
padding: 0; padding: 0;
spacing: 0; spacing: 0;
margin-right: $base_margin * 2; margin-right: $base_margin * 2;
&:focus, &:focus,
&:selected, &:selected,
&:hover { &:hover {
background-color: transparentize($osd_fg_color,.9); background-color: transparentize($osd_fg_color,.9);
transition-duration: 200ms; transition-duration: 200ms;
} }
&:active, &:active,
&:checked { &:checked {
background-color: transparentize(darken($osd_bg_color,10%),.1); background-color: transparentize(darken($osd_bg_color,10%),.1);
} }
// content // content
.list-search-provider-content { .list-search-provider-content {
spacing: $base_spacing * 2; spacing: $base_spacing * 2;
// provider labels // provider labels
.list-search-provider-details { .list-search-provider-details {
width: 120px; width: 120px;
margin-top: 0; margin-top: 0;
color: darken($osd_fg_color, 8%); color: darken($osd_fg_color, 8%);
// font-weight: bold; // font-weight: bold;
} }
} }
} }
// search results list // search results list
.list-search-results { .list-search-results {
spacing: $base_spacing; spacing: $base_spacing;
} }
// search result listitem // search result listitem
.list-search-result { .list-search-result {
@extend %icon_tile; @extend %icon_tile;
spacing: 0; spacing: 0;
padding: $base_padding; padding: $base_padding;
color: $osd_fg_color; color: $osd_fg_color;
&:focus, &:focus,
&:selected, &:selected,
&:hover { &:hover {
background-color: transparentize($osd_fg_color,.9); background-color: transparentize($osd_fg_color,.9);
transition-duration: 200ms; transition-duration: 200ms;
} }
&:active, &:active,
&:checked { &:checked {
background-color: transparentize(darken($osd_bg_color,10%),.1); background-color: transparentize(darken($osd_bg_color,10%),.1);
} }
// content // content
.list-search-result-content { .list-search-result-content {
spacing: 0; spacing: 0;
} }
// list item title // list item title
.list-search-result-title { .list-search-result-title {
color: $osd_fg_color; color: $osd_fg_color;
spacing: $base_spacing * 2; spacing: $base_spacing * 2;
padding-right: $base_padding; padding-right: $base_padding;
// font-weight: bold; // font-weight: bold;
} }
// list item description // list item description
.list-search-result-description { .list-search-result-description {
color: darken($osd_fg_color, 30%); color: darken($osd_fg_color, 30%);
} }
} }

View File

@ -3,25 +3,25 @@
$slider_size: 15px; $slider_size: 15px;
.slider { .slider {
height: $slider_size; height: $slider_size;
// slider trough // slider trough
-barlevel-height: 3px; // has to be an odd number -barlevel-height: 3px; // has to be an odd number
-barlevel-background-color: $borders_color; //background of the trough -barlevel-background-color: $borders_color; //background of the trough
-barlevel-border-width: 1px; -barlevel-border-width: 1px;
-barlevel-border-color: $borders_color; // trough border color -barlevel-border-color: $borders_color; // trough border color
// fill style // fill style
-barlevel-active-background-color: $selected_bg_color; //active trough fill -barlevel-active-background-color: $selected_bg_color; //active trough fill
-barlevel-active-border-color: if($variant == 'light', darken($selected_bg_color, 4%), lighten($selected_bg_color, 2%)); //active trough border -barlevel-active-border-color: if($variant == 'light', darken($selected_bg_color, 4%), lighten($selected_bg_color, 2%)); //active trough border
// overfill style (red in this case) // overfill style (red in this case)
-barlevel-overdrive-color: $destructive_color; -barlevel-overdrive-color: $destructive_color;
-barlevel-overdrive-border-color: if($variant == 'light', darken($destructive_color, 4%), lighten($destructive_color, 2%)); //trough border when red; -barlevel-overdrive-border-color: if($variant == 'light', darken($destructive_color, 4%), lighten($destructive_color, 2%)); //trough border when red;
-barlevel-overdrive-separator-width:1px; -barlevel-overdrive-separator-width:1px;
// slider hander // slider hander
-slider-handle-radius: $slider_size * 0.5; // half the size of the size -slider-handle-radius: $slider_size * 0.5; // half the size of the size
-slider-handle-border-width: 1px; -slider-handle-border-width: 1px;
-slider-handle-border-color: if($variant == 'light', $borders_color, $fg_color); -slider-handle-border-color: if($variant == 'light', $borders_color, $fg_color);
color: if($variant == 'light', lighten($bg_color, 10%), $fg_color); color: if($variant == 'light', lighten($bg_color, 10%), $fg_color);
&:hover { color: $hover_bg_color; } &:hover { color: $hover_bg_color; }
&:active { color: $active_bg_color; } &:active { color: $active_bg_color; }
} }

View File

@ -5,12 +5,12 @@ $switch_height: 22px;
$switch_width: 46px; $switch_width: 46px;
.toggle-switch { .toggle-switch {
color: $fg_color; color: $fg_color;
height: $switch_height; height: $switch_height;
width: $switch_width; width: $switch_width;
background-size: contain; background-size: contain;
background-image: if($variant == 'light', url("resource:///org/gnome/shell/theme/toggle-off.svg"),url("resource:///org/gnome/shell/theme/toggle-off-dark.svg")); background-image: if($variant == 'light', url("resource:///org/gnome/shell/theme/toggle-off.svg"),url("resource:///org/gnome/shell/theme/toggle-off-dark.svg"));
&:checked { &:checked {
background-image: if($variant == 'light', url("resource:///org/gnome/shell/theme/toggle-on.svg"),url("resource:///org/gnome/shell/theme/toggle-on-dark.svg")); background-image: if($variant == 'light', url("resource:///org/gnome/shell/theme/toggle-on.svg"),url("resource:///org/gnome/shell/theme/toggle-on-dark.svg"));
} }
} }

View File

@ -2,18 +2,18 @@
/* Tiled window previews */ /* Tiled window previews */
$tile_corner_radius: $base_border_radius + 1px; $tile_corner_radius: $base_border_radius + 1px;
.tile-preview { .tile-preview {
background-color: transparentize($selected_bg_color,0.5); background-color: transparentize($selected_bg_color,0.5);
border: 1px solid $selected_bg_color; border: 1px solid $selected_bg_color;
} }
.tile-preview-left.on-primary { .tile-preview-left.on-primary {
border-radius: $tile_corner_radius 0 0 0; border-radius: $tile_corner_radius 0 0 0;
} }
.tile-preview-right.on-primary { .tile-preview-right.on-primary {
border-radius: 0 $tile_corner_radius 0 0; border-radius: 0 $tile_corner_radius 0 0;
} }
.tile-preview-left.tile-preview-right.on-primary { .tile-preview-left.tile-preview-right.on-primary {
border-radius: $tile_corner_radius $tile_corner_radius 0 0; border-radius: $tile_corner_radius $tile_corner_radius 0 0;
} }

View File

@ -11,56 +11,56 @@ $window_close_button_padding: 3px;
// Window picker // Window picker
.window-picker { .window-picker {
// Space between window thumbnails // Space between window thumbnails
-horizontal-spacing: $window_picker_spacing; -horizontal-spacing: $window_picker_spacing;
-vertical-spacing: $window_picker_spacing; -vertical-spacing: $window_picker_spacing;
// Padding for container around window thumbnails // Padding for container around window thumbnails
padding: $window_picker_padding; padding: $window_picker_padding;
&.external-monitor { padding: $window_picker_padding; } &.external-monitor { padding: $window_picker_padding; }
} }
// Borders on window thumbnails // Borders on window thumbnails
.window-clone-border { .window-clone-border {
border: 6px solid $window_thumbnail_border_color; border: 6px solid $window_thumbnail_border_color;
border-radius: $base_border_radius + 2px; border-radius: $base_border_radius + 2px;
// For window decorations with round corners we can't match // For window decorations with round corners we can't match
// the exact shape when the window is scaled. So apply a shadow // the exact shape when the window is scaled. So apply a shadow
// to fix that case // to fix that case
box-shadow: inset 0 0 0 1px transparentize($borders_color, 0.8); box-shadow: inset 0 0 0 1px transparentize($borders_color, 0.8);
} }
// Window titles // Window titles
.window-caption { .window-caption {
spacing: 24px; spacing: 24px;
color: $selected_fg_color; color: $selected_fg_color;
background-color: rgba(0,0,0,0.5); background-color: rgba(0,0,0,0.5);
border:1px solid rgba(0,0,0,0.6); border:1px solid rgba(0,0,0,0.6);
border-radius: 8px; border-radius: 8px;
margin-top: 24px; margin-top: 24px;
padding: 4px 12px; padding: 4px 12px;
font-size: $base_font_size + 1pt; font-size: $base_font_size + 1pt;
font-weight: bold; font-weight: bold;
} }
// Close button // Close button
.window-close { .window-close {
background-color: $selected_bg_color; background-color: $selected_bg_color;
color: $selected_fg_color; color: $selected_fg_color;
border: none; border: none;
border-radius: $window_close_button_size * 0.5 + $window_close_button_padding * 2; border-radius: $window_close_button_size * 0.5 + $window_close_button_padding * 2;
padding: $window_close_button_padding; padding: $window_close_button_padding;
height: $window_close_button_size; height: $window_close_button_size;
width: $window_close_button_size; width: $window_close_button_size;
box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.5); box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.5);
-shell-close-overlap: $window_close_button_size * 0.5; -shell-close-overlap: $window_close_button_size * 0.5;
&:hover { &:hover {
background-color: lighten($selected_bg_color, 5%); background-color: lighten($selected_bg_color, 5%);
} }
&:active { &:active {
background-color: darken($selected_bg_color, 5%); background-color: darken($selected_bg_color, 5%);
} }
} }

View File

@ -1,70 +1,70 @@
/* Workspace Switcher */ /* Workspace Switcher */
.workspace-switcher-group { .workspace-switcher-group {
padding: $base_padding * 2; padding: $base_padding * 2;
} }
.workspace-switcher-container { .workspace-switcher-container {
@extend %osd_panel; @extend %osd_panel;
box-shadow: 0 2px 10px 2px rgba(0,0,0,0.2); box-shadow: 0 2px 10px 2px rgba(0,0,0,0.2);
} }
.workspace-switcher { .workspace-switcher {
background: transparent; background: transparent;
border: none; border: none;
border-radius: 0; border-radius: 0;
padding: 0; padding: 0;
spacing: $base_spacing * 2; spacing: $base_spacing * 2;
.ws-switcher-box { .ws-switcher-box {
// background: transparent; // background: transparent;
background: transparent; background: transparent;
height: 50px; height: 50px;
background-size: 32px; background-size: 32px;
border: 1px solid transparentize($osd_fg_color,0.9); border: 1px solid transparentize($osd_fg_color,0.9);
border-radius: $base_border_radius + 3px; border-radius: $base_border_radius + 3px;
} }
// active workspace in the switcher // active workspace in the switcher
.ws-switcher-active-up, .ws-switcher-active-up,
.ws-switcher-active-down, .ws-switcher-active-down,
.ws-switcher-active-left, .ws-switcher-active-left,
.ws-switcher-active-right { .ws-switcher-active-right {
background-color: $selected_bg_color; background-color: $selected_bg_color;
border: 1px solid if($variant=='light', darken($selected_bg_color, 8%), lighten($selected_bg_color, 5%)); border: 1px solid if($variant=='light', darken($selected_bg_color, 8%), lighten($selected_bg_color, 5%));
color: $selected_fg_color; color: $selected_fg_color;
} }
} }
/* Workspace pager */ /* Workspace pager */
// thumbnails in overview // thumbnails in overview
.workspace-thumbnails { .workspace-thumbnails {
@extend %overview_panel; @extend %overview_panel;
visible-width: 32px; //amount visible before hover visible-width: 32px; //amount visible before hover
spacing: $base_spacing; spacing: $base_spacing;
padding: $base_padding; padding: $base_padding;
//fixme: can't have non uniform borders :( //fixme: can't have non uniform borders :(
border-top-left-radius:0 !important; border-top-left-radius:0 !important;
border-bottom-left-radius:0 !important; border-bottom-left-radius:0 !important;
border-right-width: 0 !important; border-right-width: 0 !important;
&:rtl { &:rtl {
border-radius: 0 $modal_radius $modal_radius 0; border-radius: 0 $modal_radius $modal_radius 0;
border-left-width: 0 !important; border-left-width: 0 !important;
} }
// drag and drop indicator // drag and drop indicator
.placeholder { .placeholder {
background-image: url("resource:///org/gnome/shell/theme/dash-placeholder.svg"); background-image: url("resource:///org/gnome/shell/theme/dash-placeholder.svg");
background-size: contain; background-size: contain;
height: 24px; height: 24px;
} }
} }
// selected indicator // selected indicator
.workspace-thumbnail-indicator { .workspace-thumbnail-indicator {
border: 3px solid $selected_bg_color; border: 3px solid $selected_bg_color;
border-radius: 3px; border-radius: 3px;
padding: 0px; padding: 0px;
// background-color: transparentize($selected_bg_color, 0.9); // background-color: transparentize($selected_bg_color, 0.9);
} }

View File

@ -268,7 +268,7 @@ stage {
padding: 8px 0; } padding: 8px 0; }
.calendar .calendar-change-month-back StIcon, .calendar .calendar-change-month-back StIcon,
.calendar .calendar-change-month-forward StIcon { .calendar .calendar-change-month-forward StIcon {
icon-size: 1.09em; } icon-size: 16px; }
.calendar .pager-button { .calendar .pager-button {
background-color: transparent; background-color: transparent;
height: 32px; height: 32px;
@ -352,7 +352,7 @@ stage {
spacing-rows: 6px; spacing-rows: 6px;
spacing-columns: 12px; } spacing-columns: 12px; }
.weather-box .weather-forecast-icon { .weather-box .weather-forecast-icon {
icon-size: 2.18em; } icon-size: 32px; }
.weather-box .weather-forecast-time { .weather-box .weather-forecast-time {
color: #a6a69b; color: #a6a69b;
font-feature-settings: "tnum"; font-feature-settings: "tnum";
@ -495,8 +495,8 @@ stage {
spacing: 20px; } spacing: 20px; }
.message-dialog-icon { .message-dialog-icon {
min-width: 3.27em; min-width: 48px;
icon-size: 3.27em; } icon-size: 48px; }
.message-dialog-title { .message-dialog-title {
font-weight: bold; } font-weight: bold; }
@ -507,7 +507,7 @@ stage {
/* ShellMountOperation Dialogs */ /* ShellMountOperation Dialogs */
.shell-mount-operation-icon { .shell-mount-operation-icon {
icon-size: 3.27em; } icon-size: 48px; }
.mount-dialog { .mount-dialog {
spacing: 24px; } spacing: 24px; }
@ -649,7 +649,7 @@ stage {
spacing: 20px; } spacing: 20px; }
.audio-selection-device-icon { .audio-selection-device-icon {
icon-size: 4.36em; } icon-size: 64px; }
/* Access Dialog */ /* Access Dialog */
.access-dialog { .access-dialog {
@ -708,14 +708,14 @@ stage {
.end-session-dialog-logout-icon { .end-session-dialog-logout-icon {
border-radius: 99px; border-radius: 99px;
width: 3.27em; width: 48px;
height: 3.27em; height: 48px;
background-size: contain; } background-size: contain; }
.end-session-dialog-shutdown-icon { .end-session-dialog-shutdown-icon {
color: #eeeeec; color: #eeeeec;
width: 3.27em; width: 48px;
height: 3.27em; } height: 48px; }
.end-session-dialog-inhibitor-layout { .end-session-dialog-inhibitor-layout {
spacing: 24px; spacing: 24px;
@ -765,7 +765,7 @@ StEntry {
warning-color: #f57900; warning-color: #f57900;
padding: 0 4px; } padding: 0 4px; }
StEntry StIcon.peek-password { StEntry StIcon.peek-password {
icon-size: 1.09em; icon-size: 16px;
padding: 0 4px; } padding: 0 4px; }
.hotplug-transient-box { .hotplug-transient-box {
@ -844,7 +844,20 @@ StEntry {
icon-size: 1em; } icon-size: 1em; }
/* On-screen Keyboard */ /* On-screen Keyboard */
.keyboard-key, .keyboard-subkeys .keyboard-key { #keyboard {
background-color: rgba(32, 32, 32, 0.9);
box-shadow: inset 0 1px 0 0 rgba(50, 50, 50, 0.96) !important; }
#keyboard .page-indicator {
padding: 6px; }
#keyboard .page-indicator .page-indicator-icon {
width: 6px;
height: 6px; }
.key-container {
padding: 4px;
spacing: 4px; }
.keyboard-key {
color: #eeeeec; color: #eeeeec;
background-color: #3c3c3c !important; background-color: #3c3c3c !important;
border-width: 1px; border-width: 1px;
@ -852,7 +865,11 @@ StEntry {
border-color: #2b2b2b; border-color: #2b2b2b;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
icon-shadow: 0 1px rgba(0, 0, 0, 0.2); } icon-shadow: 0 1px rgba(0, 0, 0, 0.2);
font-size: 16pt;
min-height: 1.2em;
min-width: 1.2em;
border-radius: 8px; }
.keyboard-key:focus { .keyboard-key:focus {
color: #eeeeec; color: #eeeeec;
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
@ -876,27 +893,6 @@ StEntry {
text-shadow: none; text-shadow: none;
icon-shadow: none; icon-shadow: none;
box-shadow: none; } box-shadow: none; }
#keyboard {
background-color: rgba(32, 32, 32, 0.9);
box-shadow: inset 0 1px 0 0 rgba(50, 50, 50, 0.96) !important; }
#keyboard .page-indicator {
padding: 6px; }
#keyboard .page-indicator .page-indicator-icon {
width: 6px;
height: 6px; }
#keyboard .page-indicator .page-indicator-icon:checked {
background-color: red; }
.key-container {
padding: 4px;
spacing: 4px; }
.keyboard-key {
font-size: 16pt;
min-height: 1.2em;
min-width: 1.2em;
border-radius: 8px; }
.keyboard-key:grayed { .keyboard-key:grayed {
background-color: #2d2d2d; background-color: #2d2d2d;
color: #eeeeec; color: #eeeeec;
@ -910,8 +906,7 @@ StEntry {
border-color: rgba(27, 27, 27, 0.96); border-color: rgba(27, 27, 27, 0.96);
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
icon-shadow: 0 1px rgba(0, 0, 0, 0.2); icon-shadow: 0 1px rgba(0, 0, 0, 0.2); }
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important; }
.keyboard-key.default-key:hover, .keyboard-key.default-key:checked { .keyboard-key.default-key:hover, .keyboard-key.default-key:checked {
color: #eeeeec; color: #eeeeec;
background-color: rgba(50, 50, 50, 0.96) !important; background-color: rgba(50, 50, 50, 0.96) !important;
@ -939,8 +934,7 @@ StEntry {
border-color: #1961b9; border-color: #1961b9;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
icon-shadow: 0 1px rgba(0, 0, 0, 0.2); icon-shadow: 0 1px rgba(0, 0, 0, 0.2); }
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) !important; }
.keyboard-key.enter-key:hover, .keyboard-key.enter-key:checked { .keyboard-key.enter-key:hover, .keyboard-key.enter-key:checked {
color: #eeeeec; color: #eeeeec;
background-color: #2c7fe3 !important; background-color: #2c7fe3 !important;
@ -980,7 +974,38 @@ StEntry {
-arrow-rise: 10px; -arrow-rise: 10px;
-boxpointer-gap: 6px; } -boxpointer-gap: 6px; }
.keyboard-subkeys .keyboard-key { .keyboard-subkeys .keyboard-key {
color: #eeeeec;
background-color: #3c3c3c !important;
border-width: 1px;
border-style: solid;
border-color: #2b2b2b;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
icon-shadow: 0 1px rgba(0, 0, 0, 0.2);
border-radius: 5px; } border-radius: 5px; }
.keyboard-subkeys .keyboard-key:focus {
color: #eeeeec;
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
icon-shadow: 0 1px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 0 0 2px rgba(27, 106, 203, 0.3); }
.keyboard-subkeys .keyboard-key:hover, .keyboard-subkeys .keyboard-key:checked {
color: #eeeeec;
background-color: #424242 !important;
border-width: 1px;
border-style: solid;
border-color: #2b2b2b;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
icon-shadow: 0 1px rgba(0, 0, 0, 0.2); }
.keyboard-subkeys .keyboard-key:active {
color: #eeeeec;
background-color: #2d2d2d !important;
border-width: 1px;
border-style: solid;
border-color: #191919;
text-shadow: none;
icon-shadow: none;
box-shadow: none; }
.emoji-page .keyboard-key { .emoji-page .keyboard-key {
background-color: transparent; background-color: transparent;
@ -1294,16 +1319,17 @@ StEntry {
.message .message-close-button:hover { .message .message-close-button:hover {
color: #d6d6d1; } color: #d6d6d1; }
.message .message-icon-bin { .message .message-icon-bin {
padding: 6px;
margin: 6px 0; } margin: 6px 0; }
.message .message-icon-bin > StIcon { .message .message-icon-bin > StIcon {
color: #eeeeec; color: #eeeeec;
icon-size: 2.18em; icon-size: 32px;
-st-icon-style: symbolic; -st-icon-style: symbolic;
padding: 0; padding: 0;
margin: 6px; } margin: 6px; }
.message .message-icon-bin > .fallback-window-icon { .message .message-icon-bin > .fallback-window-icon {
width: 1.09em; width: 16px;
height: 1.09em; } height: 16px; }
.message .message-secondary-bin { .message .message-secondary-bin {
padding: 0; } padding: 0; }
.message .message-secondary-bin > .event-time { .message .message-secondary-bin > .event-time {
@ -1332,14 +1358,14 @@ StEntry {
border-radius: 7px 0 0 7px; } border-radius: 7px 0 0 7px; }
.media-message-cover-icon { .media-message-cover-icon {
icon-size: 2.18em !important; icon-size: 32px !important;
border-radius: 5px; } border-radius: 5px; }
.media-message-cover-icon.fallback { .media-message-cover-icon.fallback {
color: #c5c5be; color: #c5c5be;
background-color: #353535; background-color: #353535;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: 5px; border-radius: 5px;
icon-size: 2.18em !important; icon-size: 32px !important;
padding: 12px; } padding: 12px; }
/* Notifications & Mesage Tray */ /* Notifications & Mesage Tray */
@ -1362,7 +1388,7 @@ StEntry {
.notification-banner .message-content, .notification-banner:focus .message-content, .notification-banner:active .message-content { .notification-banner .message-content, .notification-banner:focus .message-content, .notification-banner:active .message-content {
color: #eeeeec; } color: #eeeeec; }
.notification-banner .message-icon-bin > StIcon { .notification-banner .message-icon-bin > StIcon {
icon-size: 2.18em; icon-size: 32px;
color: #eeeeec; } color: #eeeeec; }
.notification-banner .notification-icon { .notification-banner .notification-icon {
padding: 5px; } padding: 5px; }
@ -1370,7 +1396,7 @@ StEntry {
padding: 5px; padding: 5px;
spacing: 5px; } spacing: 5px; }
.notification-banner .secondary-icon { .notification-banner .secondary-icon {
icon-size: 1.09em; } icon-size: 16px; }
.notification-banner .notification-actions { .notification-banner .notification-actions {
padding-top: 0; padding-top: 0;
color: #eeeeec; color: #eeeeec;
@ -1397,7 +1423,7 @@ StEntry {
border-radius: 0.9em; } border-radius: 0.9em; }
.secondary-icon { .secondary-icon {
icon-size: 1.09em; } icon-size: 16px; }
.chat-body { .chat-body {
spacing: 5px; } spacing: 5px; }
@ -1505,7 +1531,7 @@ StEntry {
font-weight: bold; } font-weight: bold; }
.nm-dialog-header-icon { .nm-dialog-header-icon {
icon-size: 2.18em; } icon-size: 32px; }
.nm-dialog-header-hbox { .nm-dialog-header-hbox {
spacing: 10px; } spacing: 10px; }
@ -1525,7 +1551,7 @@ StEntry {
color: #fff; } color: #fff; }
.nm-dialog-icon { .nm-dialog-icon {
icon-size: 1.09em; } icon-size: 16px; }
.nm-dialog-icons { .nm-dialog-icons {
spacing: 12px; } spacing: 12px; }
@ -1607,7 +1633,7 @@ StEntry {
box-shadow: inset 0 -2px 0 0 #1f76e1; box-shadow: inset 0 -2px 0 0 #1f76e1;
color: white; } color: white; }
#panel .panel-button .system-status-icon { #panel .panel-button .system-status-icon {
icon-size: 1.09em; icon-size: 16px;
padding: 5px; } padding: 5px; }
#panel .panel-button .app-menu-icon { #panel .panel-button .app-menu-icon {
margin-left: 4px; margin-left: 4px;
@ -1680,7 +1706,7 @@ StEntry {
.popup-menu-arrow, .popup-menu-arrow,
.popup-menu-icon { .popup-menu-icon {
icon-size: 1.09em; } icon-size: 16px; }
.popup-sub-menu { .popup-sub-menu {
background-color: #2d2d2d; background-color: #2d2d2d;
@ -1712,10 +1738,10 @@ StEntry {
-st-icon-style: symbolic; } -st-icon-style: symbolic; }
.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:ltr { .aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:ltr {
padding-left: 14px; padding-left: 14px;
margin-left: 1.09em; } margin-left: 16px; }
.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:rtl { .aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:rtl {
padding-right: 14px; padding-right: 14px;
margin-right: 1.09em; } margin-right: 16px; }
/* Screen Shield */ /* Screen Shield */
.screen-shield-arrows { .screen-shield-arrows {
@ -1832,11 +1858,14 @@ StScrollBar {
box-shadow: inset 0 1px 2px 1px rgba(0, 0, 0, 0.2); } box-shadow: inset 0 1px 2px 1px rgba(0, 0, 0, 0.2); }
.login-dialog StEntry .search-entry-icon, .login-dialog StEntry .search-entry-icon,
.search-entry .search-entry-icon { .search-entry .search-entry-icon {
icon-size: 1.09em; icon-size: 16px;
padding: 0 4px; padding: 0 4px;
color: inherit; } color: inherit; }
/* Search */ /* Search */
#searchResultsContent {
max-width: 1024px; }
.search-section { .search-section {
background-color: rgba(45, 45, 45, 0.76); background-color: rgba(45, 45, 45, 0.76);
border-radius: 13px; border-radius: 13px;
@ -1845,91 +1874,8 @@ StScrollBar {
text-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2);
color: #eeeeec; color: #eeeeec;
padding: 18px; padding: 18px;
margin: 4px; } margin: 4px;
spacing: 12px; }
#searchResultsContent {
max-width: 1024px; }
.search-section {
spacing: 0;
margin-top: 0;
margin-bottom: 0; }
.search-section:first-child .search-section-separator, .search-section:last-child .search-section-separator {
background-color: transparent; }
.search-section .search-section-separator {
height: 0px;
background-color: transparent; }
.search-section .search-section-content {
spacing: 0; }
.grid-search-result > .overview-icon {
color: #eeeeec; }
.grid-search-result > .overview-icon.overview-icon-with-label {
padding: 10px 8px 5px 8px;
spacing: 6px; }
.grid-search-result:hover .overview-icon, .grid-search-result:focus .overview-icon, .grid-search-result:selected .overview-icon {
background-color: rgba(32, 32, 32, 0.16);
color: #eeeeec; }
.grid-search-result:drop .overview-icon {
background-color: rgba(27, 106, 203, 0.85); }
.grid-search-result:active .overview-icon, .grid-search-result:checked .overview-icon {
background-color: rgba(7, 7, 7, 0.46); }
.search-provider-icon {
padding: 0;
spacing: 0;
margin-right: 8px; }
.search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover {
background-color: rgba(238, 238, 236, 0.1);
transition-duration: 200ms; }
.search-provider-icon:active, .search-provider-icon:checked {
background-color: rgba(7, 7, 7, 0.86); }
.search-provider-icon .list-search-provider-content {
spacing: 12px; }
.search-provider-icon .list-search-provider-content .list-search-provider-details {
width: 120px;
margin-top: 0;
color: #dbdbd6; }
.list-search-results {
spacing: 6px; }
.list-search-result {
spacing: 0;
padding: 6px;
color: #eeeeec; }
.list-search-result:focus, .list-search-result:selected, .list-search-result:hover {
background-color: rgba(238, 238, 236, 0.1);
transition-duration: 200ms; }
.list-search-result:active, .list-search-result:checked {
background-color: rgba(7, 7, 7, 0.86); }
.list-search-result .list-search-result-content {
spacing: 0; }
.list-search-result .list-search-result-title {
color: #eeeeec;
spacing: 12px;
padding-right: 6px; }
.list-search-result .list-search-result-description {
color: #a6a69b; }
/* Search */
.search-section {
background-color: rgba(45, 45, 45, 0.76);
border-radius: 13px;
border: 1px solid rgba(50, 50, 50, 0.96);
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
color: #eeeeec;
padding: 18px;
margin: 4px; }
#searchResultsContent {
max-width: 1024px; }
.search-section {
spacing: 0;
margin-top: 0;
margin-bottom: 0; }
.search-section:first-child .search-section-separator, .search-section:last-child .search-section-separator { .search-section:first-child .search-section-separator, .search-section:last-child .search-section-separator {
background-color: transparent; } background-color: transparent; }
.search-section .search-section-separator { .search-section .search-section-separator {

File diff suppressed because one or more lines are too long