diff --git a/src/gnome-shell/3.18/gnome-shell-compact.css b/src/gnome-shell/3.18/gnome-shell-compact.css index 4f288b392..84c9a0c9c 100644 --- a/src/gnome-shell/3.18/gnome-shell-compact.css +++ b/src/gnome-shell/3.18/gnome-shell-compact.css @@ -2358,8 +2358,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.18/gnome-shell-dark-compact.css b/src/gnome-shell/3.18/gnome-shell-dark-compact.css index 8d0d1b354..e8c0c537c 100644 --- a/src/gnome-shell/3.18/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.18/gnome-shell-dark-compact.css @@ -2358,8 +2358,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.18/gnome-shell-dark.css b/src/gnome-shell/3.18/gnome-shell-dark.css index f0e429a39..248875cfa 100644 --- a/src/gnome-shell/3.18/gnome-shell-dark.css +++ b/src/gnome-shell/3.18/gnome-shell-dark.css @@ -2358,8 +2358,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.18/gnome-shell-light-compact.css b/src/gnome-shell/3.18/gnome-shell-light-compact.css index 816f0228a..1471b3f77 100644 --- a/src/gnome-shell/3.18/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.18/gnome-shell-light-compact.css @@ -2358,8 +2358,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.18/gnome-shell-light.css b/src/gnome-shell/3.18/gnome-shell-light.css index 65eb69540..ee417c1e3 100644 --- a/src/gnome-shell/3.18/gnome-shell-light.css +++ b/src/gnome-shell/3.18/gnome-shell-light.css @@ -2358,8 +2358,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.18/gnome-shell.css b/src/gnome-shell/3.18/gnome-shell.css index 1e82c0054..0003fd799 100644 --- a/src/gnome-shell/3.18/gnome-shell.css +++ b/src/gnome-shell/3.18/gnome-shell.css @@ -2358,8 +2358,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.24/gnome-shell-compact.css b/src/gnome-shell/3.24/gnome-shell-compact.css index b2f510118..1fe9b7408 100644 --- a/src/gnome-shell/3.24/gnome-shell-compact.css +++ b/src/gnome-shell/3.24/gnome-shell-compact.css @@ -2401,8 +2401,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.24/gnome-shell-dark-compact.css b/src/gnome-shell/3.24/gnome-shell-dark-compact.css index ddbd4c720..ea89ce323 100644 --- a/src/gnome-shell/3.24/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.24/gnome-shell-dark-compact.css @@ -2401,8 +2401,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.24/gnome-shell-dark.css b/src/gnome-shell/3.24/gnome-shell-dark.css index fbc3f91f3..40b164b28 100644 --- a/src/gnome-shell/3.24/gnome-shell-dark.css +++ b/src/gnome-shell/3.24/gnome-shell-dark.css @@ -2401,8 +2401,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.24/gnome-shell-light-compact.css b/src/gnome-shell/3.24/gnome-shell-light-compact.css index f02bda238..666cbe09c 100644 --- a/src/gnome-shell/3.24/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.24/gnome-shell-light-compact.css @@ -2401,8 +2401,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.24/gnome-shell-light.css b/src/gnome-shell/3.24/gnome-shell-light.css index be933049e..c64f20f7c 100644 --- a/src/gnome-shell/3.24/gnome-shell-light.css +++ b/src/gnome-shell/3.24/gnome-shell-light.css @@ -2401,8 +2401,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.24/gnome-shell.css b/src/gnome-shell/3.24/gnome-shell.css index 2b8649a53..e7afe08e0 100644 --- a/src/gnome-shell/3.24/gnome-shell.css +++ b/src/gnome-shell/3.24/gnome-shell.css @@ -2401,8 +2401,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.26/gnome-shell-compact.css b/src/gnome-shell/3.26/gnome-shell-compact.css index 3d5bdb7e6..eff7b7396 100644 --- a/src/gnome-shell/3.26/gnome-shell-compact.css +++ b/src/gnome-shell/3.26/gnome-shell-compact.css @@ -2378,8 +2378,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.26/gnome-shell-dark-compact.css b/src/gnome-shell/3.26/gnome-shell-dark-compact.css index 0c20fdf47..6c69b7344 100644 --- a/src/gnome-shell/3.26/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.26/gnome-shell-dark-compact.css @@ -2378,8 +2378,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.26/gnome-shell-dark.css b/src/gnome-shell/3.26/gnome-shell-dark.css index 075ae8422..2b0b27311 100644 --- a/src/gnome-shell/3.26/gnome-shell-dark.css +++ b/src/gnome-shell/3.26/gnome-shell-dark.css @@ -2378,8 +2378,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.26/gnome-shell-light-compact.css b/src/gnome-shell/3.26/gnome-shell-light-compact.css index 526ad9b77..c9b416a0a 100644 --- a/src/gnome-shell/3.26/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.26/gnome-shell-light-compact.css @@ -2378,8 +2378,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.26/gnome-shell-light.css b/src/gnome-shell/3.26/gnome-shell-light.css index 17394b1ea..799ee9a66 100644 --- a/src/gnome-shell/3.26/gnome-shell-light.css +++ b/src/gnome-shell/3.26/gnome-shell-light.css @@ -2378,8 +2378,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.26/gnome-shell.css b/src/gnome-shell/3.26/gnome-shell.css index 73d4ba019..d939e11a5 100644 --- a/src/gnome-shell/3.26/gnome-shell.css +++ b/src/gnome-shell/3.26/gnome-shell.css @@ -2378,8 +2378,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.28/gnome-shell-compact.css b/src/gnome-shell/3.28/gnome-shell-compact.css index cfa478aee..dca01621c 100644 --- a/src/gnome-shell/3.28/gnome-shell-compact.css +++ b/src/gnome-shell/3.28/gnome-shell-compact.css @@ -2381,8 +2381,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.28/gnome-shell-dark-compact.css b/src/gnome-shell/3.28/gnome-shell-dark-compact.css index 422535aaa..92730dc82 100644 --- a/src/gnome-shell/3.28/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.28/gnome-shell-dark-compact.css @@ -2381,8 +2381,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.28/gnome-shell-dark.css b/src/gnome-shell/3.28/gnome-shell-dark.css index 28d4d0e50..196664a41 100644 --- a/src/gnome-shell/3.28/gnome-shell-dark.css +++ b/src/gnome-shell/3.28/gnome-shell-dark.css @@ -2381,8 +2381,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.28/gnome-shell-light-compact.css b/src/gnome-shell/3.28/gnome-shell-light-compact.css index 5851d3d61..950c04e44 100644 --- a/src/gnome-shell/3.28/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.28/gnome-shell-light-compact.css @@ -2381,8 +2381,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.28/gnome-shell-light.css b/src/gnome-shell/3.28/gnome-shell-light.css index 917313392..1503b72f4 100644 --- a/src/gnome-shell/3.28/gnome-shell-light.css +++ b/src/gnome-shell/3.28/gnome-shell-light.css @@ -2381,8 +2381,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.28/gnome-shell.css b/src/gnome-shell/3.28/gnome-shell.css index 0f25c0f00..24673c93e 100644 --- a/src/gnome-shell/3.28/gnome-shell.css +++ b/src/gnome-shell/3.28/gnome-shell.css @@ -2381,8 +2381,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.30/gnome-shell-compact.css b/src/gnome-shell/3.30/gnome-shell-compact.css index edc17a198..f468b2d91 100644 --- a/src/gnome-shell/3.30/gnome-shell-compact.css +++ b/src/gnome-shell/3.30/gnome-shell-compact.css @@ -2388,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.30/gnome-shell-dark-compact.css b/src/gnome-shell/3.30/gnome-shell-dark-compact.css index a4b5695c4..b86aef10c 100644 --- a/src/gnome-shell/3.30/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.30/gnome-shell-dark-compact.css @@ -2388,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.30/gnome-shell-dark.css b/src/gnome-shell/3.30/gnome-shell-dark.css index 8527e040a..d46a311d3 100644 --- a/src/gnome-shell/3.30/gnome-shell-dark.css +++ b/src/gnome-shell/3.30/gnome-shell-dark.css @@ -2388,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.30/gnome-shell-light-compact.css b/src/gnome-shell/3.30/gnome-shell-light-compact.css index 9e18ca930..0b9f9bed9 100644 --- a/src/gnome-shell/3.30/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.30/gnome-shell-light-compact.css @@ -2388,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.30/gnome-shell-light.css b/src/gnome-shell/3.30/gnome-shell-light.css index cef4353fb..b1d511148 100644 --- a/src/gnome-shell/3.30/gnome-shell-light.css +++ b/src/gnome-shell/3.30/gnome-shell-light.css @@ -2388,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.30/gnome-shell.css b/src/gnome-shell/3.30/gnome-shell.css index 6c44e582a..1732e3a12 100644 --- a/src/gnome-shell/3.30/gnome-shell.css +++ b/src/gnome-shell/3.30/gnome-shell.css @@ -2388,8 +2388,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; diff --git a/src/gnome-shell/3.32/gnome-shell-compact.css b/src/gnome-shell/3.32/gnome-shell-compact.css index edc17a198..45e205d37 100644 --- a/src/gnome-shell/3.32/gnome-shell-compact.css +++ b/src/gnome-shell/3.32/gnome-shell-compact.css @@ -461,7 +461,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-logout-icon { - border-radius: 5px; + border-radius: 9999px; width: 48px; height: 48px; background-size: contain; @@ -645,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-icon { - border-radius: 5px; + border-radius: 9999px; background-size: contain; width: 48px; height: 48px; @@ -730,6 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-sub-menu { + padding-bottom: 0; background-color: rgba(0, 0, 0, 0.04); box-shadow: 0 0 transparent; } @@ -1002,7 +1003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0.6); + background-color: #212121; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; @@ -1020,13 +1021,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0.6); - -panel-corner-border-width: 2px; + -panel-corner-background-color: transparent; + -panel-corner-border-width: 0; -panel-corner-border-color: transparent; } #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus { - -panel-corner-border-color: white; + -panel-corner-border-color: transparent; } #panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen { @@ -1068,7 +1069,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - background-color: rgba(0, 0, 0, 0.01); + background-color: rgba(33, 33, 33, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1245,14 +1246,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.world-clocks-grid { +.weather-header.location { + font-weight: normal; + font-size: 1em; +} + +.world-clocks-grid, +.weather-grid { spacing-rows: 0.4em; + spacing-columns: 0.8em; } .weather-box { spacing: 0.4em; } +.world-clocks-city { + font-weight: bold; + font-size: 1em; +} + +.world-clocks-time { + color: rgba(0, 0, 0, 0.54); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.world-clocks-timezone { + color: rgba(0, 0, 0, 0.38); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.weather-forecast-icon { + icon-size: 2.28571em; +} + +.weather-forecast-time { + color: rgba(0, 0, 0, 0.54); + font-size: 9pt; + font-weight: 400; +} + .calendar-month-label { transition-duration: 100ms; height: 16px; @@ -1275,32 +1310,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.87); + color: rgba(0, 0, 0, 0.54); } .pager-button:hover, .pager-button:focus { background-color: rgba(0, 0, 0, 0.08); + color: rgba(0, 0, 0, 0.87); } .pager-button:active { background-color: rgba(0, 0, 0, 0.2); + color: rgba(0, 0, 0, 0.87); transition-duration: 200ms; } -.calendar-change-month-back { - background-image: url("assets/calendar-arrow-left.svg"); -} - -.calendar-change-month-back:rtl { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward:rtl { - background-image: url("assets/calendar-arrow-left.svg"); +.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { + icon-size: 1.14286em; } .calendar-day-base { @@ -1455,6 +1480,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 4px 4px 4px 0px; } +.message-icon-bin > .fallback-window-icon { + width: 1.14286em; + height: 1.14286em; +} + .message-secondary-bin { padding: 0 8px; } @@ -1560,12 +1590,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.38); } -.system-switch-user-submenu-icon.user-icon { - icon-size: 20px; - padding: 0 2px; -} - -.system-switch-user-submenu-icon.default-icon { +.system-switch-user-submenu-icon { icon-size: 16px; padding: 0 4px; } @@ -1579,6 +1604,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: transparent; } +.app-menu, +.app-well-menu { + max-width: 27.25em; +} + .aggregate-menu { min-width: 280px; } @@ -1633,6 +1663,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.3); background-image: none; background-size: auto; + box-shadow: none; } .ripple-box:rtl { @@ -1643,6 +1674,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-arrow { width: 16px; height: 16px; + icon-size: 1.14286em; } .popup-menu-icon { @@ -1650,6 +1682,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close { + background-color: transparent; + border-radius: 0; + border: none; + box-shadow: none; + color: transparent; height: 32px; width: 32px; -shell-close-overlap: 16px; @@ -1659,11 +1696,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close:hover { + background-color: transparent; + border-color: transparent; + color: transparent; -st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); background-image: url("assets/window-close.svg"); } .window-close:active { + background-color: transparent; + border-color: transparent; + color: transparent; background-image: url("assets/window-close-active.svg"); } @@ -1851,6 +1894,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.12); } +.search-section:last-child .search-section-separator { + background-color: transparent; +} + .list-search-result-content { spacing: 30px; } @@ -2090,6 +2137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator .page-indicator-icon { width: 12px; height: 12px; + border: none; border-radius: 12px; background-image: none; background-color: rgba(255, 255, 255, 0.3); @@ -2097,16 +2145,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .page-indicator:hover .page-indicator-icon { + border-color: transparent; background-image: none; background-color: rgba(255, 255, 255, 0.5); } .page-indicator:active .page-indicator-icon { + border: none; + margin: 0; background-image: none; background-color: rgba(255, 255, 255, 0.7); } -.page-indicator:checked .page-indicator-icon { +.page-indicator:checked .page-indicator-icon, +.page-indicator:checked:active .page-indicator-icon { background-image: none; background-color: white; transition-duration: 0ms; @@ -2114,6 +2166,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator:checked:active { background-image: none; + background-color: transparent; } .app-well-app > .overview-icon.overview-icon-with-label, @@ -2382,14 +2435,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(0, 0, 0, 0.3); } +#keyboard .page-indicator { + padding: 4px 4px; +} + +#keyboard .page-indicator .page-indicator-icon { + width: 8px; + height: 8px; +} + .key-container { padding: 4px; spacing: 4px; } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; @@ -2490,6 +2552,42 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } +.emoji-page .keyboard-key { + border: none; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 100ms; +} + +.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus { + color: white; + background-color: rgba(255, 255, 255, 0.08); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; +} + +.emoji-page .keyboard-key:active { + color: white; + background-color: rgba(255, 255, 255, 0.2); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 200ms; +} + +.emoji-panel .keyboard-key:latched { + border-color: transparent; + background-color: #4285F4; + color: white; +} + .candidate-popup-content { padding: 8px; spacing: 0; @@ -2557,14 +2655,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Auth Dialogs & Screen Shield */ -.framed-user-icon { +.user-icon { background-size: contain; border: none; color: white; - border-radius: 4px; + border-radius: 9999px; } -.framed-user-icon:hover { +.user-icon:hover { border-color: white; color: white; } diff --git a/src/gnome-shell/3.32/gnome-shell-dark-compact.css b/src/gnome-shell/3.32/gnome-shell-dark-compact.css index a4b5695c4..ca908c6da 100644 --- a/src/gnome-shell/3.32/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.32/gnome-shell-dark-compact.css @@ -461,7 +461,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-logout-icon { - border-radius: 5px; + border-radius: 9999px; width: 48px; height: 48px; background-size: contain; @@ -645,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-icon { - border-radius: 5px; + border-radius: 9999px; background-size: contain; width: 48px; height: 48px; @@ -730,6 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-sub-menu { + padding-bottom: 0; background-color: rgba(255, 255, 255, 0.04); box-shadow: 0 0 transparent; } @@ -1002,7 +1003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0.6); + background-color: #212121; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; @@ -1020,13 +1021,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0.6); - -panel-corner-border-width: 2px; + -panel-corner-background-color: transparent; + -panel-corner-border-width: 0; -panel-corner-border-color: transparent; } #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus { - -panel-corner-border-color: white; + -panel-corner-border-color: transparent; } #panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen { @@ -1068,7 +1069,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - background-color: rgba(0, 0, 0, 0.01); + background-color: rgba(33, 33, 33, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1245,14 +1246,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.world-clocks-grid { +.weather-header.location { + font-weight: normal; + font-size: 1em; +} + +.world-clocks-grid, +.weather-grid { spacing-rows: 0.4em; + spacing-columns: 0.8em; } .weather-box { spacing: 0.4em; } +.world-clocks-city { + font-weight: bold; + font-size: 1em; +} + +.world-clocks-time { + color: rgba(255, 255, 255, 0.7); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.world-clocks-timezone { + color: rgba(255, 255, 255, 0.5); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.weather-forecast-icon { + icon-size: 2.28571em; +} + +.weather-forecast-time { + color: rgba(255, 255, 255, 0.7); + font-size: 9pt; + font-weight: 400; +} + .calendar-month-label { transition-duration: 100ms; height: 16px; @@ -1275,32 +1310,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 2px; border-radius: 100px; background-color: transparent; - color: white; + color: rgba(255, 255, 255, 0.7); } .pager-button:hover, .pager-button:focus { background-color: rgba(255, 255, 255, 0.08); + color: white; } .pager-button:active { background-color: rgba(255, 255, 255, 0.2); + color: white; transition-duration: 200ms; } -.calendar-change-month-back { - background-image: url("assets/calendar-arrow-left.svg"); -} - -.calendar-change-month-back:rtl { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward:rtl { - background-image: url("assets/calendar-arrow-left.svg"); +.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { + icon-size: 1.14286em; } .calendar-day-base { @@ -1455,6 +1480,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 4px 4px 4px 0px; } +.message-icon-bin > .fallback-window-icon { + width: 1.14286em; + height: 1.14286em; +} + .message-secondary-bin { padding: 0 8px; } @@ -1560,12 +1590,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.5); } -.system-switch-user-submenu-icon.user-icon { - icon-size: 20px; - padding: 0 2px; -} - -.system-switch-user-submenu-icon.default-icon { +.system-switch-user-submenu-icon { icon-size: 16px; padding: 0 4px; } @@ -1579,6 +1604,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: transparent; } +.app-menu, +.app-well-menu { + max-width: 27.25em; +} + .aggregate-menu { min-width: 280px; } @@ -1633,6 +1663,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.3); background-image: none; background-size: auto; + box-shadow: none; } .ripple-box:rtl { @@ -1643,6 +1674,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-arrow { width: 16px; height: 16px; + icon-size: 1.14286em; } .popup-menu-icon { @@ -1650,6 +1682,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close { + background-color: transparent; + border-radius: 0; + border: none; + box-shadow: none; + color: transparent; height: 32px; width: 32px; -shell-close-overlap: 16px; @@ -1659,11 +1696,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close:hover { + background-color: transparent; + border-color: transparent; + color: transparent; -st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); background-image: url("assets/window-close.svg"); } .window-close:active { + background-color: transparent; + border-color: transparent; + color: transparent; background-image: url("assets/window-close-active.svg"); } @@ -1851,6 +1894,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.12); } +.search-section:last-child .search-section-separator { + background-color: transparent; +} + .list-search-result-content { spacing: 30px; } @@ -2090,6 +2137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator .page-indicator-icon { width: 12px; height: 12px; + border: none; border-radius: 12px; background-image: none; background-color: rgba(255, 255, 255, 0.3); @@ -2097,16 +2145,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .page-indicator:hover .page-indicator-icon { + border-color: transparent; background-image: none; background-color: rgba(255, 255, 255, 0.5); } .page-indicator:active .page-indicator-icon { + border: none; + margin: 0; background-image: none; background-color: rgba(255, 255, 255, 0.7); } -.page-indicator:checked .page-indicator-icon { +.page-indicator:checked .page-indicator-icon, +.page-indicator:checked:active .page-indicator-icon { background-image: none; background-color: white; transition-duration: 0ms; @@ -2114,6 +2166,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator:checked:active { background-image: none; + background-color: transparent; } .app-well-app > .overview-icon.overview-icon-with-label, @@ -2382,14 +2435,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(0, 0, 0, 0.3); } +#keyboard .page-indicator { + padding: 4px 4px; +} + +#keyboard .page-indicator .page-indicator-icon { + width: 8px; + height: 8px; +} + .key-container { padding: 4px; spacing: 4px; } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; @@ -2490,6 +2552,42 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } +.emoji-page .keyboard-key { + border: none; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 100ms; +} + +.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus { + color: white; + background-color: rgba(255, 255, 255, 0.08); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; +} + +.emoji-page .keyboard-key:active { + color: white; + background-color: rgba(255, 255, 255, 0.2); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 200ms; +} + +.emoji-panel .keyboard-key:latched { + border-color: transparent; + background-color: #4285F4; + color: white; +} + .candidate-popup-content { padding: 8px; spacing: 0; @@ -2557,14 +2655,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Auth Dialogs & Screen Shield */ -.framed-user-icon { +.user-icon { background-size: contain; border: none; color: white; - border-radius: 4px; + border-radius: 9999px; } -.framed-user-icon:hover { +.user-icon:hover { border-color: white; color: white; } diff --git a/src/gnome-shell/3.32/gnome-shell-dark.css b/src/gnome-shell/3.32/gnome-shell-dark.css index 8527e040a..84f4a85ef 100644 --- a/src/gnome-shell/3.32/gnome-shell-dark.css +++ b/src/gnome-shell/3.32/gnome-shell-dark.css @@ -461,7 +461,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-logout-icon { - border-radius: 5px; + border-radius: 9999px; width: 48px; height: 48px; background-size: contain; @@ -645,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-icon { - border-radius: 5px; + border-radius: 9999px; background-size: contain; width: 48px; height: 48px; @@ -730,6 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-sub-menu { + padding-bottom: 0; background-color: rgba(255, 255, 255, 0.04); box-shadow: 0 0 transparent; } @@ -1002,7 +1003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0.6); + background-color: #212121; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; @@ -1020,13 +1021,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0.6); - -panel-corner-border-width: 2px; + -panel-corner-background-color: transparent; + -panel-corner-border-width: 0; -panel-corner-border-color: transparent; } #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus { - -panel-corner-border-color: white; + -panel-corner-border-color: transparent; } #panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen { @@ -1068,7 +1069,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - background-color: rgba(0, 0, 0, 0.01); + background-color: rgba(33, 33, 33, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1245,14 +1246,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.world-clocks-grid { +.weather-header.location { + font-weight: normal; + font-size: 1em; +} + +.world-clocks-grid, +.weather-grid { spacing-rows: 0.4em; + spacing-columns: 0.8em; } .weather-box { spacing: 0.4em; } +.world-clocks-city { + font-weight: bold; + font-size: 1em; +} + +.world-clocks-time { + color: rgba(255, 255, 255, 0.7); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.world-clocks-timezone { + color: rgba(255, 255, 255, 0.5); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.weather-forecast-icon { + icon-size: 2.28571em; +} + +.weather-forecast-time { + color: rgba(255, 255, 255, 0.7); + font-size: 9pt; + font-weight: 400; +} + .calendar-month-label { transition-duration: 100ms; height: 20px; @@ -1275,32 +1310,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 2px; border-radius: 100px; background-color: transparent; - color: white; + color: rgba(255, 255, 255, 0.7); } .pager-button:hover, .pager-button:focus { background-color: rgba(255, 255, 255, 0.08); + color: white; } .pager-button:active { background-color: rgba(255, 255, 255, 0.2); + color: white; transition-duration: 200ms; } -.calendar-change-month-back { - background-image: url("assets/calendar-arrow-left.svg"); -} - -.calendar-change-month-back:rtl { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward:rtl { - background-image: url("assets/calendar-arrow-left.svg"); +.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { + icon-size: 1.14286em; } .calendar-day-base { @@ -1455,6 +1480,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 4px 4px 4px 0px; } +.message-icon-bin > .fallback-window-icon { + width: 1.14286em; + height: 1.14286em; +} + .message-secondary-bin { padding: 0 8px; } @@ -1560,12 +1590,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(255, 255, 255, 0.5); } -.system-switch-user-submenu-icon.user-icon { - icon-size: 20px; - padding: 0 2px; -} - -.system-switch-user-submenu-icon.default-icon { +.system-switch-user-submenu-icon { icon-size: 16px; padding: 0 4px; } @@ -1579,6 +1604,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: transparent; } +.app-menu, +.app-well-menu { + max-width: 27.25em; +} + .aggregate-menu { min-width: 280px; } @@ -1633,6 +1663,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.3); background-image: none; background-size: auto; + box-shadow: none; } .ripple-box:rtl { @@ -1643,6 +1674,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-arrow { width: 16px; height: 16px; + icon-size: 1.14286em; } .popup-menu-icon { @@ -1650,6 +1682,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close { + background-color: transparent; + border-radius: 0; + border: none; + box-shadow: none; + color: transparent; height: 36px; width: 36px; -shell-close-overlap: 18px; @@ -1659,11 +1696,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close:hover { + background-color: transparent; + border-color: transparent; + color: transparent; -st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); background-image: url("assets/window-close.svg"); } .window-close:active { + background-color: transparent; + border-color: transparent; + color: transparent; background-image: url("assets/window-close-active.svg"); } @@ -1851,6 +1894,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.12); } +.search-section:last-child .search-section-separator { + background-color: transparent; +} + .list-search-result-content { spacing: 30px; } @@ -2090,6 +2137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator .page-indicator-icon { width: 12px; height: 12px; + border: none; border-radius: 12px; background-image: none; background-color: rgba(255, 255, 255, 0.3); @@ -2097,16 +2145,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .page-indicator:hover .page-indicator-icon { + border-color: transparent; background-image: none; background-color: rgba(255, 255, 255, 0.5); } .page-indicator:active .page-indicator-icon { + border: none; + margin: 0; background-image: none; background-color: rgba(255, 255, 255, 0.7); } -.page-indicator:checked .page-indicator-icon { +.page-indicator:checked .page-indicator-icon, +.page-indicator:checked:active .page-indicator-icon { background-image: none; background-color: white; transition-duration: 0ms; @@ -2114,6 +2166,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator:checked:active { background-image: none; + background-color: transparent; } .app-well-app > .overview-icon.overview-icon-with-label, @@ -2382,14 +2435,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(0, 0, 0, 0.3); } +#keyboard .page-indicator { + padding: 4px 4px; +} + +#keyboard .page-indicator .page-indicator-icon { + width: 8px; + height: 8px; +} + .key-container { padding: 4px; spacing: 4px; } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; @@ -2490,6 +2552,42 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } +.emoji-page .keyboard-key { + border: none; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 100ms; +} + +.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus { + color: white; + background-color: rgba(255, 255, 255, 0.08); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; +} + +.emoji-page .keyboard-key:active { + color: white; + background-color: rgba(255, 255, 255, 0.2); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 200ms; +} + +.emoji-panel .keyboard-key:latched { + border-color: transparent; + background-color: #4285F4; + color: white; +} + .candidate-popup-content { padding: 8px; spacing: 0; @@ -2557,14 +2655,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Auth Dialogs & Screen Shield */ -.framed-user-icon { +.user-icon { background-size: contain; border: none; color: white; - border-radius: 4px; + border-radius: 9999px; } -.framed-user-icon:hover { +.user-icon:hover { border-color: white; color: white; } diff --git a/src/gnome-shell/3.32/gnome-shell-light-compact.css b/src/gnome-shell/3.32/gnome-shell-light-compact.css index 9e18ca930..71182f828 100644 --- a/src/gnome-shell/3.32/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.32/gnome-shell-light-compact.css @@ -461,7 +461,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-logout-icon { - border-radius: 5px; + border-radius: 9999px; width: 48px; height: 48px; background-size: contain; @@ -645,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-icon { - border-radius: 5px; + border-radius: 9999px; background-size: contain; width: 48px; height: 48px; @@ -730,6 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-sub-menu { + padding-bottom: 0; background-color: rgba(0, 0, 0, 0.04); box-shadow: 0 0 transparent; } @@ -1020,13 +1021,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0.6); - -panel-corner-border-width: 2px; + -panel-corner-background-color: transparent; + -panel-corner-border-width: 0; -panel-corner-border-color: transparent; } #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus { - -panel-corner-border-color: white; + -panel-corner-border-color: transparent; } #panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen { @@ -1245,14 +1246,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.world-clocks-grid { +.weather-header.location { + font-weight: normal; + font-size: 1em; +} + +.world-clocks-grid, +.weather-grid { spacing-rows: 0.4em; + spacing-columns: 0.8em; } .weather-box { spacing: 0.4em; } +.world-clocks-city { + font-weight: bold; + font-size: 1em; +} + +.world-clocks-time { + color: rgba(0, 0, 0, 0.54); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.world-clocks-timezone { + color: rgba(0, 0, 0, 0.38); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.weather-forecast-icon { + icon-size: 2.28571em; +} + +.weather-forecast-time { + color: rgba(0, 0, 0, 0.54); + font-size: 9pt; + font-weight: 400; +} + .calendar-month-label { transition-duration: 100ms; height: 16px; @@ -1275,32 +1310,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.87); + color: rgba(0, 0, 0, 0.54); } .pager-button:hover, .pager-button:focus { background-color: rgba(0, 0, 0, 0.08); + color: rgba(0, 0, 0, 0.87); } .pager-button:active { background-color: rgba(0, 0, 0, 0.2); + color: rgba(0, 0, 0, 0.87); transition-duration: 200ms; } -.calendar-change-month-back { - background-image: url("assets/calendar-arrow-left.svg"); -} - -.calendar-change-month-back:rtl { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward:rtl { - background-image: url("assets/calendar-arrow-left.svg"); +.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { + icon-size: 1.14286em; } .calendar-day-base { @@ -1455,6 +1480,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 4px 4px 4px 0px; } +.message-icon-bin > .fallback-window-icon { + width: 1.14286em; + height: 1.14286em; +} + .message-secondary-bin { padding: 0 8px; } @@ -1560,12 +1590,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.38); } -.system-switch-user-submenu-icon.user-icon { - icon-size: 20px; - padding: 0 2px; -} - -.system-switch-user-submenu-icon.default-icon { +.system-switch-user-submenu-icon { icon-size: 16px; padding: 0 4px; } @@ -1579,6 +1604,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: transparent; } +.app-menu, +.app-well-menu { + max-width: 27.25em; +} + .aggregate-menu { min-width: 280px; } @@ -1633,6 +1663,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.3); background-image: none; background-size: auto; + box-shadow: none; } .ripple-box:rtl { @@ -1643,6 +1674,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-arrow { width: 16px; height: 16px; + icon-size: 1.14286em; } .popup-menu-icon { @@ -1650,6 +1682,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close { + background-color: transparent; + border-radius: 0; + border: none; + box-shadow: none; + color: transparent; height: 32px; width: 32px; -shell-close-overlap: 16px; @@ -1659,11 +1696,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close:hover { + background-color: transparent; + border-color: transparent; + color: transparent; -st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); background-image: url("assets/window-close.svg"); } .window-close:active { + background-color: transparent; + border-color: transparent; + color: transparent; background-image: url("assets/window-close-active.svg"); } @@ -1851,6 +1894,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.12); } +.search-section:last-child .search-section-separator { + background-color: transparent; +} + .list-search-result-content { spacing: 30px; } @@ -2090,6 +2137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator .page-indicator-icon { width: 12px; height: 12px; + border: none; border-radius: 12px; background-image: none; background-color: rgba(255, 255, 255, 0.3); @@ -2097,16 +2145,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .page-indicator:hover .page-indicator-icon { + border-color: transparent; background-image: none; background-color: rgba(255, 255, 255, 0.5); } .page-indicator:active .page-indicator-icon { + border: none; + margin: 0; background-image: none; background-color: rgba(255, 255, 255, 0.7); } -.page-indicator:checked .page-indicator-icon { +.page-indicator:checked .page-indicator-icon, +.page-indicator:checked:active .page-indicator-icon { background-image: none; background-color: white; transition-duration: 0ms; @@ -2114,6 +2166,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator:checked:active { background-image: none; + background-color: transparent; } .app-well-app > .overview-icon.overview-icon-with-label, @@ -2382,14 +2435,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(0, 0, 0, 0.3); } +#keyboard .page-indicator { + padding: 4px 4px; +} + +#keyboard .page-indicator .page-indicator-icon { + width: 8px; + height: 8px; +} + .key-container { padding: 4px; spacing: 4px; } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; @@ -2490,6 +2552,42 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } +.emoji-page .keyboard-key { + border: none; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 100ms; +} + +.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus { + color: white; + background-color: rgba(255, 255, 255, 0.08); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; +} + +.emoji-page .keyboard-key:active { + color: white; + background-color: rgba(255, 255, 255, 0.2); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 200ms; +} + +.emoji-panel .keyboard-key:latched { + border-color: transparent; + background-color: #4285F4; + color: white; +} + .candidate-popup-content { padding: 8px; spacing: 0; @@ -2557,14 +2655,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Auth Dialogs & Screen Shield */ -.framed-user-icon { +.user-icon { background-size: contain; border: none; color: white; - border-radius: 4px; + border-radius: 9999px; } -.framed-user-icon:hover { +.user-icon:hover { border-color: white; color: white; } diff --git a/src/gnome-shell/3.32/gnome-shell-light.css b/src/gnome-shell/3.32/gnome-shell-light.css index cef4353fb..e6dd9a120 100644 --- a/src/gnome-shell/3.32/gnome-shell-light.css +++ b/src/gnome-shell/3.32/gnome-shell-light.css @@ -461,7 +461,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-logout-icon { - border-radius: 5px; + border-radius: 9999px; width: 48px; height: 48px; background-size: contain; @@ -645,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-icon { - border-radius: 5px; + border-radius: 9999px; background-size: contain; width: 48px; height: 48px; @@ -730,6 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-sub-menu { + padding-bottom: 0; background-color: rgba(0, 0, 0, 0.04); box-shadow: 0 0 transparent; } @@ -1020,13 +1021,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0.6); - -panel-corner-border-width: 2px; + -panel-corner-background-color: transparent; + -panel-corner-border-width: 0; -panel-corner-border-color: transparent; } #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus { - -panel-corner-border-color: white; + -panel-corner-border-color: transparent; } #panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen { @@ -1245,14 +1246,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.world-clocks-grid { +.weather-header.location { + font-weight: normal; + font-size: 1em; +} + +.world-clocks-grid, +.weather-grid { spacing-rows: 0.4em; + spacing-columns: 0.8em; } .weather-box { spacing: 0.4em; } +.world-clocks-city { + font-weight: bold; + font-size: 1em; +} + +.world-clocks-time { + color: rgba(0, 0, 0, 0.54); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.world-clocks-timezone { + color: rgba(0, 0, 0, 0.38); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.weather-forecast-icon { + icon-size: 2.28571em; +} + +.weather-forecast-time { + color: rgba(0, 0, 0, 0.54); + font-size: 9pt; + font-weight: 400; +} + .calendar-month-label { transition-duration: 100ms; height: 20px; @@ -1275,32 +1310,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.87); + color: rgba(0, 0, 0, 0.54); } .pager-button:hover, .pager-button:focus { background-color: rgba(0, 0, 0, 0.08); + color: rgba(0, 0, 0, 0.87); } .pager-button:active { background-color: rgba(0, 0, 0, 0.2); + color: rgba(0, 0, 0, 0.87); transition-duration: 200ms; } -.calendar-change-month-back { - background-image: url("assets/calendar-arrow-left.svg"); -} - -.calendar-change-month-back:rtl { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward:rtl { - background-image: url("assets/calendar-arrow-left.svg"); +.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { + icon-size: 1.14286em; } .calendar-day-base { @@ -1455,6 +1480,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 4px 4px 4px 0px; } +.message-icon-bin > .fallback-window-icon { + width: 1.14286em; + height: 1.14286em; +} + .message-secondary-bin { padding: 0 8px; } @@ -1560,12 +1590,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.38); } -.system-switch-user-submenu-icon.user-icon { - icon-size: 20px; - padding: 0 2px; -} - -.system-switch-user-submenu-icon.default-icon { +.system-switch-user-submenu-icon { icon-size: 16px; padding: 0 4px; } @@ -1579,6 +1604,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: transparent; } +.app-menu, +.app-well-menu { + max-width: 27.25em; +} + .aggregate-menu { min-width: 280px; } @@ -1633,6 +1663,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.3); background-image: none; background-size: auto; + box-shadow: none; } .ripple-box:rtl { @@ -1643,6 +1674,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-arrow { width: 16px; height: 16px; + icon-size: 1.14286em; } .popup-menu-icon { @@ -1650,6 +1682,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close { + background-color: transparent; + border-radius: 0; + border: none; + box-shadow: none; + color: transparent; height: 36px; width: 36px; -shell-close-overlap: 18px; @@ -1659,11 +1696,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close:hover { + background-color: transparent; + border-color: transparent; + color: transparent; -st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); background-image: url("assets/window-close.svg"); } .window-close:active { + background-color: transparent; + border-color: transparent; + color: transparent; background-image: url("assets/window-close-active.svg"); } @@ -1851,6 +1894,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.12); } +.search-section:last-child .search-section-separator { + background-color: transparent; +} + .list-search-result-content { spacing: 30px; } @@ -2090,6 +2137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator .page-indicator-icon { width: 12px; height: 12px; + border: none; border-radius: 12px; background-image: none; background-color: rgba(255, 255, 255, 0.3); @@ -2097,16 +2145,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .page-indicator:hover .page-indicator-icon { + border-color: transparent; background-image: none; background-color: rgba(255, 255, 255, 0.5); } .page-indicator:active .page-indicator-icon { + border: none; + margin: 0; background-image: none; background-color: rgba(255, 255, 255, 0.7); } -.page-indicator:checked .page-indicator-icon { +.page-indicator:checked .page-indicator-icon, +.page-indicator:checked:active .page-indicator-icon { background-image: none; background-color: white; transition-duration: 0ms; @@ -2114,6 +2166,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator:checked:active { background-image: none; + background-color: transparent; } .app-well-app > .overview-icon.overview-icon-with-label, @@ -2382,14 +2435,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(0, 0, 0, 0.3); } +#keyboard .page-indicator { + padding: 4px 4px; +} + +#keyboard .page-indicator .page-indicator-icon { + width: 8px; + height: 8px; +} + .key-container { padding: 4px; spacing: 4px; } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; @@ -2490,6 +2552,42 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } +.emoji-page .keyboard-key { + border: none; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 100ms; +} + +.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus { + color: white; + background-color: rgba(255, 255, 255, 0.08); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; +} + +.emoji-page .keyboard-key:active { + color: white; + background-color: rgba(255, 255, 255, 0.2); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 200ms; +} + +.emoji-panel .keyboard-key:latched { + border-color: transparent; + background-color: #4285F4; + color: white; +} + .candidate-popup-content { padding: 8px; spacing: 0; @@ -2557,14 +2655,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Auth Dialogs & Screen Shield */ -.framed-user-icon { +.user-icon { background-size: contain; border: none; color: white; - border-radius: 4px; + border-radius: 9999px; } -.framed-user-icon:hover { +.user-icon:hover { border-color: white; color: white; } diff --git a/src/gnome-shell/3.32/gnome-shell.css b/src/gnome-shell/3.32/gnome-shell.css index 6c44e582a..3e77ea4d7 100644 --- a/src/gnome-shell/3.32/gnome-shell.css +++ b/src/gnome-shell/3.32/gnome-shell.css @@ -461,7 +461,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-logout-icon { - border-radius: 5px; + border-radius: 9999px; width: 48px; height: 48px; background-size: contain; @@ -645,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-icon { - border-radius: 5px; + border-radius: 9999px; background-size: contain; width: 48px; height: 48px; @@ -730,6 +730,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-sub-menu { + padding-bottom: 0; background-color: rgba(0, 0, 0, 0.04); box-shadow: 0 0 transparent; } @@ -1002,7 +1003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0.6); + background-color: #212121; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; @@ -1020,13 +1021,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0.6); - -panel-corner-border-width: 2px; + -panel-corner-background-color: transparent; + -panel-corner-border-width: 0; -panel-corner-border-color: transparent; } #panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus { - -panel-corner-border-color: white; + -panel-corner-border-color: transparent; } #panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen { @@ -1068,7 +1069,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked { - background-color: rgba(0, 0, 0, 0.01); + background-color: rgba(33, 33, 33, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1245,14 +1246,48 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-weight: bold; } -.world-clocks-grid { +.weather-header.location { + font-weight: normal; + font-size: 1em; +} + +.world-clocks-grid, +.weather-grid { spacing-rows: 0.4em; + spacing-columns: 0.8em; } .weather-box { spacing: 0.4em; } +.world-clocks-city { + font-weight: bold; + font-size: 1em; +} + +.world-clocks-time { + color: rgba(0, 0, 0, 0.54); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.world-clocks-timezone { + color: rgba(0, 0, 0, 0.38); + font-feature-settings: "tnum"; + font-size: 1em; +} + +.weather-forecast-icon { + icon-size: 2.28571em; +} + +.weather-forecast-time { + color: rgba(0, 0, 0, 0.54); + font-size: 9pt; + font-weight: 400; +} + .calendar-month-label { transition-duration: 100ms; height: 20px; @@ -1275,32 +1310,22 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.87); + color: rgba(0, 0, 0, 0.54); } .pager-button:hover, .pager-button:focus { background-color: rgba(0, 0, 0, 0.08); + color: rgba(0, 0, 0, 0.87); } .pager-button:active { background-color: rgba(0, 0, 0, 0.2); + color: rgba(0, 0, 0, 0.87); transition-duration: 200ms; } -.calendar-change-month-back { - background-image: url("assets/calendar-arrow-left.svg"); -} - -.calendar-change-month-back:rtl { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward { - background-image: url("assets/calendar-arrow-right.svg"); -} - -.calendar-change-month-forward:rtl { - background-image: url("assets/calendar-arrow-left.svg"); +.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { + icon-size: 1.14286em; } .calendar-day-base { @@ -1455,6 +1480,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 4px 4px 4px 0px; } +.message-icon-bin > .fallback-window-icon { + width: 1.14286em; + height: 1.14286em; +} + .message-secondary-bin { padding: 0 8px; } @@ -1560,12 +1590,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: rgba(0, 0, 0, 0.38); } -.system-switch-user-submenu-icon.user-icon { - icon-size: 20px; - padding: 0 2px; -} - -.system-switch-user-submenu-icon.default-icon { +.system-switch-user-submenu-icon { icon-size: 16px; padding: 0 4px; } @@ -1579,6 +1604,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { color: transparent; } +.app-menu, +.app-well-menu { + max-width: 27.25em; +} + .aggregate-menu { min-width: 280px; } @@ -1633,6 +1663,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.3); background-image: none; background-size: auto; + box-shadow: none; } .ripple-box:rtl { @@ -1643,6 +1674,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-arrow { width: 16px; height: 16px; + icon-size: 1.14286em; } .popup-menu-icon { @@ -1650,6 +1682,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close { + background-color: transparent; + border-radius: 0; + border: none; + box-shadow: none; + color: transparent; height: 36px; width: 36px; -shell-close-overlap: 18px; @@ -1659,11 +1696,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .window-close:hover { + background-color: transparent; + border-color: transparent; + color: transparent; -st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); background-image: url("assets/window-close.svg"); } .window-close:active { + background-color: transparent; + border-color: transparent; + color: transparent; background-image: url("assets/window-close-active.svg"); } @@ -1851,6 +1894,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(255, 255, 255, 0.12); } +.search-section:last-child .search-section-separator { + background-color: transparent; +} + .list-search-result-content { spacing: 30px; } @@ -2090,6 +2137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator .page-indicator-icon { width: 12px; height: 12px; + border: none; border-radius: 12px; background-image: none; background-color: rgba(255, 255, 255, 0.3); @@ -2097,16 +2145,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .page-indicator:hover .page-indicator-icon { + border-color: transparent; background-image: none; background-color: rgba(255, 255, 255, 0.5); } .page-indicator:active .page-indicator-icon { + border: none; + margin: 0; background-image: none; background-color: rgba(255, 255, 255, 0.7); } -.page-indicator:checked .page-indicator-icon { +.page-indicator:checked .page-indicator-icon, +.page-indicator:checked:active .page-indicator-icon { background-image: none; background-color: white; transition-duration: 0ms; @@ -2114,6 +2166,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .page-indicator:checked:active { background-image: none; + background-color: transparent; } .app-well-app > .overview-icon.overview-icon-with-label, @@ -2382,14 +2435,23 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-color: rgba(0, 0, 0, 0.3); } +#keyboard .page-indicator { + padding: 4px 4px; +} + +#keyboard .page-indicator .page-indicator-icon { + width: 8px; + height: 8px; +} + .key-container { padding: 4px; spacing: 4px; } .keyboard-key { - min-height: 2em; - min-width: 2em; + min-height: 1.2em; + min-width: 1.2em; font-size: 2em; font-weight: 500; border-radius: 4px; @@ -2490,6 +2552,42 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } +.emoji-page .keyboard-key { + border: none; + color: rgba(255, 255, 255, 0.7); + background-color: transparent; + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 100ms; +} + +.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus { + color: white; + background-color: rgba(255, 255, 255, 0.08); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; +} + +.emoji-page .keyboard-key:active { + color: white; + background-color: rgba(255, 255, 255, 0.2); + border-color: transparent; + box-shadow: 0 0 transparent; + text-shadow: none; + icon-shadow: none; + transition-duration: 200ms; +} + +.emoji-panel .keyboard-key:latched { + border-color: transparent; + background-color: #4285F4; + color: white; +} + .candidate-popup-content { padding: 8px; spacing: 0; @@ -2557,14 +2655,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } /* Auth Dialogs & Screen Shield */ -.framed-user-icon { +.user-icon { background-size: contain; border: none; color: white; - border-radius: 4px; + border-radius: 9999px; } -.framed-user-icon:hover { +.user-icon:hover { border-color: white; color: white; } diff --git a/src/gtk/3.0/gtk-compact.css b/src/gtk/3.0/gtk-compact.css index 03a5189d1..c3aae487a 100644 --- a/src/gtk/3.0/gtk-compact.css +++ b/src/gtk/3.0/gtk-compact.css @@ -1,16 +1,16 @@ -@keyframes ripple_effect { +@keyframes ripple { to { background-size: 1000% 1000%; } } -@keyframes scale_ripple_effect { +@keyframes ripple-slider { to { background-size: auto, 1000% 1000%; } } -@keyframes header_ripple_effect { +@keyframes ripple-headerbar { from { background-image: radial-gradient(circle farthest-corner at center, #4285F4 0%, transparent 0%); } @@ -132,7 +132,6 @@ flowbox flowboxchild { .content-view .tile:selected { background-color: transparent; - color: inherit; } label { @@ -327,7 +326,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { - margin: 2px -6px; + margin: 2px -8px; border-bottom: 2px solid #4285F4; background-color: transparent; } @@ -496,7 +495,7 @@ button:hover { button:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -555,7 +554,7 @@ radio:active, calendar.button:active, messagedialog.csd .dialog-action-area butt headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -573,14 +572,14 @@ button.flat:disabled { color: rgba(0, 0, 0, 0.26); } -:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.24); color: rgba(0, 0, 0, 0.87); } -:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: rgba(0, 0, 0, 0.12); @@ -1260,18 +1259,18 @@ headerbar button:not(.suggested-action):not(.destructive-action):disabled { color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px; color: white; } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { color: rgba(255, 255, 255, 0.5); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; @@ -1293,12 +1292,12 @@ headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabl color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, +.path-bar-box .nautilus-path-bar button:backdrop:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, +.path-bar-box .nautilus-path-bar button:backdrop:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1313,7 +1312,7 @@ headerbar button.destructive-action:disabled { .selection-mode.titlebar:not(headerbar), headerbar.selection-mode { transition: background-color 0.00001s 225ms, color 225ms cubic-bezier(0, 0, 0.2, 1); - animation: header_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1); + animation: ripple-headerbar 225ms cubic-bezier(0, 0, 0.2, 1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #4285F4; color: white; @@ -2392,6 +2391,7 @@ switch slider { min-height: 20px; margin: -3px -2px; border-radius: 9999px; + outline: none; box-shadow: 0 0 0 10px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #FFFFFF; } @@ -2773,7 +2773,7 @@ scale slider:focus:hover { scale slider:active { transition: background-color 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: scale_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple-slider 225ms cubic-bezier(0, 0, 0.2, 1) forwards; background-size: auto, 0% 0%; background-color: rgba(66, 133, 244, 0.08); color: rgba(66, 133, 244, 0.12); @@ -3145,7 +3145,7 @@ row.activatable:hover, treeview.view header button:hover, .budgie-popover.budgie row.activatable.has-open-popup, treeview.view header button.has-open-popup, .budgie-popover.budgie-menu button.has-open-popup.flat:not(.image-button), row.activatable:active, treeview.view header button:active, .budgie-popover.budgie-menu button.flat:active:not(.image-button) { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -3165,6 +3165,11 @@ row:selected button label { color: inherit; } +row:selected:disabled image, +row:selected:disabled label { + color: rgba(0, 0, 0, 0.38); +} + /********************* * App Notifications * *********************/ @@ -3329,6 +3334,10 @@ stacksidebar row > label { padding-right: 6px; } +separator.sidebar { + background-color: rgba(0, 0, 0, 0.12); +} + /**************** * File chooser * ****************/ @@ -3914,6 +3923,23 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- margin-right: 0; } +.path-bar-box .nautilus-path-bar button { + padding-left: 4px; + padding-right: 4px; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { + margin-left: 0; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { + margin-right: 0; +} + +.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { + margin: 0; +} + .nautilus-window .floating-bar { min-height: 32px; padding: 0; @@ -3923,7 +3949,6 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- border-radius: 5px 5px 0 0; background-color: rgba(255, 255, 255, 0.9); background-clip: padding-box; - transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-width 0; } .nautilus-window .floating-bar.bottom.left { @@ -3959,8 +3984,9 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- .search-information { padding: 2px; - background-color: #4285F4; - color: white; + border-bottom: 1px solid rgba(0, 0, 0, 0.12); + background-color: #FFFFFF; + color: rgba(0, 0, 0, 0.87); } .conflict-row:not(:selected) { @@ -4034,6 +4060,11 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: font-size: smaller; } +.open-document-selector-match { + background-color: #FBBC05; + color: rgba(0, 0, 0, 0.87); +} + .gedit-document-panel { background-color: #FAFAFA; } @@ -4565,6 +4596,21 @@ GdMainIconView.content-view { transition: opacity 100ms cubic-bezier(0, 0, 0.2, 1); } +button.photos-filter-preview { + color: rgba(0, 0, 0, 0.87); + font-weight: normal; +} + +button.photos-filter-preview:checked { + background-color: rgba(66, 133, 244, 0.32); + color: rgba(0, 0, 0, 0.87); +} + +button.photos-filter-preview:checked image { + color: white; + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} + overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { border-style: none none none solid; } @@ -6043,7 +6089,6 @@ XfdesktopIconView.view { XfdesktopIconView.view:active { box-shadow: none; - text-shadow: none; } XfdesktopIconView.view .rubberband { diff --git a/src/gtk/3.0/gtk-dark-compact.css b/src/gtk/3.0/gtk-dark-compact.css index 0262058da..2cf315e3e 100644 --- a/src/gtk/3.0/gtk-dark-compact.css +++ b/src/gtk/3.0/gtk-dark-compact.css @@ -1,16 +1,16 @@ -@keyframes ripple_effect { +@keyframes ripple { to { background-size: 1000% 1000%; } } -@keyframes scale_ripple_effect { +@keyframes ripple-slider { to { background-size: auto, 1000% 1000%; } } -@keyframes header_ripple_effect { +@keyframes ripple-headerbar { from { background-image: radial-gradient(circle farthest-corner at center, #4285F4 0%, transparent 0%); } @@ -132,7 +132,6 @@ flowbox flowboxchild { .content-view .tile:selected { background-color: transparent; - color: inherit; } label { @@ -327,7 +326,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { - margin: 2px -6px; + margin: 2px -8px; border-bottom: 2px solid #4285F4; background-color: transparent; } @@ -496,7 +495,7 @@ button:hover { button:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -555,7 +554,7 @@ radio:active, calendar.button:active, messagedialog.csd .dialog-action-area butt headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -573,14 +572,14 @@ button.flat:disabled { color: rgba(255, 255, 255, 0.3); } -:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.24); color: white; } -:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: rgba(255, 255, 255, 0.12); @@ -1260,18 +1259,18 @@ headerbar button:not(.suggested-action):not(.destructive-action):disabled { color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px; color: white; } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { color: rgba(255, 255, 255, 0.5); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; @@ -1293,12 +1292,12 @@ headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabl color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, +.path-bar-box .nautilus-path-bar button:backdrop:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, +.path-bar-box .nautilus-path-bar button:backdrop:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1313,7 +1312,7 @@ headerbar button.destructive-action:disabled { .selection-mode.titlebar:not(headerbar), headerbar.selection-mode { transition: background-color 0.00001s 225ms, color 225ms cubic-bezier(0, 0, 0.2, 1); - animation: header_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1); + animation: ripple-headerbar 225ms cubic-bezier(0, 0, 0.2, 1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #4285F4; color: white; @@ -2392,6 +2391,7 @@ switch slider { min-height: 20px; margin: -3px -2px; border-radius: 9999px; + outline: none; box-shadow: 0 0 0 10px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #424242; } @@ -2773,7 +2773,7 @@ scale slider:focus:hover { scale slider:active { transition: background-color 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: scale_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple-slider 225ms cubic-bezier(0, 0, 0.2, 1) forwards; background-size: auto, 0% 0%; background-color: rgba(66, 133, 244, 0.08); color: rgba(66, 133, 244, 0.12); @@ -3145,7 +3145,7 @@ row.activatable:hover, treeview.view header button:hover, .budgie-popover.budgie row.activatable.has-open-popup, treeview.view header button.has-open-popup, .budgie-popover.budgie-menu button.has-open-popup.flat:not(.image-button), row.activatable:active, treeview.view header button:active, .budgie-popover.budgie-menu button.flat:active:not(.image-button) { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -3165,6 +3165,11 @@ row:selected button label { color: inherit; } +row:selected:disabled image, +row:selected:disabled label { + color: rgba(255, 255, 255, 0.5); +} + /********************* * App Notifications * *********************/ @@ -3329,6 +3334,10 @@ stacksidebar row > label { padding-right: 6px; } +separator.sidebar { + background-color: rgba(0, 0, 0, 0.26); +} + /**************** * File chooser * ****************/ @@ -3914,6 +3923,23 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- margin-right: 0; } +.path-bar-box .nautilus-path-bar button { + padding-left: 4px; + padding-right: 4px; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { + margin-left: 0; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { + margin-right: 0; +} + +.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { + margin: 0; +} + .nautilus-window .floating-bar { min-height: 32px; padding: 0; @@ -3923,7 +3949,6 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- border-radius: 5px 5px 0 0; background-color: rgba(48, 48, 48, 0.9); background-clip: border-box; - transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-width 0; } .nautilus-window .floating-bar.bottom.left { @@ -3959,7 +3984,8 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- .search-information { padding: 2px; - background-color: #4285F4; + border-bottom: 1px solid rgba(0, 0, 0, 0.26); + background-color: #303030; color: white; } @@ -4034,6 +4060,11 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: font-size: smaller; } +.open-document-selector-match { + background-color: #FBBC05; + color: rgba(0, 0, 0, 0.87); +} + .gedit-document-panel { background-color: #2C2C2C; } @@ -4565,6 +4596,21 @@ GdMainIconView.content-view { transition: opacity 100ms cubic-bezier(0, 0, 0.2, 1); } +button.photos-filter-preview { + color: white; + font-weight: normal; +} + +button.photos-filter-preview:checked { + background-color: rgba(66, 133, 244, 0.32); + color: white; +} + +button.photos-filter-preview:checked image { + color: white; + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} + overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { border-style: none none none solid; } @@ -6043,7 +6089,6 @@ XfdesktopIconView.view { XfdesktopIconView.view:active { box-shadow: none; - text-shadow: none; } XfdesktopIconView.view .rubberband { diff --git a/src/gtk/3.0/gtk-dark.css b/src/gtk/3.0/gtk-dark.css index bbeae873e..e734c8618 100644 --- a/src/gtk/3.0/gtk-dark.css +++ b/src/gtk/3.0/gtk-dark.css @@ -1,16 +1,16 @@ -@keyframes ripple_effect { +@keyframes ripple { to { background-size: 1000% 1000%; } } -@keyframes scale_ripple_effect { +@keyframes ripple-slider { to { background-size: auto, 1000% 1000%; } } -@keyframes header_ripple_effect { +@keyframes ripple-headerbar { from { background-image: radial-gradient(circle farthest-corner at center, #4285F4 0%, transparent 0%); } @@ -132,7 +132,6 @@ flowbox flowboxchild { .content-view .tile:selected { background-color: transparent; - color: inherit; } label { @@ -327,7 +326,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { - margin: 2px -6px; + margin: 2px -8px; border-bottom: 2px solid #4285F4; background-color: transparent; } @@ -496,7 +495,7 @@ button:hover { button:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -555,7 +554,7 @@ radio:active, calendar.button:active, messagedialog.csd .dialog-action-area butt headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -573,14 +572,14 @@ button.flat:disabled { color: rgba(255, 255, 255, 0.3); } -:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.24); color: white; } -:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: rgba(255, 255, 255, 0.12); @@ -1260,18 +1259,18 @@ headerbar button:not(.suggested-action):not(.destructive-action):disabled { color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px; color: white; } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { color: rgba(255, 255, 255, 0.5); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; @@ -1293,12 +1292,12 @@ headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabl color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, +.path-bar-box .nautilus-path-bar button:backdrop:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, +.path-bar-box .nautilus-path-bar button:backdrop:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1313,7 +1312,7 @@ headerbar button.destructive-action:disabled { .selection-mode.titlebar:not(headerbar), headerbar.selection-mode { transition: background-color 0.00001s 225ms, color 225ms cubic-bezier(0, 0, 0.2, 1); - animation: header_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1); + animation: ripple-headerbar 225ms cubic-bezier(0, 0, 0.2, 1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #4285F4; color: white; @@ -2392,6 +2391,7 @@ switch slider { min-height: 20px; margin: -3px -2px; border-radius: 9999px; + outline: none; box-shadow: 0 0 0 10px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #424242; } @@ -2773,7 +2773,7 @@ scale slider:focus:hover { scale slider:active { transition: background-color 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: scale_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple-slider 225ms cubic-bezier(0, 0, 0.2, 1) forwards; background-size: auto, 0% 0%; background-color: rgba(66, 133, 244, 0.08); color: rgba(66, 133, 244, 0.12); @@ -3145,7 +3145,7 @@ row.activatable:hover, treeview.view header button:hover, .budgie-popover.budgie row.activatable.has-open-popup, treeview.view header button.has-open-popup, .budgie-popover.budgie-menu button.has-open-popup.flat:not(.image-button), row.activatable:active, treeview.view header button:active, .budgie-popover.budgie-menu button.flat:active:not(.image-button) { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -3165,6 +3165,11 @@ row:selected button label { color: inherit; } +row:selected:disabled image, +row:selected:disabled label { + color: rgba(255, 255, 255, 0.5); +} + /********************* * App Notifications * *********************/ @@ -3329,6 +3334,10 @@ stacksidebar row > label { padding-right: 6px; } +separator.sidebar { + background-color: rgba(0, 0, 0, 0.26); +} + /**************** * File chooser * ****************/ @@ -3914,6 +3923,23 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- margin-right: 0; } +.path-bar-box .nautilus-path-bar button { + padding-left: 6px; + padding-right: 6px; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { + margin-left: 0; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { + margin-right: 0; +} + +.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { + margin: 0; +} + .nautilus-window .floating-bar { min-height: 32px; padding: 0; @@ -3923,7 +3949,6 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- border-radius: 5px 5px 0 0; background-color: rgba(48, 48, 48, 0.9); background-clip: border-box; - transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-width 0; } .nautilus-window .floating-bar.bottom.left { @@ -3959,7 +3984,8 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- .search-information { padding: 2px; - background-color: #4285F4; + border-bottom: 1px solid rgba(0, 0, 0, 0.26); + background-color: #303030; color: white; } @@ -4034,6 +4060,11 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: font-size: smaller; } +.open-document-selector-match { + background-color: #FBBC05; + color: rgba(0, 0, 0, 0.87); +} + .gedit-document-panel { background-color: #2C2C2C; } @@ -4565,6 +4596,21 @@ GdMainIconView.content-view { transition: opacity 100ms cubic-bezier(0, 0, 0.2, 1); } +button.photos-filter-preview { + color: white; + font-weight: normal; +} + +button.photos-filter-preview:checked { + background-color: rgba(66, 133, 244, 0.32); + color: white; +} + +button.photos-filter-preview:checked image { + color: white; + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} + overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { border-style: none none none solid; } @@ -6043,7 +6089,6 @@ XfdesktopIconView.view { XfdesktopIconView.view:active { box-shadow: none; - text-shadow: none; } XfdesktopIconView.view .rubberband { diff --git a/src/gtk/3.0/gtk-light-compact.css b/src/gtk/3.0/gtk-light-compact.css index 8020f36fb..d52473647 100644 --- a/src/gtk/3.0/gtk-light-compact.css +++ b/src/gtk/3.0/gtk-light-compact.css @@ -1,16 +1,16 @@ -@keyframes ripple_effect { +@keyframes ripple { to { background-size: 1000% 1000%; } } -@keyframes scale_ripple_effect { +@keyframes ripple-slider { to { background-size: auto, 1000% 1000%; } } -@keyframes header_ripple_effect { +@keyframes ripple-headerbar { from { background-image: radial-gradient(circle farthest-corner at center, #4285F4 0%, transparent 0%); } @@ -132,7 +132,6 @@ flowbox flowboxchild { .content-view .tile:selected { background-color: transparent; - color: inherit; } label { @@ -327,7 +326,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { - margin: 2px -6px; + margin: 2px -8px; border-bottom: 2px solid #4285F4; background-color: transparent; } @@ -496,7 +495,7 @@ button:hover { button:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -555,7 +554,7 @@ radio:active, calendar.button:active, messagedialog.csd .dialog-action-area butt headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -573,14 +572,14 @@ button.flat:disabled { color: rgba(0, 0, 0, 0.26); } -:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.24); color: rgba(0, 0, 0, 0.87); } -:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: rgba(0, 0, 0, 0.12); @@ -1260,18 +1259,18 @@ headerbar button:not(.suggested-action):not(.destructive-action):disabled { color: rgba(0, 0, 0, 0.26); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; color: rgba(0, 0, 0, 0.87); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { color: rgba(0, 0, 0, 0.38); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; @@ -1293,12 +1292,12 @@ headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabl color: rgba(0, 0, 0, 0.26); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, +.path-bar-box .nautilus-path-bar button:backdrop:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(0, 0, 0, 0.54); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, +.path-bar-box .nautilus-path-bar button:backdrop:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(0, 0, 0, 0.26); } @@ -1313,7 +1312,7 @@ headerbar button.destructive-action:disabled { .selection-mode.titlebar:not(headerbar), headerbar.selection-mode { transition: background-color 0.00001s 225ms, color 225ms cubic-bezier(0, 0, 0.2, 1); - animation: header_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1); + animation: ripple-headerbar 225ms cubic-bezier(0, 0, 0.2, 1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #4285F4; color: white; @@ -2392,6 +2391,7 @@ switch slider { min-height: 20px; margin: -3px -2px; border-radius: 9999px; + outline: none; box-shadow: 0 0 0 10px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #FFFFFF; } @@ -2773,7 +2773,7 @@ scale slider:focus:hover { scale slider:active { transition: background-color 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: scale_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple-slider 225ms cubic-bezier(0, 0, 0.2, 1) forwards; background-size: auto, 0% 0%; background-color: rgba(66, 133, 244, 0.08); color: rgba(66, 133, 244, 0.12); @@ -3145,7 +3145,7 @@ row.activatable:hover, treeview.view header button:hover, .budgie-popover.budgie row.activatable.has-open-popup, treeview.view header button.has-open-popup, .budgie-popover.budgie-menu button.has-open-popup.flat:not(.image-button), row.activatable:active, treeview.view header button:active, .budgie-popover.budgie-menu button.flat:active:not(.image-button) { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -3165,6 +3165,11 @@ row:selected button label { color: inherit; } +row:selected:disabled image, +row:selected:disabled label { + color: rgba(0, 0, 0, 0.38); +} + /********************* * App Notifications * *********************/ @@ -3329,6 +3334,10 @@ stacksidebar row > label { padding-right: 6px; } +separator.sidebar { + background-color: rgba(0, 0, 0, 0.12); +} + /**************** * File chooser * ****************/ @@ -3914,6 +3923,23 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- margin-right: 0; } +.path-bar-box .nautilus-path-bar button { + padding-left: 4px; + padding-right: 4px; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { + margin-left: 0; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { + margin-right: 0; +} + +.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { + margin: 0; +} + .nautilus-window .floating-bar { min-height: 32px; padding: 0; @@ -3923,7 +3949,6 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- border-radius: 5px 5px 0 0; background-color: rgba(255, 255, 255, 0.9); background-clip: padding-box; - transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-width 0; } .nautilus-window .floating-bar.bottom.left { @@ -3959,8 +3984,9 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- .search-information { padding: 2px; - background-color: #4285F4; - color: white; + border-bottom: 1px solid rgba(0, 0, 0, 0.12); + background-color: #FFFFFF; + color: rgba(0, 0, 0, 0.87); } .conflict-row:not(:selected) { @@ -4034,6 +4060,11 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: font-size: smaller; } +.open-document-selector-match { + background-color: #FBBC05; + color: rgba(0, 0, 0, 0.87); +} + .gedit-document-panel { background-color: #FAFAFA; } @@ -4565,6 +4596,21 @@ GdMainIconView.content-view { transition: opacity 100ms cubic-bezier(0, 0, 0.2, 1); } +button.photos-filter-preview { + color: rgba(0, 0, 0, 0.87); + font-weight: normal; +} + +button.photos-filter-preview:checked { + background-color: rgba(66, 133, 244, 0.32); + color: rgba(0, 0, 0, 0.87); +} + +button.photos-filter-preview:checked image { + color: white; + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} + overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { border-style: none none none solid; } @@ -6043,7 +6089,6 @@ XfdesktopIconView.view { XfdesktopIconView.view:active { box-shadow: none; - text-shadow: none; } XfdesktopIconView.view .rubberband { diff --git a/src/gtk/3.0/gtk-light.css b/src/gtk/3.0/gtk-light.css index 7c633c64b..810bf953e 100644 --- a/src/gtk/3.0/gtk-light.css +++ b/src/gtk/3.0/gtk-light.css @@ -1,16 +1,16 @@ -@keyframes ripple_effect { +@keyframes ripple { to { background-size: 1000% 1000%; } } -@keyframes scale_ripple_effect { +@keyframes ripple-slider { to { background-size: auto, 1000% 1000%; } } -@keyframes header_ripple_effect { +@keyframes ripple-headerbar { from { background-image: radial-gradient(circle farthest-corner at center, #4285F4 0%, transparent 0%); } @@ -132,7 +132,6 @@ flowbox flowboxchild { .content-view .tile:selected { background-color: transparent; - color: inherit; } label { @@ -327,7 +326,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { - margin: 2px -6px; + margin: 2px -8px; border-bottom: 2px solid #4285F4; background-color: transparent; } @@ -496,7 +495,7 @@ button:hover { button:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -555,7 +554,7 @@ radio:active, calendar.button:active, messagedialog.csd .dialog-action-area butt headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -573,14 +572,14 @@ button.flat:disabled { color: rgba(0, 0, 0, 0.26); } -:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.24); color: rgba(0, 0, 0, 0.87); } -:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: rgba(0, 0, 0, 0.12); @@ -1260,18 +1259,18 @@ headerbar button:not(.suggested-action):not(.destructive-action):disabled { color: rgba(0, 0, 0, 0.26); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; color: rgba(0, 0, 0, 0.87); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { color: rgba(0, 0, 0, 0.38); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; @@ -1293,12 +1292,12 @@ headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabl color: rgba(0, 0, 0, 0.26); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, +.path-bar-box .nautilus-path-bar button:backdrop:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(0, 0, 0, 0.54); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, +.path-bar-box .nautilus-path-bar button:backdrop:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(0, 0, 0, 0.26); } @@ -1313,7 +1312,7 @@ headerbar button.destructive-action:disabled { .selection-mode.titlebar:not(headerbar), headerbar.selection-mode { transition: background-color 0.00001s 225ms, color 225ms cubic-bezier(0, 0, 0.2, 1); - animation: header_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1); + animation: ripple-headerbar 225ms cubic-bezier(0, 0, 0.2, 1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #4285F4; color: white; @@ -2392,6 +2391,7 @@ switch slider { min-height: 20px; margin: -3px -2px; border-radius: 9999px; + outline: none; box-shadow: 0 0 0 10px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #FFFFFF; } @@ -2773,7 +2773,7 @@ scale slider:focus:hover { scale slider:active { transition: background-color 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: scale_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple-slider 225ms cubic-bezier(0, 0, 0.2, 1) forwards; background-size: auto, 0% 0%; background-color: rgba(66, 133, 244, 0.08); color: rgba(66, 133, 244, 0.12); @@ -3145,7 +3145,7 @@ row.activatable:hover, treeview.view header button:hover, .budgie-popover.budgie row.activatable.has-open-popup, treeview.view header button.has-open-popup, .budgie-popover.budgie-menu button.has-open-popup.flat:not(.image-button), row.activatable:active, treeview.view header button:active, .budgie-popover.budgie-menu button.flat:active:not(.image-button) { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -3165,6 +3165,11 @@ row:selected button label { color: inherit; } +row:selected:disabled image, +row:selected:disabled label { + color: rgba(0, 0, 0, 0.38); +} + /********************* * App Notifications * *********************/ @@ -3329,6 +3334,10 @@ stacksidebar row > label { padding-right: 6px; } +separator.sidebar { + background-color: rgba(0, 0, 0, 0.12); +} + /**************** * File chooser * ****************/ @@ -3914,6 +3923,23 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- margin-right: 0; } +.path-bar-box .nautilus-path-bar button { + padding-left: 6px; + padding-right: 6px; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { + margin-left: 0; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { + margin-right: 0; +} + +.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { + margin: 0; +} + .nautilus-window .floating-bar { min-height: 32px; padding: 0; @@ -3923,7 +3949,6 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- border-radius: 5px 5px 0 0; background-color: rgba(255, 255, 255, 0.9); background-clip: padding-box; - transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-width 0; } .nautilus-window .floating-bar.bottom.left { @@ -3959,8 +3984,9 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- .search-information { padding: 2px; - background-color: #4285F4; - color: white; + border-bottom: 1px solid rgba(0, 0, 0, 0.12); + background-color: #FFFFFF; + color: rgba(0, 0, 0, 0.87); } .conflict-row:not(:selected) { @@ -4034,6 +4060,11 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: font-size: smaller; } +.open-document-selector-match { + background-color: #FBBC05; + color: rgba(0, 0, 0, 0.87); +} + .gedit-document-panel { background-color: #FAFAFA; } @@ -4565,6 +4596,21 @@ GdMainIconView.content-view { transition: opacity 100ms cubic-bezier(0, 0, 0.2, 1); } +button.photos-filter-preview { + color: rgba(0, 0, 0, 0.87); + font-weight: normal; +} + +button.photos-filter-preview:checked { + background-color: rgba(66, 133, 244, 0.32); + color: rgba(0, 0, 0, 0.87); +} + +button.photos-filter-preview:checked image { + color: white; + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} + overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { border-style: none none none solid; } @@ -6043,7 +6089,6 @@ XfdesktopIconView.view { XfdesktopIconView.view:active { box-shadow: none; - text-shadow: none; } XfdesktopIconView.view .rubberband { diff --git a/src/gtk/3.0/gtk.css b/src/gtk/3.0/gtk.css index e799ce53d..6b247c694 100644 --- a/src/gtk/3.0/gtk.css +++ b/src/gtk/3.0/gtk.css @@ -1,16 +1,16 @@ -@keyframes ripple_effect { +@keyframes ripple { to { background-size: 1000% 1000%; } } -@keyframes scale_ripple_effect { +@keyframes ripple-slider { to { background-size: auto, 1000% 1000%; } } -@keyframes header_ripple_effect { +@keyframes ripple-headerbar { from { background-image: radial-gradient(circle farthest-corner at center, #4285F4 0%, transparent 0%); } @@ -132,7 +132,6 @@ flowbox flowboxchild { .content-view .tile:selected { background-color: transparent; - color: inherit; } label { @@ -327,7 +326,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { - margin: 2px -6px; + margin: 2px -8px; border-bottom: 2px solid #4285F4; background-color: transparent; } @@ -496,7 +495,7 @@ button:hover { button:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -555,7 +554,7 @@ radio:active, calendar.button:active, messagedialog.csd .dialog-action-area butt headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -573,14 +572,14 @@ button.flat:disabled { color: rgba(0, 0, 0, 0.26); } -:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.24); color: rgba(0, 0, 0, 0.87); } -:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), +:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar) .path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: rgba(0, 0, 0, 0.12); @@ -1260,18 +1259,18 @@ headerbar button:not(.suggested-action):not(.destructive-action):disabled { color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px; color: white; } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { color: rgba(255, 255, 255, 0.5); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, +.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .path-bar-box .nautilus-path-bar button:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):checked, headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; @@ -1293,12 +1292,12 @@ headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabl color: rgba(255, 255, 255, 0.3); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, +.path-bar-box .nautilus-path-bar button:backdrop:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, +.path-bar-box .nautilus-path-bar button:backdrop:disabled:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:first-child:dir(rtl), .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled, headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1313,7 +1312,7 @@ headerbar button.destructive-action:disabled { .selection-mode.titlebar:not(headerbar), headerbar.selection-mode { transition: background-color 0.00001s 225ms, color 225ms cubic-bezier(0, 0, 0.2, 1); - animation: header_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1); + animation: ripple-headerbar 225ms cubic-bezier(0, 0, 0.2, 1); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #4285F4; color: white; @@ -2392,6 +2391,7 @@ switch slider { min-height: 20px; margin: -3px -2px; border-radius: 9999px; + outline: none; box-shadow: 0 0 0 10px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #FFFFFF; } @@ -2773,7 +2773,7 @@ scale slider:focus:hover { scale slider:active { transition: background-color 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: scale_ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple-slider 225ms cubic-bezier(0, 0, 0.2, 1) forwards; background-size: auto, 0% 0%; background-color: rgba(66, 133, 244, 0.08); color: rgba(66, 133, 244, 0.12); @@ -3145,7 +3145,7 @@ row.activatable:hover, treeview.view header button:hover, .budgie-popover.budgie row.activatable.has-open-popup, treeview.view header button.has-open-popup, .budgie-popover.budgie-menu button.has-open-popup.flat:not(.image-button), row.activatable:active, treeview.view header button:active, .budgie-popover.budgie-menu button.flat:active:not(.image-button) { transition: all 100ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0; - animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards; + animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; @@ -3165,6 +3165,11 @@ row:selected button label { color: inherit; } +row:selected:disabled image, +row:selected:disabled label { + color: rgba(0, 0, 0, 0.38); +} + /********************* * App Notifications * *********************/ @@ -3329,6 +3334,10 @@ stacksidebar row > label { padding-right: 6px; } +separator.sidebar { + background-color: rgba(0, 0, 0, 0.12); +} + /**************** * File chooser * ****************/ @@ -3914,6 +3923,23 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- margin-right: 0; } +.path-bar-box .nautilus-path-bar button { + padding-left: 6px; + padding-right: 6px; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { + margin-left: 0; +} + +.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { + margin-right: 0; +} + +.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { + margin: 0; +} + .nautilus-window .floating-bar { min-height: 32px; padding: 0; @@ -3923,7 +3949,6 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- border-radius: 5px 5px 0 0; background-color: rgba(255, 255, 255, 0.9); background-clip: padding-box; - transition: all 100ms cubic-bezier(0, 0, 0.2, 1), border-width 0; } .nautilus-window .floating-bar.bottom.left { @@ -3959,8 +3984,9 @@ headerbar .nautilus-canvas-item.subtitle, .budgie-notification .nautilus-canvas- .search-information { padding: 2px; - background-color: #4285F4; - color: white; + border-bottom: 1px solid rgba(0, 0, 0, 0.12); + background-color: #FFFFFF; + color: rgba(0, 0, 0, 0.87); } .conflict-row:not(:selected) { @@ -4034,6 +4060,11 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: font-size: smaller; } +.open-document-selector-match { + background-color: #FBBC05; + color: rgba(0, 0, 0, 0.87); +} + .gedit-document-panel { background-color: #FAFAFA; } @@ -4565,6 +4596,21 @@ GdMainIconView.content-view { transition: opacity 100ms cubic-bezier(0, 0, 0.2, 1); } +button.photos-filter-preview { + color: rgba(0, 0, 0, 0.87); + font-weight: normal; +} + +button.photos-filter-preview:checked { + background-color: rgba(66, 133, 244, 0.32); + color: rgba(0, 0, 0, 0.87); +} + +button.photos-filter-preview:checked image { + color: white; + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); +} + overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { border-style: none none none solid; } @@ -6043,7 +6089,6 @@ XfdesktopIconView.view { XfdesktopIconView.view:active { box-shadow: none; - text-shadow: none; } XfdesktopIconView.view .rubberband {