diff --git a/change_color.sh b/change_color.sh index 2776e376f..f9b62daae 100755 --- a/change_color.sh +++ b/change_color.sh @@ -60,17 +60,17 @@ if [[ -z "${THEME:-}" ]]; then fi PATHLIST=( + './src/_sass/_colors.scss' './src/chrome' './src/cinnamon' './src/cinnamon/assets' './src/gnome-shell' + './src/gtk/assets.svg' + './src/gtk-2.0/assets.svg' + './src/gtk-2.0/assets-dark.svg' './src/gtk-2.0/gtkrc' './src/gtk-2.0/gtkrc-dark' './src/gtk-2.0/gtkrc-light' - './src/_sass/_colors.scss' - './src/gtk-2.0/assets.svg' - './src/gtk-2.0/assets-dark.svg' - './src/gtk/assets.svg' './src/metacity-1' './src/unity' './src/xfwm4' @@ -175,39 +175,34 @@ for FILEPATH in "${PATHLIST[@]}"; do find "$FILEPATH" -type f -not -name '_color-palette.scss' -exec sed -i'' \ -e '/color-surface/{n;s/#FFFFFF/%MATERIA_SURFACE%/g}' \ -e '/color-base/{n;s/#FFFFFF/%MATERIA_VIEW%/g}' \ + -e 's/#8AB4F8/%SEL_BG%/g' \ + -e 's/#1A73E8/%SEL_BG%/g' \ -e 's/#000000/%FG%/g' \ -e 's/#212121/%FG%/g' \ - -e 's/#757575/%INACTIVE_FG%/g' \ -e 's/#BDBDBD/%INACTIVE_FG%/g' \ - -e 's/#FAFAFA/%INACTIVE_MATERIA_VIEW%/g' \ + -e 's/#616161/%INACTIVE_FG%/g' \ -e 's/#F2F2F2/%BG%/g' \ - -e 's/#4285F4/%SEL_BG%/g' \ + -e 's/#FFFFFF/%MATERIA_SURFACE%/g' \ -e 's/#FFFFFF/%MATERIA_VIEW%/g' \ - -e 's/#383838/%HDR_BG%/g' \ + -e 's/#FAFAFA/%INACTIVE_MATERIA_VIEW%/g' \ + -e 's/#353535/%HDR_BG%/g' \ + -e 's/#2C2C2C/%HDR_BG2%/g' \ -e 's/#E0E0E0/%HDR_BG%/g' \ + -e 's/#D6D6D6/%HDR_BG2%/g' \ -e 's/Materia/%OUTPUT_THEME_NAME%/g' \ - -e 's/#282828/%HDR_BG%/g' \ - -e 's/#303030/%MATERIA_VIEW%/g' \ - -e 's/#2C2C2C/%INACTIVE_MATERIA_VIEW%/g' \ - -e 's/#424242/%MATERIA_SURFACE%/g' \ {} \; ; else find "$FILEPATH" -type f -not -name '_color-palette.scss' -exec sed -i'' \ - -e 's/#000000/%BG%/g' \ - -e 's/#282828/%BG%/g' \ - -e 's/#757575/%INACTIVE_FG%/g' \ + -e 's/#1A73E8/%SEL_BG%/g' \ + -e 's/#FFFFFF/%FG%/g' \ -e 's/#BDBDBD/%INACTIVE_FG%/g' \ + -e 's/#212121/%BG%/g' \ + -e 's/#3C3C3C/%MATERIA_SURFACE%/g' \ + -e 's/#2C2C2C/%MATERIA_VIEW%/g' \ -e 's/#2C2C2C/%INACTIVE_MATERIA_VIEW%/g' \ - -e 's/#FFFFFF/%FG%/g' \ - -e 's/#FAFAFA/%FG%/g' \ - -e 's/#424242/%MATERIA_SURFACE%/g' \ - -e 's/#4285F4/%SEL_BG%/g' \ - -e 's/#303030/%MATERIA_VIEW%/g' \ - -e 's/#383838/%HDR_BG%/g' \ - -e 's/#212121/%HDR_BG2%/g' \ + -e 's/#353535/%HDR_BG%/g' \ + -e 's/#2C2C2C/%HDR_BG2%/g' \ -e 's/Materia/%OUTPUT_THEME_NAME%/g' \ - -e 's/#F2F2F2/%FG%/g' \ - -e 's/#E0E0E0/%HDR_FG%/g' \ {} \; ; fi done diff --git a/install.sh b/install.sh index bbea3d785..22aabe27f 100755 --- a/install.sh +++ b/install.sh @@ -146,6 +146,8 @@ install_gdm() { fi } +colors=() +sizes=() while [[ "$#" -gt 0 ]]; do case "${1:-}" in -d|--dest) @@ -228,8 +230,14 @@ if [[ ! -w "${dest:-$DEST_DIR}" ]]; then exit 1 fi -for color in "${colors[@]:-${COLOR_VARIANTS[@]}}"; do - for size in "${sizes[@]:-${SIZE_VARIANTS[@]}}"; do +if [[ "${#colors[@]}" -eq 0 ]] ; then + colors=("${COLOR_VARIANTS[@]}") +fi +if [[ "${#sizes[@]}" -eq 0 ]] ; then + sizes=("${SIZE_VARIANTS[@]}") +fi +for color in "${colors[@]}"; do + for size in "${sizes[@]}"; do install "${dest:-$DEST_DIR}" "${_name:-$THEME_NAME}" "$color" "$size" done done diff --git a/src/_sass/_color-palette.scss b/src/_sass/_color-palette.scss index 9c7b71f81..ea7ef6c7a 100644 --- a/src/_sass/_color-palette.scss +++ b/src/_sass/_color-palette.scss @@ -1,5 +1,5 @@ -// based color palette: -// https://material.io/guidelines/style/color.html#color-color-palette +// Based on 2014 Material Design color palettes: +// https://material.io/design/color/#tools-for-picking-colors // Red $red-50: #FFEBEE; diff --git a/src/_sass/_colors.scss b/src/_sass/_colors.scss index 787594e54..b1da4432a 100644 --- a/src/_sass/_colors.scss +++ b/src/_sass/_colors.scss @@ -3,11 +3,6 @@ @import 'color-palette'; -$blue: #4285F4; -$green: #34A853; -$yellow: #FBBC05; -$red: #EA4335; - @function gtkalpha($c, $a) { @return unquote("alpha(#{$c}, #{$a})"); } @@ -22,7 +17,7 @@ $red: #EA4335; @if ($brightness >= 128) { @if ($state == 'primary') { @return rgba(black, 0.87); } - @if ($state == 'secondary') { @return rgba(black, 0.54); } + @if ($state == 'secondary') { @return rgba(black, 0.6); } @if ($state == 'disabled') { @return rgba(black, 0.38); } @if ($state == 'secondary-disabled') { @return rgba(black, 0.26); } @if ($state == 'track') { @return rgba(black, 0.26); } @@ -51,24 +46,24 @@ $red: #EA4335; // Basic colors // -$primary-dark: $blue; +$primary-dark: #1A73E8; $primary-light: #8AB4F8; $primary: if($variant == 'light', $primary-dark, $primary-light); -$background: if($variant == 'light', #F2F2F2, #282828); -$surface: if($variant == 'light', #FFFFFF, #424242); -$base: if($variant == 'light', #FFFFFF, #303030); // semi-surface with no elevation +$background: if($variant == 'light', #F2F2F2, #212121); +$surface: if($variant == 'light', #FFFFFF, #3C3C3C); +$base: if($variant == 'light', #FFFFFF, #2C2C2C); // semi-surface with 1dp elevation $base-alt: if($variant == 'light', #FAFAFA, #2C2C2C); -$os-background: #303030; +$os-background: #212121; $tooltip: rgba(#616161, 0.9); -$scrim: rgba(black, 0); -$scrim-alt: rgba(black, 0.6); +$scrim: rgba(black, 0.6); +$scrim-alt: rgba(black, 0.3); $scrim-inverse: rgba(white, 0.1); -$titlebar: if($topbar == 'dark', #383838, #E0E0E0); -$titlebar-backdrop: if($topbar == 'dark', #303030, #D6D6D6); -$panel: $os-background; -$panel-solid: if($titlebar == 'dark', $grey_800, mix($grey_200, $grey_400, 50%)); // for Unity panel which doesn't allow translucent colors +$titlebar: if($topbar == 'dark', #353535, #E0E0E0); +$titlebar-backdrop: if($topbar == 'dark', #2C2C2C, #D6D6D6); +$panel: if($topbar == 'dark', #1F1F1F, $scrim); +$panel-solid: if($topbar == 'dark', #1F1F1F, #CCCCCC); // for Unity panel which doesn't allow translucent colors // // Misc colors @@ -77,9 +72,9 @@ $panel-solid: if($titlebar == 'dark', $grey_800, mix($ $link: $primary; $link-visited: if($variant == 'light', $purple-500, $purple-200); -$warning: $yellow; -$error: $red; -$success: $green; +$warning: if($variant == 'light', #F4B400, #FDD633); +$error: if($variant == 'light', #D93025, #F28B82); +$success: if($variant == 'light', #0F9D58, #81C995); $suggested: $primary; $destructive: $error; @@ -122,4 +117,4 @@ $titlebar-divider: on($titlebar, divider); $titlebar-fill: on($titlebar, fill); // workaround for GTK3 @placeholder_text_color which doesn't allow translucent colors -$placeholder_text_color: if($variant == 'light', $grey-600, mix($white, $base, percentage(0.7))); +$placeholder_text_color: if($variant == 'light', mix(black, $base, percentage(0.6)), mix(white, $base, percentage(0.7))); diff --git a/src/_sass/_colors.scss.template b/src/_sass/_colors.scss.template index 131639b68..abad81667 100644 --- a/src/_sass/_colors.scss.template +++ b/src/_sass/_colors.scss.template @@ -17,7 +17,7 @@ @if ($brightness >= 128) { @if ($state == 'primary') { @return rgba(black, 0.87); } - @if ($state == 'secondary') { @return rgba(black, 0.54); } + @if ($state == 'secondary') { @return rgba(black, 0.6); } @if ($state == 'disabled') { @return rgba(black, 0.38); } @if ($state == 'secondary-disabled') { @return rgba(black, 0.26); } @if ($state == 'track') { @return rgba(black, 0.26); } @@ -46,11 +46,6 @@ // Basic colors // -$blue: %TERMINAL_COLOR12%; -$green: %TERMINAL_COLOR10%; -$yellow: %TERMINAL_COLOR11%; -$red: %TERMINAL_COLOR9%; - $primary-dark: %SEL_BG%; $primary-light: %SEL_BG%; $primary: if($variant == 'light', $primary-dark, $primary-light); diff --git a/src/_sass/_variables.scss b/src/_sass/_variables.scss index ee28479a6..e753ac397 100644 --- a/src/_sass/_variables.scss +++ b/src/_sass/_variables.scss @@ -1,7 +1,9 @@ $asset-suffix: if($variant == 'dark', '-dark', ''); -$background-clip-extra: if($variant == 'light', padding-box, border-box); -// sizes +// +// Sizes +// + $container-padding: if($compact == 'false', 6px, 4px); $small-size: if($compact == 'false', 24px, 20px); @@ -11,35 +13,104 @@ $large-size: if($compact == 'false', 48px, 40px); $bar-size: 4px; $menuitem-size: 28px; -// radii +// +// Radii +// + $corner-radius: 2px; $circular-radius: 9999px; -// durations +// +// Durations +// + $duration: 75ms; $ripple-fade-in-duration: 225ms; $ripple-fade-out-duration: 300ms; $ripple-fade-out-opacity-duration: 1200ms; -// timing functions +// +// Timing functions +// + $ease: cubic-bezier(0.4, 0.0, 0.2, 1); $ease-out: cubic-bezier(0.0, 0.0, 0.2, 1); $ease-in: cubic-bezier(0.4, 0.0, 1, 1); $ease-in-out: cubic-bezier(0.4, 0.0, 0.6, 1); -// transition shorthands +// +// Transition shorthands +// + $transition: all $duration $ease-out; $transition-shadow: box-shadow $duration $ease-out; -// shadows -// based shadow values: -// https://material-design.storage.googleapis.com/images/layout-principles-dimensionality-shadows-08_large_mdpi.png +// +// Shadows +// -// box-shadow 1px blur doesn't draw correctly, see +// Values are based on: +// https://github.com/material-components/material-components-web/blob/master/packages/mdc-elevation/_variables.scss + +// NOTE: box-shadow blur less than 2px doesn't work properly, see // https://gitlab.gnome.org/GNOME/gtk/issues/511 -// $shadow-1: 0 1px 1.5px rgba(black, 0.12), 0 1px 1px rgba(black, 0.24); -$shadow-1: 0 1px 1px rgba(black, 0.12), 0 1px 2px rgba(black, 0.24); -$shadow-2: 0 3px 3px rgba(black, 0.16), 0 3px 3px rgba(black, 0.23); -$shadow-3: 0 10px 10px rgba(black, 0.19), 0 6px 3px rgba(black, 0.23); -$shadow-4: 0 14px 14px rgba(black, 0.25), 0 10px 5px rgba(black, 0.22); -$shadow-5: 0 19px 19px rgba(black, 0.30), 0 15px 6px rgba(black, 0.22); + +// NOTE 2: Compared to rendering on the Web, GTK seems to have a bigger blur. + +$shadow-z1: + // 0 2px (1px * .6) -1px rgba(black, 0.2), + 0 2px 2px -2px rgba(black, 0.3), + // 0 1px (1px * .6) 0 rgba(black, 0.14), + 0 1px 2px -1px rgba(black, 0.24), + // 0 1px (3px * .6) 0 rgba(black, 0.12); + 0 1px 2px -.6px rgba(black, 0.17); +$shadow-z2: + // 0 3px (1px * .6) -2px rgba(black, 0.2), + 0 3px 2px -3px rgba(black, 0.3), + // 0 2px (2px * .6) 0 rgba(black, 0.14), + 0 2px 2px -1px rgba(black, 0.24), + 0 1px (5px * .6) 0 rgba(black, 0.12); +$shadow-z3: + // 0 3px (3px * .6) -2px rgba(black, 0.2), + 0 3px 2px -2px rgba(black, 0.2), + 0 3px (4px * .6) 0 rgba(black, 0.14), + 0 1px (8px * .6) 0 rgba(black, 0.12); +$shadow-z4: + 0 2px (4px * .6) -1px rgba(black, 0.2), + 0 4px (5px * .6) 0 rgba(black, 0.14), + 0 1px (10px * .6) 0 rgba(black, 0.12); +$shadow-z6: + 0 3px (5px * .6) -1px rgba(black, 0.2), + 0 6px (10px * .6) 0 rgba(black, 0.14), + 0 1px (18px * .6) 0 rgba(black, 0.12); +$shadow-z8: + 0 5px (5px * .6) -3px rgba(black, 0.2), + 0 8px (10px * .6) 1px rgba(black, 0.14), + 0 3px (14px * .6) 2px rgba(black, 0.12); +$shadow-z12: + 0 7px (8px * .6) -4px rgba(black, 0.2), + 0 12px (17px * .6) 2px rgba(black, 0.14), + 0 5px (22px * .6) 4px rgba(black, 0.12); +$shadow-z16: + 0 8px (10px * .6) -5px rgba(black, 0.2), + 0 16px (24px * .6) 2px rgba(black, 0.14), + 0 6px (30px * .6) 5px rgba(black, 0.12); +$shadow-z24: + 0 11px (15px * .6) -7px rgba(black, 0.2), + 0 24px (38px * .6) 3px rgba(black, 0.14), + 0 9px (46px * .6) 8px rgba(black, 0.12); + +$text-shadow: + 0 1px 1px rgba(black, 0.2), + 0 1px 2px rgba(black, 0.14), + 0 1px 3px rgba(black, 0.12); + +// workaround for selection-mode checkboxes +$icon-shadow-z2: + 0 1px 1px rgba(black, 0.2), + 0 2px 2px rgba(black, 0.14), + 0 1px (5px * .6) rgba(black, 0.12); +$icon-shadow-z4: + 0 2px 2px rgba(black, 0.2), + 0 4px (5px * .6) rgba(black, 0.14), + 0 1px (10px * .6) rgba(black, 0.12); diff --git a/src/_sass/chrome/_scrollbars.scss b/src/_sass/chrome/_scrollbars.scss index b67d10006..e7c889740 100644 --- a/src/_sass/chrome/_scrollbars.scss +++ b/src/_sass/chrome/_scrollbars.scss @@ -3,8 +3,7 @@ width: 17px; height: 17px; border: 0 solid $divider; - background-color: rgba($base, 0.9); - background-clip: $background-clip-extra; + background-color: rgba($surface, 0.9); } ::-webkit-scrollbar:horizontal, @@ -17,6 +16,10 @@ border-left-width: 1px; } +::-webkit-scrollbar { + background-clip: padding-box; +} + ::-webkit-scrollbar-thumb { width: 32px; height: 32px; @@ -43,3 +46,11 @@ &:disabled { background-color: $text-secondary-disabled; } } + +// +// Workaround: Chrome does not properly load selection style of GTK theme. +// + +::selection { + background-color: rgba($primary-dark, 0.24); +} diff --git a/src/_sass/cinnamon/_common.scss b/src/_sass/cinnamon/_common.scss index c8f8b43a9..21b69c146 100644 --- a/src/_sass/cinnamon/_common.scss +++ b/src/_sass/cinnamon/_common.scss @@ -1,7 +1,7 @@ // defines font family and standard font size across the whole theme // em is preferred for better support for text scaling stage { - @include font(body-1); + @include type(body2); font-family: $font-family; color: $text; @@ -54,7 +54,7 @@ StScrollView { @extend %slider-shared; } #Tooltip { - @include font(caption); + @include type(caption); padding: 6px 8px; color: on($tooltip); @@ -125,7 +125,7 @@ StScrollView { &:insensitive { color: $text-disabled; } } .popup-subtitle-menu-item { - @include font(body-2); + @include type(subtitle2); } .popup-menu-icon { icon-size: 1.14em; @@ -135,7 +135,7 @@ StScrollView { .popup-submenu-menu-item:open { } .popup-alternating-menu-item:alternate { - @include font(body-2); + @include type(subtitle2); } // toggles in menus .toggle-switch { @@ -440,7 +440,7 @@ StScrollView { } // keyboard layout applet .panel-status-button { - @include font(body-2); + @include type(subtitle2); -natural-hpadding: 4px; -minimum-hpadding: 4px; color: $titlebar-text-secondary; @@ -478,7 +478,7 @@ StScrollView { } .window-caption { - @include font(caption); + @include type(caption); background-color: rgba(0, 0, 0, 0.01); color: $titlebar-text-secondary; @@ -569,7 +569,7 @@ StScrollView { } // also covers the year label .datemenu-date-label { - @include font(title); + @include type(headline6); height: $menuitem-size - 2px * 2; margin: 2px; @@ -580,7 +580,7 @@ StScrollView { &:focus { background-color: $divider }; } .calendar-month-label { - @include font(body-2); + @include type(subtitle2); height: $menuitem-size - 6px * 2; margin: 2px; @@ -607,7 +607,7 @@ StScrollView { } } .calendar-day-base { - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; @@ -622,7 +622,7 @@ StScrollView { } } .calendar-week-number { - @include font(caption); + @include type(caption); width: $menuitem-size - 7px; height: $menuitem-size; margin: 2px; @@ -633,7 +633,7 @@ StScrollView { text-align: center; } .calendar-day-heading { - @include font(caption); + @include type(caption); width: $menuitem-size; height: $menuitem-size - 7px; margin: 2px; @@ -936,7 +936,7 @@ StScrollView { } .keyboard-key { @extend %icon-button-shared; - @include font(button); + @include type(button); } .keyboard-layout { spacing: 8px; @@ -1028,10 +1028,10 @@ StScrollView { } } .menu-selected-app-title { - @include font(caption); + @include type(caption); } .menu-selected-app-description { - @include font(caption); + @include type(caption); max-width: 150px; } @@ -1058,7 +1058,7 @@ StScrollView { } // the window list applet. Some third party applets inherit some of this theming. .window-list-box { - @include font(caption); + @include type(caption); spacing: 4px; padding: 0 3px; @@ -1117,7 +1117,7 @@ StScrollView { padding-bottom: 6px; } &-number-label { - @include font(caption); + @include type(caption); z-index: 99; } @@ -1325,7 +1325,7 @@ StScrollView { } } .applet-label { - @include font(body-2); + @include type(subtitle2); color: $titlebar-text-secondary; } @@ -1339,7 +1339,7 @@ StScrollView { // desklets - the base .desklet selector is for 'undecorated' desklets however some subtle background themeing is desirable // to maintain visibility irrespctive of wallpaper and to allow for the highlighting scheme to work .desklet { - @include font(caption); + @include type(caption); color: $titlebar-text; border: none; @@ -1351,7 +1351,7 @@ StScrollView { // these do not inherit from .desklet .desklet-with-borders { @extend %desklet-shared; - @include font(caption); + @include type(caption); background-color: $surface; border-radius: $corner-radius; @@ -1361,7 +1361,7 @@ StScrollView { } .desklet-with-borders-and-header { @extend %desklet-shared; - @include font(caption); + @include type(caption); background-color: $surface; border-radius-bottomleft: 2px; @@ -1371,7 +1371,7 @@ StScrollView { } } .desklet-header { - @include font(title) + @include type(headline6) @extend %desklet-shared; background-color: $surface; @@ -1409,10 +1409,10 @@ StScrollView { padding-bottom: 16px; } .about-title { - @include font(title); + @include type(headline6); } .about-uuid { - @include font(caption); + @include type(caption); } .about-icon { padding-right: 20px; @@ -1435,7 +1435,7 @@ StScrollView { @extend %osd-info-workspace-shared; } .expo-workspaces-name-entry { - @include font(body-1); + @include type(body1); background-color: on(dark, fill); color: on(dark); @@ -1598,7 +1598,7 @@ StScrollView { border: none; } .user-label { - @include font(body-2); + @include type(subtitle2); color: $text; } diff --git a/src/_sass/cinnamon/_extends.scss b/src/_sass/cinnamon/_extends.scss index 5b26bfc84..ce03095bd 100644 --- a/src/_sass/cinnamon/_extends.scss +++ b/src/_sass/cinnamon/_extends.scss @@ -1,6 +1,6 @@ %button-shared { @include button(normal); - @include font(button); + @include type(button); min-height: $medium-size; padding: 0 16px; @@ -133,7 +133,7 @@ box-shadow: $shadow-4; } %osd-info-workspace-shared { - @include font(title); + @include type(headline6); @extend %osd-panel-shared; text-align: center; diff --git a/src/_sass/gnome-shell/_common-3.18.scss b/src/_sass/gnome-shell/_common-3.18.scss index 17ecc9d85..8800e06d9 100644 --- a/src/_sass/gnome-shell/_common-3.18.scss +++ b/src/_sass/gnome-shell/_common-3.18.scss @@ -27,7 +27,7 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT"; /* GLOBALS */ stage { font-family: $font-family; - @include font(body-1); + @include type(body2); color: $text; } @@ -36,10 +36,11 @@ stage { /* Buttons */ .button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -50,12 +51,13 @@ stage { .modal-dialog-linked-button { min-height: $medium-size; + min-width: 64px - 8px * 2; margin: $container-padding; padding: 0 8px; margin-right: 0; border-right-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -86,7 +88,7 @@ StEntry { color: $text; selection-background-color: $overlay-selected; selected-color: $text; - @include font(subheading); + @include type(body1); @include entry(normal); &:hover { @include entry(hover);} &:focus { @include entry(focus);} @@ -229,7 +231,7 @@ StScrollBar { /* Modal Dialogs */ -.headline { @include font(title); } +.headline { @include type(headline6); } .lightbox { background-color: black; } .flashspot { background-color: white; } @@ -260,7 +262,7 @@ StScrollBar { .show-processes-dialog-subject, .mount-question-dialog-subject, .end-session-dialog-subject { //this should be a generic header class - @include font(title); + @include type(headline6); } /* End Session Dialog */ @@ -424,7 +426,7 @@ StScrollBar { } .prompt-dialog-headline { - @include font(title); + @include type(headline6); color: $text; } @@ -542,7 +544,7 @@ StScrollBar { .access-dialog-subtitle { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* Geolocation Dialog */ @@ -568,7 +570,7 @@ StScrollBar { .geolocation-dialog-reason { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* Network Agent Dialog */ @@ -648,7 +650,7 @@ StScrollBar { } .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; // This is necessary for the weird bug: materia-theme#296 -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -690,7 +692,7 @@ StScrollBar { min-width: 64px; min-height: 64px; - .osd-monitor-label { @include font(display-2); } + .osd-monitor-label { @include type(headline3); } .level { height: 8px; border-radius: 0; @@ -768,7 +770,7 @@ StScrollBar { } .input-source-switcher-symbol { - @include font(display-2); + @include type(headline3); width: 96px; height: 96px; } @@ -871,8 +873,8 @@ StScrollBar { } .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: $panel-button-hpadding; + -minimum-hpadding: $panel-button-hpadding / 2; font-weight: bold; color: on($panel, secondary); transition-duration: $duration; @@ -975,7 +977,7 @@ StScrollBar { } .datemenu-today-button .date-label { - @include font(title); + @include type(headline6); } .world-clocks-header, @@ -1023,7 +1025,7 @@ StScrollBar { .calendar-day-base { transition-duration: $duration; - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; padding: 0; @@ -1044,7 +1046,7 @@ StScrollBar { border-radius: 100px; background-color: transparent; color: $text-disabled; - @include font(caption); + @include type(caption); font-weight: bold; text-align: center; } @@ -1074,7 +1076,6 @@ StScrollBar { } .calendar-other-month-day { color: $text-secondary-disabled; - opacity: 0.5; } .calendar-week-number { width: $menuitem-size; height: $menuitem-size - 7px; @@ -1334,7 +1335,7 @@ StScrollBar { .nm-dialog-airplane-text { color: $text; } .nm-dialog-header-icon { icon-size: 32px; } .nm-dialog-scroll-view { border: none; } - .nm-dialog-header { @include font(title); } + .nm-dialog-header { @include type(headline6); } .nm-dialog-item { transition-duration: $duration; @@ -1451,7 +1452,7 @@ StScrollBar { } .list-search-result-content { spacing: 12px; padding: 12px; } - .list-search-result-title { @include font(headline); color: on(dark); } + .list-search-result-title { @include type(headline5); color: on(dark); } .list-search-result-description { color: on(dark, secondary); } .search-provider-icon { padding: 15px; } .search-provider-icon-more { @@ -1520,7 +1521,7 @@ StScrollBar { padding-bottom: 32px; } .app-view-control { //favorties | all toggle button - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: on(dark, secondary); &:hover { @@ -1704,7 +1705,7 @@ StScrollBar { } %status_text { - @include font(display-2); + @include type(headline3); color: on(dark, disabled); } @@ -1741,15 +1742,15 @@ StScrollBar { padding: 0 8px; border-radius: $corner-radius; background-color: transparent; - color: $text-secondary; + color: $primary; font-weight: 500; &:first-child { border-radius: $corner-radius; } &:last-child { border-radius: $corner-radius; } - &:hover, &focus { background-color: $overlay-hover; color: $text; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } &:active { transition-duration: $duration-ripple; - background-color: $overlay-active; - color: $text; + background-color: $primary-overlay-active; } } } @@ -1784,7 +1785,7 @@ StScrollBar { } .chat-meta-message { padding-left: 4px; - @include font(caption); + @include type(caption); color: $text-secondary; &:rtl { padding-left: 0; padding-right: 4px; } } @@ -1996,13 +1997,16 @@ $legacy_icon_size: 24px; .modal-dialog-button-box { spacing: 3px; } .modal-dialog-button { - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; @include button(flat-normal, $tc: on($os-background)); &:hover,&:focus { @include button(flat-hover, $tc: on($os-background)); } &:active { @include button(flat-active, $tc: on($os-background)); } &:insensitive { @include button(flat-insensitive, $tc: on($os-background)); } &:default { + min-width: 64px - 16px * 2; + padding: 0 16px; @include button(normal, $c: $suggested, $tc: on($suggested)); &:hover,&:focus { @include button(hover, $c: $suggested, $tc: on($suggested)); } &:active { @include button(active, $c: $suggested, $tc: on($suggested)); } @@ -2082,7 +2086,7 @@ $legacy_icon_size: 24px; .login-dialog-username, .user-widget-label { color: on($os-background); - @include font(title); + @include type(headline6); text-align: left; padding-left: 15px; } @@ -2137,11 +2141,11 @@ $legacy_icon_size: 24px; } .screen-shield-clock-time { - @include font(display-4); + @include type(headline1); text-shadow: $shadow-1; } -.screen-shield-clock-date { @include font(display-2); } +.screen-shield-clock-date { @include type(headline4); } .screen-shield-notifications-container { spacing: 6px; @@ -2265,10 +2269,11 @@ $legacy_icon_size: 24px; .lg-obj-inspector-button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border: none; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -2291,7 +2296,7 @@ $legacy_icon_size: 24px; } .lg-extension-name { - @include font(headline); + @include type(headline5); } .lg-extension-meta { diff --git a/src/_sass/gnome-shell/_common-3.24.scss b/src/_sass/gnome-shell/_common-3.24.scss index 6cba2392b..5da303617 100644 --- a/src/_sass/gnome-shell/_common-3.24.scss +++ b/src/_sass/gnome-shell/_common-3.24.scss @@ -27,7 +27,7 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT"; /* GLOBALS */ stage { font-family: $font-family; - @include font(body-1); + @include type(body2); color: $text; } @@ -36,10 +36,11 @@ stage { /* Buttons */ .button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -50,12 +51,13 @@ stage { .modal-dialog-linked-button { min-height: $medium-size; + min-width: 64px - 8px * 2; margin: $container-padding; padding: 0 8px; margin-right: 0; border-right-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -86,7 +88,7 @@ StEntry { color: $text; selection-background-color: $overlay-selected; selected-color: $text; - @include font(subheading); + @include type(body1); @include entry(normal); &:hover { @include entry(hover);} &:focus { @include entry(focus);} @@ -229,7 +231,7 @@ StScrollBar { /* Modal Dialogs */ -.headline { @include font(title); } +.headline { @include type(headline6); } .lightbox { background-color: black; } .flashspot { background-color: white; } @@ -260,7 +262,7 @@ StScrollBar { .show-processes-dialog-subject, .mount-question-dialog-subject, .end-session-dialog-subject { //this should be a generic header class - @include font(title); + @include type(headline6); } /* End Session Dialog */ @@ -424,7 +426,7 @@ StScrollBar { } .prompt-dialog-headline { - @include font(title); + @include type(headline6); color: $text; } @@ -542,7 +544,7 @@ StScrollBar { .access-dialog-subtitle { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* Geolocation Dialog */ @@ -568,7 +570,7 @@ StScrollBar { .geolocation-dialog-reason { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* Network Agent Dialog */ @@ -648,7 +650,7 @@ StScrollBar { } .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; // This is necessary for the weird bug: materia-theme#296 -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -690,7 +692,7 @@ StScrollBar { min-width: 64px; min-height: 64px; - .osd-monitor-label { @include font(display-2); } + .osd-monitor-label { @include type(headline3); } .level { height: 8px; border-radius: 0; @@ -771,7 +773,7 @@ StScrollBar { } .input-source-switcher-symbol { - @include font(display-2); + @include type(headline3); width: 96px; height: 96px; } @@ -874,8 +876,8 @@ StScrollBar { } .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: $panel-button-hpadding; + -minimum-hpadding: $panel-button-hpadding / 2; font-weight: bold; color: on($panel, secondary); transition-duration: $duration; @@ -987,7 +989,7 @@ StScrollBar { } .datemenu-today-button .date-label { - @include font(title); + @include type(headline6); } .world-clocks-header, @@ -1040,7 +1042,7 @@ StScrollBar { .calendar-day-base { transition-duration: $duration; - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; padding: 0; @@ -1065,7 +1067,7 @@ StScrollBar { border-radius: 100px; background-color: transparent; color: $text-disabled; - @include font(caption); + @include type(caption); font-weight: bold; text-align: center; } @@ -1095,7 +1097,6 @@ StScrollBar { } .calendar-other-month-day { color: $text-secondary-disabled; - opacity: 0.5; } .calendar-week-number { width: $menuitem-size; height: $menuitem-size - 7px; @@ -1116,8 +1117,9 @@ StScrollBar { .message-list-clear-button.button { background-color: transparent; - &:hover,&:focus { background-color: $overlay-hover; } - &:active { background-color: $overlay-active; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } + &:active { background-color: $primary-overlay-active; } margin: 8px 8px 0; } @@ -1349,7 +1351,7 @@ StScrollBar { .nm-dialog-airplane-text { color: $text; } .nm-dialog-header-icon { icon-size: 32px; } .nm-dialog-scroll-view { border: none; } - .nm-dialog-header { @include font(title); } + .nm-dialog-header { @include type(headline6); } .nm-dialog-item { transition-duration: $duration; @@ -1466,7 +1468,7 @@ StScrollBar { } .list-search-result-content { spacing: 12px; padding: 12px; } - .list-search-result-title { @include font(headline); color: on(dark); } + .list-search-result-title { @include type(headline5); color: on(dark); } .list-search-result-description { color: on(dark, secondary); } .search-provider-icon { padding: 15px; } .search-provider-icon-more { @@ -1535,7 +1537,7 @@ StScrollBar { padding-bottom: 32px; } .app-view-control { //favorties | all toggle button - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: on(dark, secondary); &:hover { @@ -1719,7 +1721,7 @@ StScrollBar { } %status_text { - @include font(display-2); + @include type(headline3); color: on(dark, disabled); } @@ -1756,15 +1758,15 @@ StScrollBar { padding: 0 8px; border-radius: $corner-radius; background-color: transparent; - color: $text-secondary; + color: $primary; font-weight: 500; &:first-child { border-radius: $corner-radius; } &:last-child { border-radius: $corner-radius; } - &:hover, &focus { background-color: $overlay-hover; color: $text; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } &:active { transition-duration: $duration-ripple; - background-color: $overlay-active; - color: $text; + background-color: $primary-overlay-active; } } } @@ -1799,7 +1801,7 @@ StScrollBar { } .chat-meta-message { padding-left: 4px; - @include font(caption); + @include type(caption); color: $text-secondary; &:rtl { padding-left: 0; padding-right: 4px; } } @@ -2011,13 +2013,16 @@ $legacy_icon_size: 24px; .modal-dialog-button-box { spacing: 3px; } .modal-dialog-button { - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; @include button(flat-normal, $tc: on($os-background)); &:hover,&:focus { @include button(flat-hover, $tc: on($os-background)); } &:active { @include button(flat-active, $tc: on($os-background)); } &:insensitive { @include button(flat-insensitive, $tc: on($os-background)); } &:default { + min-width: 64px - 16px * 2; + padding: 0 16px; @include button(normal, $c: $suggested, $tc: on($suggested)); &:hover,&:focus { @include button(hover, $c: $suggested, $tc: on($suggested)); } &:active { @include button(active, $c: $suggested, $tc: on($suggested)); } @@ -2095,7 +2100,7 @@ $legacy_icon_size: 24px; .login-dialog-username, .user-widget-label { color: on($os-background); - @include font(title); + @include type(headline6); text-align: left; padding-left: 15px; } @@ -2150,11 +2155,11 @@ $legacy_icon_size: 24px; } .screen-shield-clock-time { - @include font(display-4); + @include type(headline1); text-shadow: $shadow-1; } -.screen-shield-clock-date { @include font(display-2); } +.screen-shield-clock-date { @include type(headline4); } .screen-shield-notifications-container { spacing: 6px; @@ -2278,10 +2283,11 @@ $legacy_icon_size: 24px; .lg-obj-inspector-button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border: none; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -2304,7 +2310,7 @@ $legacy_icon_size: 24px; } .lg-extension-name { - @include font(headline); + @include type(headline5); } .lg-extension-meta { diff --git a/src/_sass/gnome-shell/_common-3.26.scss b/src/_sass/gnome-shell/_common-3.26.scss index a25542c19..e384dcab7 100644 --- a/src/_sass/gnome-shell/_common-3.26.scss +++ b/src/_sass/gnome-shell/_common-3.26.scss @@ -27,7 +27,7 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT"; /* GLOBALS */ stage { font-family: $font-family; - @include font(body-1); + @include type(body2); color: $text; } @@ -36,10 +36,11 @@ stage { /* Buttons */ .button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -50,12 +51,13 @@ stage { .modal-dialog-linked-button { min-height: $medium-size; + min-width: 64px - 8px * 2; margin: $container-padding; padding: 0 8px; margin-right: 0; border-right-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -86,7 +88,7 @@ StEntry { color: $text; selection-background-color: $overlay-selected; selected-color: $text; - @include font(subheading); + @include type(body1); @include entry(normal); &:hover { @include entry(hover);} &:focus { @include entry(focus);} @@ -229,7 +231,7 @@ StScrollBar { /* Modal Dialogs */ -.headline { @include font(title); } +.headline { @include type(headline6); } .lightbox { background-color: black; } .flashspot { background-color: white; } @@ -259,7 +261,7 @@ StScrollBar { .mount-dialog-subject, .end-session-dialog-subject { //this should be a generic header class - @include font(title); + @include type(headline6); } /* Message Dialog */ @@ -284,7 +286,7 @@ StScrollBar { .message-dialog-subtitle { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -432,7 +434,7 @@ StScrollBar { .message-dialog-main-layout { spacing: 24px; padding: 10px; } .message-dialog-content { spacing: 16px; } - .message-dialog-title { @include font(title); color: $text; } + .message-dialog-title { @include type(headline6); color: $text; } } .prompt-dialog-description:rtl { @@ -621,7 +623,7 @@ StScrollBar { } .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; // This is necessary for the weird bug: materia-theme#296 -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -663,7 +665,7 @@ StScrollBar { min-width: 64px; min-height: 64px; - .osd-monitor-label { @include font(display-2); } + .osd-monitor-label { @include type(headline3); } .level { height: 8px; border-radius: 0; @@ -745,7 +747,7 @@ StScrollBar { } .input-source-switcher-symbol { - @include font(display-2); + @include type(headline3); width: 96px; height: 96px; } @@ -848,8 +850,8 @@ StScrollBar { } .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: $panel-button-hpadding; + -minimum-hpadding: $panel-button-hpadding / 2; font-weight: bold; color: on($scrim, secondary); text-shadow: none; @@ -1015,7 +1017,7 @@ StScrollBar { } .datemenu-today-button .date-label { - @include font(title); + @include type(headline6); } .world-clocks-header, @@ -1068,7 +1070,7 @@ StScrollBar { .calendar-day-base { transition-duration: $duration; - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; padding: 0; @@ -1093,7 +1095,7 @@ StScrollBar { border-radius: 100px; background-color: transparent; color: $text-disabled; - @include font(caption); + @include type(caption); font-weight: bold; text-align: center; } @@ -1123,7 +1125,6 @@ StScrollBar { } .calendar-other-month-day { color: $text-secondary-disabled; - opacity: 0.5; } .calendar-week-number { width: $menuitem-size; height: $menuitem-size - 7px; @@ -1144,8 +1145,9 @@ StScrollBar { .message-list-clear-button.button { background-color: transparent; - &:hover,&:focus { background-color: $overlay-hover; } - &:active { background-color: $overlay-active; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } + &:active { background-color: $primary-overlay-active; } margin: 8px 8px 0; } @@ -1381,7 +1383,7 @@ StScrollBar { .nm-dialog-airplane-text { color: $text; } .nm-dialog-header-icon { icon-size: 32px; } .nm-dialog-scroll-view { border: none; } - .nm-dialog-header { @include font(title); } + .nm-dialog-header { @include type(headline6); } .nm-dialog-item { transition-duration: $duration; @@ -1488,7 +1490,7 @@ StScrollBar { .search-section-separator { height: 1px; background-color: on(dark, divider); } .list-search-result-content { spacing: 30px; } - .list-search-result-title { @include font(subheading); color: on(dark); spacing: 12px; } + .list-search-result-title { @include type(subtitle1); color: on(dark); spacing: 12px; } .list-search-result-description { color: on(dark, secondary); } .list-search-provider-details { width: 150px; color: on(dark, secondary); margin-top: 0.24em; } .list-search-provider-content { spacing: 20px; } @@ -1562,7 +1564,7 @@ StScrollBar { padding-bottom: 32px; } .app-view-control { //favorties | all toggle button - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: on(dark, secondary); &:hover { @@ -1746,7 +1748,7 @@ StScrollBar { } %status_text { - @include font(display-2); + @include type(headline3); color: on(dark, disabled); } @@ -1783,15 +1785,15 @@ StScrollBar { padding: 0 8px; border-radius: $corner-radius; background-color: transparent; - color: $text-secondary; + color: $primary; font-weight: 500; &:first-child { border-radius: $corner-radius; } &:last-child { border-radius: $corner-radius; } - &:hover, &focus { background-color: $overlay-hover; color: $text; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } &:active { transition-duration: $duration-ripple; - background-color: $overlay-active; - color: $text; + background-color: $primary-overlay-active; } } } @@ -1826,7 +1828,7 @@ StScrollBar { } .chat-meta-message { padding-left: 4px; - @include font(caption); + @include type(caption); color: $text-secondary; &:rtl { padding-left: 0; padding-right: 4px; } } @@ -2012,13 +2014,16 @@ StScrollBar { .modal-dialog-button-box { spacing: 3px; } .modal-dialog-button { - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; @include button(flat-normal, $tc: on($os-background)); &:hover,&:focus { @include button(flat-hover, $tc: on($os-background)); } &:active { @include button(flat-active, $tc: on($os-background)); } &:insensitive { @include button(flat-insensitive, $tc: on($os-background)); } &:default { + min-width: 64px - 16px * 2; + padding: 0 16px; @include button(normal, $c: $suggested, $tc: on($suggested)); &:hover,&:focus { @include button(hover, $c: $suggested, $tc: on($suggested)); } &:active { @include button(active, $c: $suggested, $tc: on($suggested)); } @@ -2096,7 +2101,7 @@ StScrollBar { .login-dialog-username, .user-widget-label { color: on($os-background); - @include font(title); + @include type(headline6); text-align: left; padding-left: 15px; } @@ -2151,11 +2156,11 @@ StScrollBar { } .screen-shield-clock-time { - @include font(display-4); + @include type(headline1); text-shadow: $shadow-1; } -.screen-shield-clock-date { @include font(display-2); } +.screen-shield-clock-date { @include type(headline4); } .screen-shield-notifications-container { spacing: 6px; @@ -2279,10 +2284,11 @@ StScrollBar { .lg-obj-inspector-button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border: none; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -2305,7 +2311,7 @@ StScrollBar { } .lg-extension-name { - @include font(headline); + @include type(headline5); } .lg-extension-meta { diff --git a/src/_sass/gnome-shell/_common-3.28.scss b/src/_sass/gnome-shell/_common-3.28.scss index 1ce88f948..6801911d6 100644 --- a/src/_sass/gnome-shell/_common-3.28.scss +++ b/src/_sass/gnome-shell/_common-3.28.scss @@ -27,7 +27,7 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT"; /* GLOBALS */ stage { font-family: $font-family; - @include font(body-1); + @include type(body2); color: $text; } @@ -36,10 +36,11 @@ stage { /* Buttons */ .button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -50,12 +51,13 @@ stage { .modal-dialog-linked-button { min-height: $medium-size; + min-width: 64px - 8px * 2; margin: $container-padding; padding: 0 8px; margin-right: 0; border-right-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -86,7 +88,7 @@ StEntry { color: $text; selection-background-color: $overlay-selected; selected-color: $text; - @include font(subheading); + @include type(body1); @include entry(normal); &:hover { @include entry(hover);} &:focus { @include entry(focus);} @@ -229,7 +231,7 @@ StScrollBar { /* Modal Dialogs */ -.headline { @include font(title); } +.headline { @include type(headline6); } .lightbox { background-color: black; } .flashspot { background-color: white; } @@ -259,7 +261,7 @@ StScrollBar { .mount-dialog-subject, .end-session-dialog-subject { //this should be a generic header class - @include font(title); + @include type(headline6); } /* Message Dialog */ @@ -284,7 +286,7 @@ StScrollBar { .message-dialog-subtitle { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -432,7 +434,7 @@ StScrollBar { .message-dialog-main-layout { spacing: 24px; padding: 10px; } .message-dialog-content { spacing: 16px; } - .message-dialog-title { @include font(title); color: $text; } + .message-dialog-title { @include type(headline6); color: $text; } } .prompt-dialog-description:rtl { @@ -621,7 +623,7 @@ StScrollBar { } .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; // This is necessary for the weird bug: materia-theme#296 -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -663,7 +665,7 @@ StScrollBar { min-width: 64px; min-height: 64px; - .osd-monitor-label { @include font(display-2); } + .osd-monitor-label { @include type(headline3); } .level { height: 8px; border-radius: 0; @@ -745,7 +747,7 @@ StScrollBar { } .input-source-switcher-symbol { - @include font(display-2); + @include type(headline3); width: 96px; height: 96px; } @@ -848,8 +850,8 @@ StScrollBar { } .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: $panel-button-hpadding; + -minimum-hpadding: $panel-button-hpadding / 2; font-weight: bold; color: on($scrim, secondary); text-shadow: none; @@ -1015,7 +1017,7 @@ StScrollBar { } .datemenu-today-button .date-label { - @include font(title); + @include type(headline6); } .world-clocks-header, @@ -1068,7 +1070,7 @@ StScrollBar { .calendar-day-base { transition-duration: $duration; - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; padding: 0; @@ -1093,7 +1095,7 @@ StScrollBar { border-radius: 100px; background-color: transparent; color: $text-disabled; - @include font(caption); + @include type(caption); font-weight: bold; text-align: center; } @@ -1123,7 +1125,6 @@ StScrollBar { } .calendar-other-month-day { color: $text-secondary-disabled; - opacity: 0.5; } .calendar-week-number { width: $menuitem-size; height: $menuitem-size - 7px; @@ -1144,8 +1145,9 @@ StScrollBar { .message-list-clear-button.button { background-color: transparent; - &:hover,&:focus { background-color: $overlay-hover; } - &:active { background-color: $overlay-active; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } + &:active { background-color: $primary-overlay-active; } margin: 8px 8px 0; } @@ -1381,7 +1383,7 @@ StScrollBar { .nm-dialog-airplane-text { color: $text; } .nm-dialog-header-icon { icon-size: 32px; } .nm-dialog-scroll-view { border: none; } - .nm-dialog-header { @include font(title); } + .nm-dialog-header { @include type(headline6); } .nm-dialog-item { transition-duration: $duration; @@ -1488,7 +1490,7 @@ StScrollBar { .search-section-separator { height: 1px; background-color: on(dark, divider); } .list-search-result-content { spacing: 30px; } - .list-search-result-title { @include font(subheading); color: on(dark); spacing: 12px; } + .list-search-result-title { @include type(subtitle1); color: on(dark); spacing: 12px; } .list-search-result-description { color: on(dark, secondary); } .list-search-provider-details { width: 150px; color: on(dark, secondary); margin-top: 0.24em; } .list-search-provider-content { spacing: 20px; } @@ -1562,7 +1564,7 @@ StScrollBar { padding-bottom: 32px; } .app-view-control { //favorties | all toggle button - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: on(dark, secondary); &:hover { @@ -1746,7 +1748,7 @@ StScrollBar { } %status_text { - @include font(display-2); + @include type(headline3); color: on(dark, disabled); } @@ -1783,15 +1785,15 @@ StScrollBar { padding: 0 8px; border-radius: $corner-radius; background-color: transparent; - color: $text-secondary; + color: $primary; font-weight: 500; &:first-child { border-radius: $corner-radius; } &:last-child { border-radius: $corner-radius; } - &:hover, &focus { background-color: $overlay-hover; color: $text; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } &:active { transition-duration: $duration-ripple; - background-color: $overlay-active; - color: $text; + background-color: $primary-overlay-active; } } } @@ -1826,7 +1828,7 @@ StScrollBar { } .chat-meta-message { padding-left: 4px; - @include font(caption); + @include type(caption); color: $text-secondary; &:rtl { padding-left: 0; padding-right: 4px; } } @@ -1891,7 +1893,7 @@ StScrollBar { //Keyboard /* On-screen Keyboard */ .word-suggestions { - @include font(subheading); + @include type(subtitle1); spacing: 12px; min-height: 20pt; } @@ -2042,13 +2044,16 @@ StScrollBar { .modal-dialog-button-box { spacing: 3px; } .modal-dialog-button { - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; @include button(flat-normal, $tc: on($os-background)); &:hover,&:focus { @include button(flat-hover, $tc: on($os-background)); } &:active { @include button(flat-active, $tc: on($os-background)); } &:insensitive { @include button(flat-insensitive, $tc: on($os-background)); } &:default { + min-width: 64px - 16px * 2; + padding: 0 16px; @include button(normal, $c: $suggested, $tc: on($suggested)); &:hover,&:focus { @include button(hover, $c: $suggested, $tc: on($suggested)); } &:active { @include button(active, $c: $suggested, $tc: on($suggested)); } @@ -2126,7 +2131,7 @@ StScrollBar { .login-dialog-username, .user-widget-label { color: on($os-background); - @include font(title); + @include type(headline6); text-align: left; padding-left: 15px; } @@ -2181,11 +2186,11 @@ StScrollBar { } .screen-shield-clock-time { - @include font(display-4); + @include type(headline1); text-shadow: $shadow-1; } -.screen-shield-clock-date { @include font(display-2); } +.screen-shield-clock-date { @include type(headline4); } .screen-shield-notifications-container { spacing: 6px; @@ -2309,10 +2314,11 @@ StScrollBar { .lg-obj-inspector-button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border: none; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -2335,7 +2341,7 @@ StScrollBar { } .lg-extension-name { - @include font(headline); + @include type(headline5); } .lg-extension-meta { diff --git a/src/_sass/gnome-shell/_common-3.30.scss b/src/_sass/gnome-shell/_common-3.30.scss index d9e5d5ee3..3a0e49ae4 100644 --- a/src/_sass/gnome-shell/_common-3.30.scss +++ b/src/_sass/gnome-shell/_common-3.30.scss @@ -27,7 +27,7 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT"; /* GLOBALS */ stage { font-family: $font-family; - @include font(body-1); + @include type(body2); color: $text; } @@ -36,10 +36,11 @@ stage { /* Buttons */ .button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:focus { @include button(flat-focus); } &:hover { @include button(flat-hover); } @@ -49,12 +50,13 @@ stage { .modal-dialog-linked-button { min-height: $medium-size; + min-width: 64px - 8px * 2; margin: $container-padding; padding: 0 8px; margin-right: 0; border-right-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:focus { @include button(flat-focus); } &:hover { @include button(flat-hover); } @@ -85,7 +87,7 @@ StEntry { color: $text; selection-background-color: $overlay-selected; selected-color: $text; - @include font(subheading); + @include type(body1); @include entry(normal); &:hover { @include entry(hover);} &:focus { @include entry(focus);} @@ -231,7 +233,7 @@ StScrollBar { /* Modal Dialogs */ -.headline { @include font(title); } +.headline { @include type(headline6); } .lightbox { background-color: black; } .flashspot { background-color: white; } @@ -261,7 +263,7 @@ StScrollBar { .mount-dialog-subject, .end-session-dialog-subject { //this should be a generic header class - @include font(title); + @include type(headline6); } /* Message Dialog */ @@ -286,7 +288,7 @@ StScrollBar { .message-dialog-subtitle { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -434,7 +436,7 @@ StScrollBar { .message-dialog-main-layout { spacing: 24px; padding: 10px; } .message-dialog-content { spacing: 16px; } - .message-dialog-title { @include font(title); color: $text; } + .message-dialog-title { @include type(headline6); color: $text; } } .prompt-dialog-description:rtl { @@ -623,7 +625,7 @@ StScrollBar { } .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; // This is necessary for the weird bug: materia-theme#296 -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -665,7 +667,7 @@ StScrollBar { min-width: 64px; min-height: 64px; - .osd-monitor-label { @include font(display-2); } + .osd-monitor-label { @include type(headline3); } .level { height: 8px; -barlevel-height: 8px; @@ -745,7 +747,7 @@ StScrollBar { } .input-source-switcher-symbol { - @include font(display-2); + @include type(headline3); width: 96px; height: 96px; } @@ -849,8 +851,8 @@ StScrollBar { } .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: $panel-button-hpadding; + -minimum-hpadding: $panel-button-hpadding / 2; font-weight: bold; color: on($scrim, secondary); text-shadow: none; @@ -1018,7 +1020,7 @@ StScrollBar { } .datemenu-today-button .date-label { - @include font(title); + @include type(headline6); } .world-clocks-header, @@ -1071,7 +1073,7 @@ StScrollBar { .calendar-day-base { transition-duration: $duration; - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; padding: 0; @@ -1097,7 +1099,7 @@ StScrollBar { border-radius: 100px; background-color: transparent; color: $text-disabled; - @include font(caption); + @include type(caption); font-weight: bold; text-align: center; } @@ -1127,7 +1129,6 @@ StScrollBar { } .calendar-other-month-day { color: $text-secondary-disabled; - opacity: 0.5; } .calendar-week-number { width: $menuitem-size; height: $menuitem-size - 7px; @@ -1148,8 +1149,9 @@ StScrollBar { .message-list-clear-button.button { background-color: transparent; - &:hover,&:focus { background-color: $overlay-hover; } - &:active { background-color: $overlay-active; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } + &:active { background-color: $primary-overlay-active; } margin: 8px 8px 0; } @@ -1386,7 +1388,7 @@ StScrollBar { .nm-dialog-airplane-text { color: $text; } .nm-dialog-header-icon { icon-size: 32px; } .nm-dialog-scroll-view { border: none; } - .nm-dialog-header { @include font(title); } + .nm-dialog-header { @include type(headline6); } .nm-dialog-item { transition-duration: $duration; @@ -1493,7 +1495,7 @@ StScrollBar { .search-section-separator { height: 1px; background-color: on(dark, divider); } .list-search-result-content { spacing: 30px; } - .list-search-result-title { @include font(subheading); color: on(dark); spacing: 12px; } + .list-search-result-title { @include type(subtitle1); color: on(dark); spacing: 12px; } .list-search-result-description { color: on(dark, secondary); } .list-search-provider-details { width: 150px; color: on(dark, secondary); margin-top: 0.24em; } .list-search-provider-content { spacing: 20px; } @@ -1567,7 +1569,7 @@ StScrollBar { padding-bottom: 32px; } .app-view-control { //favorties | all toggle button - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: on(dark, secondary); &:hover { @@ -1751,7 +1753,7 @@ StScrollBar { } %status_text { - @include font(display-2); + @include type(headline3); color: on(dark, disabled); } @@ -1788,15 +1790,15 @@ StScrollBar { padding: 0 8px; border-radius: $corner-radius; background-color: transparent; - color: $text-secondary; + color: $primary; font-weight: 500; &:first-child { border-radius: $corner-radius; } &:last-child { border-radius: $corner-radius; } - &:hover, &focus { background-color: $overlay-hover; color: $text; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } &:active { transition-duration: $duration-ripple; - background-color: $overlay-active; - color: $text; + background-color: $primary-overlay-active; } } } @@ -1831,7 +1833,7 @@ StScrollBar { } .chat-meta-message { padding-left: 4px; - @include font(caption); + @include type(caption); color: $text-secondary; &:rtl { padding-left: 0; padding-right: 4px; } } @@ -1896,7 +1898,7 @@ StScrollBar { //Keyboard /* On-screen Keyboard */ .word-suggestions { - @include font(subheading); + @include type(subtitle1); spacing: 12px; min-height: 20pt; } @@ -2047,13 +2049,16 @@ StScrollBar { .modal-dialog-button-box { spacing: 3px; } .modal-dialog-button { - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; @include button(flat-normal, $tc: on($os-background)); &:hover,&:focus { @include button(flat-hover, $tc: on($os-background)); } &:active { @include button(flat-active, $tc: on($os-background)); } &:insensitive { @include button(flat-insensitive, $tc: on($os-background)); } &:default { + min-width: 64px - 16px * 2; + padding: 0 16px; @include button(normal, $c: $suggested, $tc: on($suggested)); &:hover,&:focus { @include button(hover, $c: $suggested, $tc: on($suggested)); } &:active { @include button(active, $c: $suggested, $tc: on($suggested)); } @@ -2130,7 +2135,7 @@ StScrollBar { .login-dialog-username, .user-widget-label { color: on($os-background); - @include font(title); + @include type(headline6); text-align: left; padding-left: 15px; } @@ -2185,12 +2190,12 @@ StScrollBar { } .screen-shield-clock-time { - @include font(display-4); + @include type(headline1); text-shadow: $shadow-1; font-feature-settings: "tnum"; } -.screen-shield-clock-date { @include font(display-2); } +.screen-shield-clock-date { @include type(headline4); } .screen-shield-notifications-container { spacing: 6px; @@ -2314,10 +2319,11 @@ StScrollBar { .lg-obj-inspector-button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border: none; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -2340,7 +2346,7 @@ StScrollBar { } .lg-extension-name { - @include font(headline); + @include type(headline5); } .lg-extension-meta { diff --git a/src/_sass/gnome-shell/_common-3.32.scss b/src/_sass/gnome-shell/_common-3.32.scss index b23cc8bb1..6bb6d3045 100644 --- a/src/_sass/gnome-shell/_common-3.32.scss +++ b/src/_sass/gnome-shell/_common-3.32.scss @@ -27,7 +27,7 @@ $cakeisalie: "This stylesheet is generated, DO NOT EDIT"; /* GLOBALS */ stage { font-family: $font-family; - @include font(body-1); + @include type(body2); color: $text; } @@ -36,10 +36,11 @@ stage { /* Buttons */ .button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:focus { @include button(flat-focus); } &:hover { @include button(flat-hover); } @@ -49,12 +50,13 @@ stage { .modal-dialog-linked-button { min-height: $medium-size; + min-width: 64px - 8px * 2; margin: $container-padding; padding: 0 8px; margin-right: 0; border-right-width: 0; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:focus { @include button(flat-focus); } &:hover { @include button(flat-hover); } @@ -85,7 +87,7 @@ StEntry { color: $text; selection-background-color: $overlay-selected; selected-color: $text; - @include font(subheading); + @include type(body1); @include entry(normal); &:hover { @include entry(hover);} &:focus { @include entry(focus);} @@ -226,7 +228,7 @@ StScrollBar { /* Modal Dialogs */ -.headline { @include font(title); } +.headline { @include type(headline6); } .lightbox { background-color: black; } .flashspot { background-color: white; } @@ -256,7 +258,7 @@ StScrollBar { .mount-dialog-subject, .end-session-dialog-subject { //this should be a generic header class - @include font(title); + @include type(headline6); } /* Message Dialog */ @@ -281,7 +283,7 @@ StScrollBar { .message-dialog-subtitle { color: $text-secondary; - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -428,7 +430,7 @@ StScrollBar { .message-dialog-main-layout { spacing: 24px; padding: 10px; } .message-dialog-content { spacing: 16px; } - .message-dialog-title { @include font(title); color: $text; } + .message-dialog-title { @include type(headline6); color: $text; } } .prompt-dialog-description:rtl { @@ -618,17 +620,21 @@ StScrollBar { } .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; // This is necessary for the weird bug: materia-theme#296 -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; //dreaming. bug #689995 - margin: 5px 8px 8px; - background-color: $surface; - border-radius: $corner-radius; - box-shadow: $shadow-2; + + @at-root .popup-menu-content, + .candidate-popup-content { + margin: 5px 8px 8px; + background-color: $surface; + border-radius: $corner-radius; + box-shadow: $shadow-2; + } } .popup-separator-menu-item { @@ -660,7 +666,7 @@ StScrollBar { min-width: 64px; min-height: 64px; - .osd-monitor-label { @include font(display-2); } + .osd-monitor-label { @include type(headline3); } .level { height: 8px; -barlevel-height: 8px; @@ -740,7 +746,7 @@ StScrollBar { } .input-source-switcher-symbol { - @include font(display-2); + @include type(headline3); width: 96px; height: 96px; } @@ -844,8 +850,8 @@ StScrollBar { } .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: $panel-button-hpadding; + -minimum-hpadding: $panel-button-hpadding / 2; font-weight: bold; color: on($panel, secondary); text-shadow: none; @@ -1013,7 +1019,7 @@ StScrollBar { } .datemenu-today-button .date-label { - @include font(title); + @include type(headline6); } .world-clocks-header, @@ -1039,7 +1045,7 @@ StScrollBar { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } @@ -1066,8 +1072,7 @@ StScrollBar { .weather-forecast-time { color: $text-secondary; - font-size: 7pt; - font-weight: 400; + @include type(caption); } .calendar-month-label { @@ -1100,7 +1105,7 @@ StScrollBar { .calendar-day-base { transition-duration: $duration; - @include font(caption); + @include type(caption); text-align: center; width: $menuitem-size; height: $menuitem-size; padding: 0; @@ -1126,7 +1131,7 @@ StScrollBar { border-radius: 100px; background-color: transparent; color: $text-disabled; - @include font(caption); + @include type(caption); font-weight: bold; text-align: center; } @@ -1156,7 +1161,6 @@ StScrollBar { } .calendar-other-month-day { color: $text-secondary-disabled; - opacity: 0.5; } .calendar-week-number { width: $menuitem-size; height: $menuitem-size - 7px; @@ -1177,8 +1181,9 @@ StScrollBar { .message-list-clear-button.button { background-color: transparent; - &:hover,&:focus { background-color: $overlay-hover; } - &:active { background-color: $overlay-active; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } + &:active { background-color: $primary-overlay-active; } margin: 8px 8px 0; } @@ -1369,8 +1374,14 @@ StScrollBar { background-image: none; } +// Rubberband for select-area screenshots +.select-area-rubberband { + background-color: rgba($primary-light, 0.3); + border: 1px solid $primary-light; +} + // not really top bar only -.popup-menu-arrow { width: 16px; height: 16px; icon-size: em(16px); } +.popup-menu-arrow { icon-size: em(16px); } .popup-menu-icon { icon-size: em(16px); } //close buttons @@ -1434,7 +1445,7 @@ StScrollBar { .nm-dialog-airplane-text { color: $text; } .nm-dialog-header-icon { icon-size: 32px; } .nm-dialog-scroll-view { border: none; } - .nm-dialog-header { @include font(title); } + .nm-dialog-header { @include type(headline6); } .nm-dialog-item { transition-duration: $duration; @@ -1543,7 +1554,7 @@ StScrollBar { .search-section:last-child .search-section-separator { background-color: transparent; } .list-search-result-content { spacing: 30px; } - .list-search-result-title { @include font(subheading); color: on(dark); spacing: 12px; } + .list-search-result-title { @include type(subtitle1); color: on(dark); spacing: 12px; } .list-search-result-description { color: on(dark, secondary); } .list-search-provider-details { width: 150px; color: on(dark, secondary); margin-top: 0.24em; } .list-search-provider-content { spacing: 20px; } @@ -1617,7 +1628,7 @@ StScrollBar { padding-bottom: 32px; } .app-view-control { //favorties | all toggle button - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: on(dark, secondary); &:hover { @@ -1806,7 +1817,7 @@ StScrollBar { } %status_text { - @include font(display-2); + @include type(headline3); color: on(dark, disabled); } @@ -1843,15 +1854,15 @@ StScrollBar { padding: 0 8px; border-radius: $corner-radius; background-color: transparent; - color: $text-secondary; + color: $primary; font-weight: 500; &:first-child { border-radius: $corner-radius; } &:last-child { border-radius: $corner-radius; } - &:hover, &focus { background-color: $overlay-hover; color: $text; } + &:focus { background-color: $primary-overlay-focus; } + &:hover { background-color: $primary-overlay-hover; } &:active { transition-duration: $duration-ripple; - background-color: $overlay-active; - color: $text; + background-color: $primary-overlay-active; } } } @@ -1886,7 +1897,7 @@ StScrollBar { } .chat-meta-message { padding-left: 4px; - @include font(caption); + @include type(caption); color: $text-secondary; &:rtl { padding-left: 0; padding-right: 4px; } } @@ -1951,7 +1962,7 @@ StScrollBar { //Keyboard /* On-screen Keyboard */ .word-suggestions { - @include font(subheading); + @include type(subtitle1); spacing: 12px; min-height: 20pt; } @@ -2128,13 +2139,16 @@ StScrollBar { .modal-dialog-button-box { spacing: 3px; } .modal-dialog-button { - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; @include button(flat-normal, $tc: on($os-background)); &:hover,&:focus { @include button(flat-hover, $tc: on($os-background)); } &:active { @include button(flat-active, $tc: on($os-background)); } &:insensitive { @include button(flat-insensitive, $tc: on($os-background)); } &:default { + min-width: 64px - 16px * 2; + padding: 0 16px; @include button(normal, $c: $suggested, $tc: on($suggested)); &:hover,&:focus { @include button(hover, $c: $suggested, $tc: on($suggested)); } &:active { @include button(active, $c: $suggested, $tc: on($suggested)); } @@ -2211,7 +2225,7 @@ StScrollBar { .login-dialog-username, .user-widget-label { color: on($os-background); - @include font(title); + @include type(headline6); text-align: left; padding-left: 15px; } @@ -2266,12 +2280,12 @@ StScrollBar { } .screen-shield-clock-time { - @include font(display-4); + @include type(headline1); text-shadow: $shadow-1; font-feature-settings: "tnum"; } -.screen-shield-clock-date { @include font(display-2); } +.screen-shield-clock-date { @include type(headline4); } .screen-shield-notifications-container { spacing: 6px; @@ -2395,10 +2409,11 @@ StScrollBar { .lg-obj-inspector-button { min-height: $medium-size; - padding: 0 16px; + min-width: 64px - 8px * 2; + padding: 0 8px; border: none; border-radius: $corner-radius; - @include font(button); + @include type(button); @include button(flat-normal); &:hover { @include button(flat-hover); } &:active { @include button(flat-active); } @@ -2421,7 +2436,7 @@ StScrollBar { } .lg-extension-name { - @include font(headline); + @include type(headline5); } .lg-extension-meta { diff --git a/src/_sass/gnome-shell/_drawing.scss b/src/_sass/gnome-shell/_drawing.scss index 83dafd7ca..c2f0c897b 100644 --- a/src/_sass/gnome-shell/_drawing.scss +++ b/src/_sass/gnome-shell/_drawing.scss @@ -12,77 +12,89 @@ // Typography // based on: -// https://material.io/guidelines/style/typography.html#typography-styles +// https://material.io/design/typography/the-type-system.html -@mixin font($size) { - @if $size == display-4 { +@mixin type($style) { + @if $style == headline1 { // font-family: $font-family-large; - font-size: 112px; + font-size: 96px; font-weight: 300; // line-height: 1; } - @if $size == display-3 { + @if $style == headline2 { // font-family: $font-family-large; - font-size: 56px; - font-weight: 400; + font-size: 60px; + font-weight: 300; // line-height: 1; } - @if $size == display-2 { + @if $style == headline3 { // font-family: $font-family-large; - font-size: 45px; + font-size: 48px; font-weight: 400; - // line-height: 48px; + // line-height: 50px; } - @if $size == display-1 { + @if $style == headline4 { // font-family: $font-family-large; font-size: 34px; font-weight: 400; // line-height: 40px; } - @if $size == headline { + @if $style == headline5 { font-size: pt(24px); font-weight: 400; // line-height: 32px; } - @if $size == title { + @if $style == headline6 { font-size: pt(20px); font-weight: 500; - // line-height: 1; + // line-height: 32px; } - @if $size == subheading { + @if $style == subtitle1 { font-size: pt($font-size-subheading); font-weight: 400; - // line-height: 24px; + // line-height: 28px; } - @if $size == body-2 { + @if $style == subtitle2 { font-size: pt($font-size); font-weight: 500; + // line-height: 22px; + } + + @if $style == body1 { + font-size: pt($font-size-subheading); + font-weight: 400; // line-height: 24px; } - @if $size == body-1 { + @if $style == body2 { font-size: pt($font-size); font-weight: 400; // line-height: 20px; } - @if $size == caption { + @if $style == caption { font-size: pt(12px); font-weight: 400; - // line-height: 1; + // line-height: 20px; } - @if $size == button { + @if $style == button { font-size: pt($font-size); font-weight: 500; - // line-height: 20px; + // line-height: 36px; + } + + @if $style == overline { + font-size: pt(12px); + font-weight: 400; + // line-height: 32px; } } @@ -174,7 +186,7 @@ } @if $t == flat-normal { - color: if($tc != on(dark), $text-secondary, on(dark, secondary)); + color: if($tc != on(dark), $primary, on(dark, secondary)); background-color: transparent; border-color: transparent; box-shadow: $shadow-0; @@ -184,15 +196,16 @@ } @if $t == flat-focus { - color: if($tc != on(dark), $text, on(dark)); + color: if($tc != on(dark), $primary, on(dark)); + background-color: if($tc != on(dark), $primary-overlay-focus, $inverse-overlay-focus); text-shadow: none; icon-shadow: none; box-shadow: $shadow-0; } @if $t == flat-hover { - color: if($tc != on(dark), $text, on(dark)); - background-color: if($tc != on(dark), $overlay-hover, $inverse-overlay-hover); + color: if($tc != on(dark), $primary, on(dark)); + background-color: if($tc != on(dark), $primary-overlay-hover, $inverse-overlay-hover); border-color: transparent; box-shadow: $shadow-0; text-shadow: none; @@ -200,8 +213,8 @@ } @if $t == flat-active { - color: if($tc != on(dark), $text, on(dark)); - background-color: if($tc != on(dark), $overlay-active, $inverse-overlay-active); + color: if($tc != on(dark), $primary, on(dark)); + background-color: if($tc != on(dark), $primary-overlay-active, $inverse-overlay-active); border-color: transparent; box-shadow: $shadow-0; text-shadow: none; diff --git a/src/_sass/gnome-shell/_extensions.scss b/src/_sass/gnome-shell/_extensions.scss index 9e3cb1620..039363eff 100644 --- a/src/_sass/gnome-shell/_extensions.scss +++ b/src/_sass/gnome-shell/_extensions.scss @@ -61,14 +61,26 @@ padding: 6px 6px 6px 3px; } +// Running and focused application style + +#dashtodockContainer .focused .overview-icon { + background-color: $overlay-checked; +} + +// Remove background-color if the indicator style is default +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } +// Default running and focused application style @each $p, $pt in ('.left', 'left'), ('.right', 'right'), ('.top', 'top'), @@ -79,7 +91,7 @@ ('.running4', 'running4') { @each $f, $fc in ('', ''), ('.focused', '-focused') { - #dashtodockContainer#{$p} .dash-item-container > StWidget#{$n}#{$f} { + #dashtodockContainer#{$p} .default#{$n}#{$f} { background-image: url("assets/dash/#{$pt}-#{$nb}#{$fc}.svg"); } } diff --git a/src/_sass/gnome-shell/_variables.scss b/src/_sass/gnome-shell/_variables.scss index a6e7c08e8..788504f07 100644 --- a/src/_sass/gnome-shell/_variables.scss +++ b/src/_sass/gnome-shell/_variables.scss @@ -1,42 +1,63 @@ -// font families +// +// Font families +// + $font-family: Open Sans, Cantarell, Sans-Serif; $font-family-large: Open Sans, Cantarell, Sans-Serif; -// font sizes +// +// Font sizes +// + $font-size: if($compact == 'false', 14px, 13px); $font-size-subheading: if($compact == 'false', 16px, 15px); +// // Override sizes $menuitem-size: if($compact == 'false', 30px, 25px); -// durations -$duration-panel: 250ms; +$menuitem-size: if($compact == 'false', 32px, 28px); +$panel-button-hpadding: if($compact == 'false', 12px, 8px); +// // Override durations; since St does not support transition-timing-function +// + $duration: 100ms; $duration-ripple: 200ms; +$duration-panel: 250ms; -// shadows +// +// Override shadows +// // This should be none, but it's creating some issues with borders, so to // workaround it for now, use inset wich goes through a different code path. // see https://bugzilla.gnome.org/show_bug.cgi?id=752934 $shadow-0: 0 0 transparent; -// Override shadows $shadow-1: 0 1px 1.5px rgba(black, 0.12), 0 1px 1px rgba(black, 0.24); $shadow-2: 0 3px 3px rgba(black, 0.16 * 1.5), 0 3px 3px rgba(black, 0.23 * 1.5); $shadow-3: 0 10px 10px rgba(black, 0.19 * 1.5), 0 6px 3px rgba(black, 0.23 * 1.5); $shadow-4: 0 14px 14px rgba(black, 0.25 * 2), 0 10px 5px rgba(black, 0.22 * 2); $shadow-5: 0 19px 19px rgba(black, 0.30 * 2), 0 15px 6px rgba(black, 0.22 * 2); -// Override overlay colors; since St does not support alpha() function +// +// Override overlay colors; since St does not support GTK-specific alpha() function +// + $overlay-hover: rgba($text, 0.08); $overlay-focus: rgba($text, 0.12); $overlay-focus-hover: rgba($text, 0.16); $overlay-active: rgba($text, 0.12 + 0.08); $overlay-checked: rgba($text, 0.12); +$primary-overlay-hover: rgba($primary, 0.08); +$primary-overlay-focus: rgba($primary, 0.12); +$primary-overlay-focus-hover: rgba($primary, 0.16); +$primary-overlay-active: rgba($primary, 0.12 + 0.08); +$primary-overlay-checked: rgba($primary, 0.12); + $inverse-overlay-hover: rgba(on(dark), 0.08); $inverse-overlay-focus: rgba(on(dark), 0.12); $inverse-overlay-focus-hover: rgba(on(dark), 0.16); diff --git a/src/_sass/gtk/_common-3.20.scss b/src/_sass/gtk/_common-3.20.scss index 8a5122bec..4cff76494 100644 --- a/src/_sass/gtk/_common-3.20.scss +++ b/src/_sass/gtk/_common-3.20.scss @@ -154,6 +154,12 @@ label { tab &, button & { color: inherit; } } + + &.osd { + border-radius: $corner-radius; + background-color: $tooltip; + color: on($tooltip); + } } .dim-label { color: $text-secondary; } @@ -449,7 +455,7 @@ button { @extend %circular_button; } - // NOTE: sometimes image-only buttons use this + // NOTE: Some image-only buttons use this as well &.text-button.image-button { min-width: 24px; padding: ($medium-size - 24px) / 2; @@ -473,13 +479,13 @@ button { .linked:not(.vertical) > & { @extend %linked; - &.image-button { @extend %linked-image-button; } + &.image-button:not(.text-button) { @extend %linked-image-button; } } .linked.vertical > & { @extend %linked-vertical; - &.image-button { @extend %linked-vertical-image-button; } + &.image-button:not(.text-button) { @extend %linked-vertical-image-button; } } .linked:not(.vertical) > &.flat, @@ -487,14 +493,12 @@ button { &:not(:only-child) { // specificity bump border-radius: $corner-radius; - &.image-button { border-radius: $circular-radius; } - - &.text-button.image-button { border-radius: $corner-radius; } + &.image-button:not(.text-button) { border-radius: $circular-radius; } } } } - @at-root %button_selected { + @at-root %button-on-dark { &.flat { color: on(dark, secondary); @@ -957,10 +961,10 @@ toolbar { transition: $transition-shadow; padding: $container-padding; border-radius: $corner-radius; - box-shadow: $shadow-2, inset 0 1px highlight($surface); + box-shadow: $shadow-z4, inset 0 1px highlight($surface); background-color: $surface; - &:backdrop { box-shadow: $shadow-1, inset 0 1px highlight($surface); } + &:backdrop { box-shadow: $shadow-z2, inset 0 1px highlight($surface); } &.left, &.right, @@ -1036,7 +1040,7 @@ searchbar > revealer > box { .titlebar { transition: background-color $duration $ease-out, color $duration $ease-out; border-radius: $corner-radius $corner-radius 0 0; - box-shadow: $shadow-1, inset 0 1px highlight($titlebar); + box-shadow: $shadow-z1, inset 0 1px highlight($titlebar); background-color: $titlebar; color: $titlebar-text; @@ -1164,7 +1168,7 @@ searchbar > revealer > box { // but let's keep it for backwards compatibility. transition: background-color 0.1ms $ripple-fade-in-duration, color $duration $ease-out; animation: ripple-on-headerbar $ripple-fade-in-duration $ease-out; - box-shadow: $shadow-1, inset 0 1px highlight($primary); + box-shadow: $shadow-z1, inset 0 1px highlight($primary); background-color: $primary; color: on($primary); @@ -1230,7 +1234,7 @@ searchbar > revealer > box { .maximized &, .fullscreen & { border-radius: 0; - box-shadow: $shadow-1; + box-shadow: $shadow-z1; } &.default-decoration { @@ -1259,7 +1263,7 @@ searchbar > revealer > box { // margin-right: -2px; // margin-top: -2px; border-radius: 0; - box-shadow: $shadow-1; // Remove highlight as window managers should have it + box-shadow: $shadow-z1; // Remove highlight as window managers should have it } } } @@ -1310,7 +1314,7 @@ window.devel .titlebar:not(.selection-mode) { * Pathbars * ************/ %pathbar_button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { @extend %button-flat; padding-left: ($medium-size - 24px) / 2; @@ -1601,10 +1605,10 @@ menuitem { popover.background { transition: $transition-shadow; padding: 2px; - box-shadow: $shadow-2; // TODO: this should really have a highlight + box-shadow: $shadow-z4; // TODO: this should really have a highlight background-color: $surface; - &:backdrop { box-shadow: $shadow-1; } + &:backdrop { box-shadow: $shadow-z2; } &, .csd & { border-style: solid; @@ -1640,7 +1644,7 @@ popover.background { &.menu button, button.model { - @extend %button-flat; + @extend %button_basic.flat; min-height: 32px; padding: 0 8px; @@ -1921,7 +1925,6 @@ scrollbar { transition: $transition; background-color: $base; - background-clip: $background-clip-extra; // scrollbar border &.top { border-bottom: 1px solid $divider; } @@ -2000,7 +2003,7 @@ scrollbar { } &.dragging, - &.hovering { background-color: rgba($base, 0.9); } + &.hovering { background-color: rgba($surface, 0.9); } } &.horizontal slider { min-width: $_slider_min_length; } @@ -2066,15 +2069,15 @@ switch { margin: -3px -2px; border-radius: $circular-radius; outline: none; - box-shadow: 0 0 0 10px transparent, $shadow-1; + box-shadow: 0 0 0 10px transparent, $shadow-z1; background-color: $surface; } - &:focus slider { box-shadow: 0 0 0 10px $overlay-focus, $shadow-1; } + &:focus slider { box-shadow: 0 0 0 10px $overlay-focus, $shadow-z1; } - &:hover slider { box-shadow: 0 0 0 10px $overlay-hover, $shadow-1; } + &:hover slider { box-shadow: 0 0 0 10px $overlay-hover, $shadow-z1; } - &:focus:hover slider { box-shadow: 0 0 0 10px $overlay-focus-hover, $shadow-1; } + &:focus:hover slider { box-shadow: 0 0 0 10px $overlay-focus-hover, $shadow-z1; } &:checked slider { background-color: $primary; @@ -2102,9 +2105,9 @@ switch { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: $shadow-1; + -gtk-icon-shadow: $icon-shadow-z2; - &:hover, &:active { -gtk-icon-shadow: $shadow-2; } + &:hover, &:active { -gtk-icon-shadow: $icon-shadow-z4; } @each $s, $as in ('', '-unchecked'), (':checked', '-checked') { @@ -2588,7 +2591,7 @@ levelbar { trough { // padding: 2px; // border-radius: $corner-radius; - // box-shadow: $shadow-1; + // box-shadow: $shadow-z1; // background-color: $base; // &:disabled { background-color: $base-alt; } @@ -2775,7 +2778,11 @@ row { margin: 8px; - button { @extend %button_basic.flat; } + button { + @extend %button_basic.flat; + + &.text-button:not(:disabled) { color: $primary; } + } &.frame, border { border-style: none; } @@ -2957,6 +2964,7 @@ stacksidebar.sidebar { &:selected { background-color: $overlay-checked; + color: $primary; font-weight: 500; } @@ -2986,8 +2994,11 @@ separator.sidebar { * File chooser * ****************/ // dim the sidebar icons, see bug #786613 for details on this oddity -row { - image.sidebar-icon { color: $text-secondary; } +row image.sidebar-icon { + transition: color $duration $ease-out; + color: $text-secondary; + + &:disabled { color: $text-secondary-disabled; } } placessidebar.sidebar { @@ -3008,7 +3019,10 @@ placessidebar.sidebar { &:selected { background-color: $overlay-checked; + color: $primary; font-weight: 500; + + image.sidebar-icon { color: $primary; } } &:disabled { color: $text-disabled; } @@ -3019,13 +3033,12 @@ placessidebar.sidebar { } label.sidebar-label { + color: inherit; + &:dir(ltr) { padding-right: 2px; } &:dir(rtl) { padding-left: 2px; } } - &:selected image.sidebar-icon, - &:selected label.sidebar-label { color: inherit; } - @at-root button.sidebar-button { @extend %button-flat-simple; @extend %small_button; @@ -3033,7 +3046,11 @@ placessidebar.sidebar { &.sidebar-placeholder-row { background-color: $overlay-hover; } - &.sidebar-new-bookmark-row { color: $primary; } + &.sidebar-new-bookmark-row { + color: $primary; + + image.sidebar-icon { color: $primary; } + } &:drop(active) { @extend row:hover; } } @@ -3127,14 +3144,9 @@ infobar { background-color: $base; button { - @extend %button-flat-simple; - - &.text-button { - padding-left: 8px; - padding-right: 8px; + @extend %button_basic.flat; - &:not(:disabled) { color: $primary; } - } + &.text-button:not(:disabled) { color: $primary; } } } @@ -3142,7 +3154,7 @@ infobar { background-color: $warning; color: on($warning); - // button { @extend %button_selected; } + // button { @extend %button-on-dark; } selection {} @@ -3153,7 +3165,7 @@ infobar { background-color: $error; color: on($error); - button { @extend %button_selected; } + button { @extend %button-on-dark; } selection {} @@ -3260,11 +3272,11 @@ colorswatch { overlay { transition: $transition-shadow; - box-shadow: $shadow-1; + box-shadow: $shadow-z1; - &:hover { box-shadow: $shadow-2; } + &:hover { box-shadow: $shadow-z3; } - &:drop(active) { box-shadow: $shadow-2; } + &:drop(active) { box-shadow: $shadow-z3; } } &#add-color-button { @@ -3292,7 +3304,7 @@ colorswatch { overlay { border-radius: $corner-radius; } - // overlay:hover { box-shadow: $shadow-1; } + // overlay:hover { box-shadow: $shadow-z1; } } } @@ -3300,10 +3312,10 @@ colorswatch { colorchooser .popover.osd { transition: $transition-shadow; border-radius: $corner-radius; - box-shadow: $shadow-2, inset 0 1px highlight($surface); + box-shadow: $shadow-z4, inset 0 1px highlight($surface); background-color: $surface; - &:backdrop { box-shadow: $shadow-1, inset 0 1px highlight($surface); } + &:backdrop { box-shadow: $shadow-z2, inset 0 1px highlight($surface); } } @@ -3336,7 +3348,7 @@ colorchooser .popover.osd { decoration { transition: $transition-shadow; border-radius: $corner-radius $corner-radius 0 0; - box-shadow: $shadow-4, 0 16px 16px transparent; + box-shadow: $shadow-z16, 0 16px (24px * .6) 2px transparent, 0 6px (30px * .6) 5px transparent; // FIXME rationalize shadows @@ -3348,7 +3360,7 @@ decoration { // change when we go to backdrop, to prevent jumping windows. // The biggest shadow should be in the same order then in the active state // or the jumping will happen during the transition. - box-shadow: $shadow-2, 0 16px 16px transparent; + box-shadow: $shadow-z4, 0 16px (24px * .6) 2px transparent, 0 6px (30px * .6) 5px transparent; } .maximized &, @@ -3366,7 +3378,7 @@ decoration { .csd.popup & { border-radius: $corner-radius; - box-shadow: $shadow-2; + box-shadow: $shadow-z4; } tooltip.csd & { @@ -3376,9 +3388,9 @@ decoration { messagedialog.csd & { border-radius: $corner-radius; - // box-shadow: $shadow-4, 0 16px 16px transparent; + // box-shadow: $shadow-z24, 0 24px (38px * .6) 3px transparent, 0 9px (46px * .6) 8px transparent; - // &:backdrop { box-shadow: $shadow-2, 0 16px 16px transparent; } + // &:backdrop { box-shadow: $shadow-z4, 0 24px (38px * .6) 3px transparent, 0 9px (46px * .6) 8px transparent; } } .solid-csd & { diff --git a/src/_sass/gtk/_drawing-3.20.scss b/src/_sass/gtk/_drawing-3.20.scss index 43a3ddf8b..0c74acc19 100644 --- a/src/_sass/gtk/_drawing-3.20.scss +++ b/src/_sass/gtk/_drawing-3.20.scss @@ -65,22 +65,22 @@ @if $t == raised-normal { transition: $transition; border-image: none; - box-shadow: $shadow-1; - background-color: if($fc == $primary, $base, $fc); + box-shadow: $shadow-z1; + background-color: if($fc == $primary, $surface, $fc); color: if($fc == $primary, $text, on($fc)); } @if $t == raised-hover { - box-shadow: $shadow-2; + box-shadow: $shadow-z3; } @if $t == raised-focus { border-image: none; - box-shadow: $shadow-2; + box-shadow: $shadow-z3; } @if $t == raised-disabled { - box-shadow: $shadow-1; + box-shadow: $shadow-z1; background-color: $base-alt; color: $text-disabled; } @@ -99,7 +99,7 @@ background-size $ripple-fade-out-duration $ease-out, background-image $ripple-fade-out-opacity-duration $ease-out; outline: none; - box-shadow: inset 0 0 0 9999px transparent, $shadow-1; + box-shadow: inset 0 0 0 9999px transparent, $shadow-z2; background-color: $surface; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; @@ -109,11 +109,11 @@ } @if $t == hover { - box-shadow: inset 0 0 0 9999px transparent, $shadow-2; + box-shadow: inset 0 0 0 9999px transparent, $shadow-z4; } @if $t == focus { - box-shadow: inset 0 0 0 9999px $overlay-focus, $shadow-2; + box-shadow: inset 0 0 0 9999px $overlay-focus, $shadow-z4; } @if $t == active { @@ -121,7 +121,7 @@ background-size 0ms, background-image 0ms; animation: ripple $ripple-fade-in-duration $ease-out forwards; - box-shadow: inset 0 0 0 9999px $overlay-hover, $shadow-2; + box-shadow: inset 0 0 0 9999px $overlay-hover, $shadow-z8; background-image: radial-gradient(circle, $overlay-active 10%, transparent 0%); background-size: 0% 0%; } @@ -240,7 +240,7 @@ // $_undershoot_color_dark: $track; - $_undershoot_color_light: rgba($base, 0.3); + $_undershoot_color_light: transparent; $_gradient_dir: left; $_dash_bg_size: 12px 1px; diff --git a/src/_sass/gtk/apps/_budgie.scss b/src/_sass/gtk/apps/_budgie.scss index 100042769..825eae5a2 100644 --- a/src/_sass/gtk/apps/_budgie.scss +++ b/src/_sass/gtk/apps/_budgie.scss @@ -23,7 +23,7 @@ border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: $corner-radius + 1px; - box-shadow: $shadow-2; + box-shadow: $shadow-z4; background-color: $surface; .container { padding: 2px; } @@ -219,7 +219,7 @@ button.raven-trigger { button { @extend %button-flat; - @extend %button_selected.flat; + @extend %button-on-dark.flat; min-height: 16px; min-width: 16px; @@ -311,7 +311,7 @@ button.raven-trigger { frame.raven-frame > border { border-style: none; - box-shadow: $shadow-4; + box-shadow: $shadow-z16; } $pos_list: ((top, bottom), (bottom, top), (left, right), (right, left)); @@ -424,7 +424,7 @@ calendar.raven-calendar { button.image-button { padding: ($large-size - 24px) / 2; - @extend %button_selected.flat; + @extend %button-on-dark.flat; } } @@ -461,7 +461,7 @@ calendar.raven-calendar { margin: 5px 9px; padding: 3px; border-radius: $corner-radius; - box-shadow: $shadow-2, inset 0 1px highlight($surface); + box-shadow: $shadow-z4, inset 0 1px highlight($surface); background-color: $surface; button { @extend %button-flat-simple; } diff --git a/src/_sass/gtk/apps/_gnome-3.22.scss b/src/_sass/gtk/apps/_gnome-3.22.scss index e3741733f..cd5ec60ea 100644 --- a/src/_sass/gtk/apps/_gnome-3.22.scss +++ b/src/_sass/gtk/apps/_gnome-3.22.scss @@ -24,7 +24,7 @@ .nautilus-desktop.nautilus-canvas-item { // background-color: $scrim; color: on(dark); - text-shadow: $shadow-1; + text-shadow: $text-shadow; } // Toolbar @@ -41,7 +41,7 @@ animation: nautilus-operations-button-needs-attention $ripple-fade-out-duration $ease 6 alternate; } -.linked > button:not(.suggested-action):not(.destructive-action).disclosure-button { @extend %circular_button; } +.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):not(:only-child).disclosure-button { @extend %circular_button; } // Path bar @@ -70,10 +70,12 @@ } // for 3.32 - .nautilus-path-bar button { + .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: ($medium-size - 24px) / 2; padding-right: ($medium-size - 24px) / 2; + &.text-button { min-width: 0; } + label:not(:only-child) { &:first-child { margin-left: 0; } @@ -95,8 +97,7 @@ border-width: 1px; border-color: $divider; border-radius: ($corner-radius + 1px) ($corner-radius + 1px) 0 0; - background-color: rgba($base, 0.9); - background-clip: $background-clip-extra; + background-color: rgba($surface, 0.9); &.bottom.left { // axes left border and border radius margin-right: 8px - 1px; @@ -217,7 +218,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal { .nautilus-window headerbar revealer > button { @extend %circular_button; } // Ensure paned separator rendering. See issue #84 for details. -.nautilus-window paned > separator { background-color: $background; } +.nautilus-window paned > separator { background-color: $base-alt; } /********* @@ -755,7 +756,7 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: $circular-radius; - box-shadow: $shadow-2; + box-shadow: $shadow-z4; background-color: $primary; color: on($primary); font-weight: bold; @@ -797,7 +798,7 @@ button.photos-filter-preview { image { color: on(dark); - -gtk-icon-shadow: $shadow-1; + -gtk-icon-shadow: $text-shadow; } } } diff --git a/src/_sass/gtk/apps/_lightdm.scss b/src/_sass/gtk/apps/_lightdm.scss index 53c29efe3..67964f24b 100644 --- a/src/_sass/gtk/apps/_lightdm.scss +++ b/src/_sass/gtk/apps/_lightdm.scss @@ -35,7 +35,7 @@ #restart_dialog { margin: 8px; border-radius: $corner-radius; - box-shadow: $shadow-2, inset 0 1px highlight($surface); + box-shadow: $shadow-z6, inset 0 1px highlight($surface); background-color: $surface; } @@ -58,7 +58,11 @@ #restart_dialog button { } -.lightdm-gtk-greeter button { @extend %button-flat-simple; } +.lightdm-gtk-greeter button { + @extend %button_basic.flat; + + &:not(:disabled) { color: $primary; } +} // the user's avatar box #user_image { diff --git a/src/_sass/gtk/apps/_mate.scss b/src/_sass/gtk/apps/_mate.scss index c7f1627ee..0c14094af 100644 --- a/src/_sass/gtk/apps/_mate.scss +++ b/src/_sass/gtk/apps/_mate.scss @@ -18,7 +18,7 @@ button { @extend %button-flat; - @extend %button_selected.flat; + @extend %button-on-dark.flat; min-height: 16px; min-width: 16px; @@ -313,6 +313,9 @@ na-tray-applet widget box widget { @extend %pathbar_button; + // NOTE: padding is hard-coded to 0 + &.slider-button { min-width: 24px; } + // arrow button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); @@ -342,7 +345,7 @@ na-tray-applet widget box widget { // window and desktop mode .caja-canvas-item { - // border-radius: $corner-radius; + border-radius: $corner-radius; } // desktop mode @@ -353,6 +356,27 @@ na-tray-applet widget box widget { .caja-desktop EelEditableLabel.entry { } +// override https://github.com/mate-desktop/caja/blob/master/data/caja.css +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: $corner-radius; + background-color: $fill; + background-image: none; + color: $text; + + &:selected { background-color: $overlay-selected; } +} + +.caja-desktop.view .entry { + background-color: $scrim-alt; + color: on(dark); + text-shadow: $text-shadow; + caret-color: currentColor; // this shouldn't be needed. + + &:selected { background-color: $overlay-selected; } // FIXME: this should have light overlay. +} + // statusbar .caja-navigation-window statusbar { margin: 0 -10px; @@ -437,13 +461,15 @@ na-tray-applet widget box widget { .lock-dialog { border: 1px solid $frame; border-radius: $corner-radius + 1px; - box-shadow: $shadow-4, inset 0 1px highlight($surface); // not sure if box-shadow works here + box-shadow: $shadow-z6, inset 0 1px highlight($surface); // not sure if box-shadow works here background-color: $surface; frame > border { border-style: none; } button { - @extend %button-flat-simple; + @extend %button_basic.flat; + + &:not(:disabled) { color: $primary; } } } diff --git a/src/_sass/gtk/apps/_misc.scss b/src/_sass/gtk/apps/_misc.scss index 2bbecf375..233f60267 100644 --- a/src/_sass/gtk/apps/_misc.scss +++ b/src/_sass/gtk/apps/_misc.scss @@ -5,7 +5,7 @@ overlay > revealer { &.left > scrolledwindow.frame, &.right > scrolledwindow.frame { border-style: none; - box-shadow: $shadow-4; + box-shadow: $shadow-z16; } &.left > scrolledwindow.frame { margin-right: 32px; } @@ -20,6 +20,16 @@ overlay > revealer { button.image-button.session-new-button { min-width: $medium-size - 4px; } +// Remove extra padding +notebook.tilix-background tab > box > stack { margin: -6px; } + +button.flat.tilix-small-button { + // NOTE: padding is hard-coded with: + // padding: 2px 4px; + min-height: $small-size - 2px * 2; + min-width: $small-size - 4px * 2; +} + /************** * Terminator * @@ -58,31 +68,45 @@ window.background > box.vertical > scrolledwindow > widget toolbar { * Chromium * ************/ window.background.chromium { - background-color: if($variant == 'light', $background, $surface); + background-color: $surface; - // FIXME: no way to change the toolbar button colors only + // FIXME: There is no way to change the color of the toolbar buttons // toolbar button { color: $text-secondary; } // toolbar's border-bottom refers to button's border + // FIXME: Chrome's button border ignores theme's alpha value :( entry, - > button:not(.suggested-action):not(.destructive-action) { border: 1px solid $border-alt; } + > button { border: 1px solid $track; } > button { - box-shadow: none; - background-size: auto; - - &:hover { background-image: image($overlay-hover); } + color: $primary; - &:active { background-image: image($overlay-checked); } + &:disabled { color: $text-secondary-disabled; } } - // workaround for headerbar's non-animatable buttons - headerbar button:active { background-size: 1000% 1000%; } + menubar, + headerbar { color: $titlebar-text-secondary; } + + // Workaround for non-animatable buttons in headerbar + headerbar button:active { background-color: $overlay-active; } spinner { color: $primary; } - // entry uses this as well - textview { background-color: $surface; } + // For text field + textview.view { background-color: transparent; } + + // For prominent button, starred icon, etc. + treeview.view.cell:selected:focus { + background-color: $primary; + color: on($primary); + } + + // For table header + treeview.view button { + border: 1px solid $track; + background-color: $base; // FIXME: This should not be necessary + // color: $text-secondary; + } } tooltip.background.chromium { background-color: rgba($tooltip, 1); } @@ -91,23 +115,34 @@ tooltip.background.chromium { background-color: rgba($tooltip, 1); } /*********** * Firefox * ***********/ -window.background:not(.csd) { +#MozillaGtkWidget { > widget { - // for the bookmark toolbar's separators - > separator { color: $border-alt; } + // For popover, entry in toolbar, etc. + text { background-color: $surface; } + + // For selection, active tab indicator, etc. + text:selected { + // Use traditional selection style as workaround + background-color: $primary; + color: on($primary); + } + + // For separators in bookmark toolbar + > separator { color: $divider; } // avoid black border - > scrollbar { background-clip: border-box; } + // > scrollbar { background-clip: border-box; } - // emphasize borders color - > scrollbar, - > frame > border { border-color: $border-alt; } + // Emphasize toolbar's border-bottom + > frame > border { border-color: $track; } > entry, > button > button { - border: 1px solid $border-alt; + border: 1px solid $track; border-radius: $corner-radius; box-shadow: none; + + &:disabled { border-color: $track-disabled; } } > entry { @@ -125,11 +160,10 @@ window.background:not(.csd) { > button > button { padding: 4px 8px; background-size: auto; - // color: $fg_color; - &:hover { background-image: image($overlay-hover); } + &:hover { box-shadow: inset 0 0 0 9999px $overlay-hover; } - &:active { background-image: image($overlay-checked); } + &:active { background-image: image($overlay-active); } } // use 16px assets for hard-coded sizing @@ -137,9 +171,15 @@ window.background:not(.csd) { > radiobutton > radio { @extend %small_radio; } + > checkbutton > check, + > radiobutton > radio { + margin: 0; + padding: 0; + } + // make check/radio visible regardless of whether the background is bright or dark - > checkbutton > check:not(:checked), - > radiobutton > radio:not(:checked) { + > checkbutton > check:not(:checked):not(:indeterminate), + > radiobutton > radio:not(:checked):not(:indeterminate) { color: $grey-600; &:hover, &:active { color: $grey-900; } @@ -149,19 +189,11 @@ window.background:not(.csd) { } // remove ugly border around the menus - > window > menu, - > menu > menu { border: none; } -} - -// Firefox now uses this for selected items -text:selected { - // use traditional selection style as workaround for Firefox - background-color: $primary; - color: on($primary); + menu { border: none; } } // for backward compatibility -window.background:not(.csd) { +#MozillaGtkWidget { > widget { > menubar { color: $titlebar-text-secondary; @@ -171,16 +203,10 @@ window.background:not(.csd) { &:disabled { color: $titlebar-text-secondary-disabled; } } - > frame { color: $border-alt; } - - > checkbutton > check, - > radiobutton > radio { - margin: 0; - padding: 0; - } + > frame { color: $track; } } - > window.background > menu > separator { color: $divider; } + menu > separator { color: $divider; } } diff --git a/src/_sass/gtk/apps/_unity.scss b/src/_sass/gtk/apps/_unity.scss index c1cbf5e42..9898abfd2 100644 --- a/src/_sass/gtk/apps/_unity.scss +++ b/src/_sass/gtk/apps/_unity.scss @@ -55,7 +55,7 @@ UnityDecoration { .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: $shadow-1; + box-shadow: $shadow-z1; &.inline-toolbar { border-style: none; } } diff --git a/src/_sass/gtk/apps/_xfce.scss b/src/_sass/gtk/apps/_xfce.scss index 9a7ac86cf..44ab0eb85 100644 --- a/src/_sass/gtk/apps/_xfce.scss +++ b/src/_sass/gtk/apps/_xfce.scss @@ -20,7 +20,7 @@ button { @extend %button-flat; - @extend %button_selected.flat; + @extend %button-on-dark.flat; min-height: 16px; min-width: 16px; @@ -54,7 +54,7 @@ XfdesktopIconView.view { border-radius: $corner-radius; background-color: transparent; color: on(dark); - text-shadow: $shadow-1; + text-shadow: $text-shadow; // XfdesktopIconView uses :active instead of :selected for selection &:active { @@ -63,7 +63,7 @@ XfdesktopIconView.view { box-shadow: none; } - // .label { text-shadow: $shadow-1; } + // .label { text-shadow: $text-shadow; } .rubberband { @extend rubberband; diff --git a/src/chrome/chrome-scrollbar-dark/icons/128.png b/src/chrome/chrome-scrollbar-dark/icons/128.png index e56553a49..ae43cc35c 100644 Binary files a/src/chrome/chrome-scrollbar-dark/icons/128.png and b/src/chrome/chrome-scrollbar-dark/icons/128.png differ diff --git a/src/chrome/chrome-scrollbar-dark/icons/128.svg b/src/chrome/chrome-scrollbar-dark/icons/128.svg index 491f27cf5..0181de916 100644 --- a/src/chrome/chrome-scrollbar-dark/icons/128.svg +++ b/src/chrome/chrome-scrollbar-dark/icons/128.svg @@ -1,6 +1,6 @@ - - + + diff --git a/src/chrome/chrome-scrollbar-dark/icons/16.png b/src/chrome/chrome-scrollbar-dark/icons/16.png index 805c22a51..ec22a6b21 100644 Binary files a/src/chrome/chrome-scrollbar-dark/icons/16.png and b/src/chrome/chrome-scrollbar-dark/icons/16.png differ diff --git a/src/chrome/chrome-scrollbar-dark/icons/16.svg b/src/chrome/chrome-scrollbar-dark/icons/16.svg index 78cc6dc64..8bd9ba14b 100644 --- a/src/chrome/chrome-scrollbar-dark/icons/16.svg +++ b/src/chrome/chrome-scrollbar-dark/icons/16.svg @@ -1,6 +1,6 @@ - - + + diff --git a/src/chrome/chrome-scrollbar-dark/icons/48.png b/src/chrome/chrome-scrollbar-dark/icons/48.png index 9da46c9e0..9e384d022 100644 Binary files a/src/chrome/chrome-scrollbar-dark/icons/48.png and b/src/chrome/chrome-scrollbar-dark/icons/48.png differ diff --git a/src/chrome/chrome-scrollbar-dark/icons/48.svg b/src/chrome/chrome-scrollbar-dark/icons/48.svg index dbd1b576c..37c312088 100644 --- a/src/chrome/chrome-scrollbar-dark/icons/48.svg +++ b/src/chrome/chrome-scrollbar-dark/icons/48.svg @@ -1,6 +1,6 @@ - - + + diff --git a/src/chrome/chrome-scrollbar-dark/scrollbars.css b/src/chrome/chrome-scrollbar-dark/scrollbars.css index 638565099..55aea6c5d 100644 --- a/src/chrome/chrome-scrollbar-dark/scrollbars.css +++ b/src/chrome/chrome-scrollbar-dark/scrollbars.css @@ -3,8 +3,7 @@ width: 17px; height: 17px; border: 0 solid rgba(255, 255, 255, 0.12); - background-color: rgba(48, 48, 48, 0.9); - background-clip: border-box; + background-color: rgba(60, 60, 60, 0.9); } ::-webkit-scrollbar:horizontal, @@ -17,6 +16,10 @@ border-left-width: 1px; } +::-webkit-scrollbar { + background-clip: padding-box; +} + ::-webkit-scrollbar-thumb { width: 32px; height: 32px; @@ -49,3 +52,7 @@ ::-webkit-scrollbar-thumb:disabled { background-color: rgba(255, 255, 255, 0.3); } + +::selection { + background-color: rgba(26, 115, 232, 0.24); +} diff --git a/src/chrome/chrome-scrollbar/scrollbars.css b/src/chrome/chrome-scrollbar/scrollbars.css index acc50cbe7..5e91d25a9 100644 --- a/src/chrome/chrome-scrollbar/scrollbars.css +++ b/src/chrome/chrome-scrollbar/scrollbars.css @@ -4,7 +4,6 @@ height: 17px; border: 0 solid rgba(0, 0, 0, 0.12); background-color: rgba(255, 255, 255, 0.9); - background-clip: padding-box; } ::-webkit-scrollbar:horizontal, @@ -17,6 +16,10 @@ border-left-width: 1px; } +::-webkit-scrollbar { + background-clip: padding-box; +} + ::-webkit-scrollbar-thumb { width: 32px; height: 32px; @@ -39,7 +42,7 @@ } ::-webkit-scrollbar-thumb:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } ::-webkit-scrollbar-thumb:active { @@ -49,3 +52,7 @@ ::-webkit-scrollbar-thumb:disabled { background-color: rgba(0, 0, 0, 0.26); } + +::selection { + background-color: rgba(26, 115, 232, 0.24); +} diff --git a/src/chrome/chrome-theme-dark/manifest.json b/src/chrome/chrome-theme-dark/manifest.json index 726c38667..ee727b8e3 100644 --- a/src/chrome/chrome-theme-dark/manifest.json +++ b/src/chrome/chrome-theme-dark/manifest.json @@ -8,15 +8,15 @@ "theme_toolbar": "theme_toolbar.png" }, "colors": { - "frame": [56, 56, 56], - "frame_inactive": [48, 48, 48], - "frame_incognito": [56, 56, 56], - "frame_incognito_inactive": [48, 48, 48], - "toolbar": [66, 66, 66], + "frame": [53, 53, 53], + "frame_inactive": [44, 44, 44], + "frame_incognito": [53, 53, 53], + "frame_incognito_inactive": [44, 44, 44], + "toolbar": [60, 60, 60], "tab_text": [255, 255, 255], "tab_background_text": [255, 255, 255, 0.7], "bookmark_text": [255, 255, 255], - "ntp_background": [48, 48, 48], + "ntp_background": [44, 44, 44], "ntp_text": [255, 255, 255], "button_background": [0, 0, 0, 0] }, diff --git a/src/chrome/chrome-theme-dark/theme_toolbar.png b/src/chrome/chrome-theme-dark/theme_toolbar.png index 8f25c299c..6c059f7e6 100644 Binary files a/src/chrome/chrome-theme-dark/theme_toolbar.png and b/src/chrome/chrome-theme-dark/theme_toolbar.png differ diff --git a/src/chrome/chrome-theme-dark/theme_toolbar.svg b/src/chrome/chrome-theme-dark/theme_toolbar.svg index 552dee4e9..ac1a3a842 100644 --- a/src/chrome/chrome-theme-dark/theme_toolbar.svg +++ b/src/chrome/chrome-theme-dark/theme_toolbar.svg @@ -1,3 +1,3 @@ - + diff --git a/src/chrome/chrome-theme-light/manifest.json b/src/chrome/chrome-theme-light/manifest.json index 8b773e5e3..34566ee8a 100644 --- a/src/chrome/chrome-theme-light/manifest.json +++ b/src/chrome/chrome-theme-light/manifest.json @@ -14,7 +14,7 @@ "frame_incognito_inactive": [214, 214, 214], "toolbar": [255, 255, 255], "tab_text": [0, 0, 0, 0.87], - "tab_background_text": [0, 0, 0, 0.54], + "tab_background_text": [0, 0, 0, 0.6], "bookmark_text": [0, 0, 0, 0.87], "ntp_background": [255, 255, 255], "ntp_text": [0, 0, 0, 0.87], diff --git a/src/chrome/chrome-theme/manifest.json b/src/chrome/chrome-theme/manifest.json index 9466fe547..80886adf3 100644 --- a/src/chrome/chrome-theme/manifest.json +++ b/src/chrome/chrome-theme/manifest.json @@ -8,10 +8,10 @@ "theme_toolbar": "theme_toolbar.png" }, "colors": { - "frame": [56, 56, 56], - "frame_inactive": [48, 48, 48], - "frame_incognito": [56, 56, 56], - "frame_incognito_inactive": [48, 48, 48], + "frame": [53, 53, 53], + "frame_inactive": [44, 44, 44], + "frame_incognito": [53, 53, 53], + "frame_incognito_inactive": [44, 44, 44], "toolbar": [255, 255, 255], "tab_text": [0, 0, 0, 0.87], "tab_background_text": [255, 255, 255, 0.7], diff --git a/src/cinnamon/assets/add-workspace-active.svg b/src/cinnamon/assets/add-workspace-active.svg index 4ce632132..2a546bf34 100644 --- a/src/cinnamon/assets/add-workspace-active.svg +++ b/src/cinnamon/assets/add-workspace-active.svg @@ -113,7 +113,7 @@ sodipodi:nodetypes="sccssss" /> diff --git a/src/cinnamon/assets/calendar-arrow-left.svg b/src/cinnamon/assets/calendar-arrow-left.svg index 738a3f2ca..da7213da2 100644 --- a/src/cinnamon/assets/calendar-arrow-left.svg +++ b/src/cinnamon/assets/calendar-arrow-left.svg @@ -1,3 +1,3 @@ - + diff --git a/src/cinnamon/assets/calendar-arrow-right.svg b/src/cinnamon/assets/calendar-arrow-right.svg index acb514b9a..0b5a963e9 100644 --- a/src/cinnamon/assets/calendar-arrow-right.svg +++ b/src/cinnamon/assets/calendar-arrow-right.svg @@ -1,3 +1,3 @@ - + diff --git a/src/cinnamon/assets/checkbox-off.svg b/src/cinnamon/assets/checkbox-off.svg index cb4ae5326..2700c5f76 100644 --- a/src/cinnamon/assets/checkbox-off.svg +++ b/src/cinnamon/assets/checkbox-off.svg @@ -1,3 +1,3 @@ - + diff --git a/src/cinnamon/assets/checkbox.svg b/src/cinnamon/assets/checkbox.svg index aabddc83c..b77fa265f 100644 --- a/src/cinnamon/assets/checkbox.svg +++ b/src/cinnamon/assets/checkbox.svg @@ -1,3 +1,3 @@ - + diff --git a/src/cinnamon/assets/close-window.svg b/src/cinnamon/assets/close-window.svg index 38ffee581..d2a4fceb3 100644 --- a/src/cinnamon/assets/close-window.svg +++ b/src/cinnamon/assets/close-window.svg @@ -1,5 +1,5 @@ - + diff --git a/src/cinnamon/assets/radiobutton-off.svg b/src/cinnamon/assets/radiobutton-off.svg index 4e4215dc7..5d3bda77e 100644 --- a/src/cinnamon/assets/radiobutton-off.svg +++ b/src/cinnamon/assets/radiobutton-off.svg @@ -1,3 +1,3 @@ - + diff --git a/src/cinnamon/assets/radiobutton.svg b/src/cinnamon/assets/radiobutton.svg index a89ec0dc6..b045839a6 100644 --- a/src/cinnamon/assets/radiobutton.svg +++ b/src/cinnamon/assets/radiobutton.svg @@ -1,3 +1,3 @@ - + diff --git a/src/cinnamon/assets/toggle-on.svg b/src/cinnamon/assets/toggle-on.svg index 88708c0b5..09f9e530d 100644 --- a/src/cinnamon/assets/toggle-on.svg +++ b/src/cinnamon/assets/toggle-on.svg @@ -1,4 +1,4 @@ - + diff --git a/src/cinnamon/cinnamon-compact.css b/src/cinnamon/cinnamon-compact.css index e8abe76c0..88c839c07 100644 --- a/src/cinnamon/cinnamon-compact.css +++ b/src/cinnamon/cinnamon-compact.css @@ -99,11 +99,11 @@ .slider, .popup-slider-menu-item, .sound-player .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -128,13 +128,13 @@ border-radius: 2px 2px 0 0; color: rgba(0, 0, 0, 0.87); caret-color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } #notification StEntry:focus, .run-dialog-entry:focus, #menu-search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; padding: 0 8px; border-width: 0; color: rgba(0, 0, 0, 0.87); @@ -209,13 +209,13 @@ } .tile-preview, .tile-hud { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid rgba(0, 0, 0, 0.12); } .tile-preview.snap, .tile-hud.snap { - background-color: rgba(0, 0, 0, 0.6); - border: 2px solid #4285F4; + background-color: rgba(0, 0, 0, 0.3); + border: 2px solid #1A73E8; } .overview-empty-placeholder, .info-osd, .workspace-osd, #LookingGlassDialog, .switcher-list, .modal-dialog, .osd-window { @@ -242,7 +242,7 @@ stage { } .cinnamon-link { - color: #4285F4; + color: #1A73E8; font-style: italic; } @@ -265,7 +265,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StBin#trough { @@ -343,7 +343,7 @@ StScrollView StScrollBar { } .popup-image-menu-item { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-combobox-item { @@ -396,7 +396,7 @@ StScrollView StScrollBar { #panel { color: rgba(255, 255, 255, 0.7); - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); height: 2.5em; width: 3.2em; } @@ -469,23 +469,23 @@ StScrollView StScrollBar { } .panel-top .window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .window-list-item-box:active:hover, .panel-top .window-list-item-box:checked:hover, .panel-top .window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:active:hover, .panel-top .grouped-window-list-item-box:checked:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-badge { @@ -497,7 +497,7 @@ StScrollView StScrollBar { } .panel-top .workspace-graph:hover, .panel-top .workspace-button:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-box { @@ -505,11 +505,11 @@ StScrollView StScrollBar { } .panel-top .applet-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .panel-launchers .launcher:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-separator { @@ -517,27 +517,27 @@ StScrollView StScrollBar { } .panel-top .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:active:hover, .panel-bottom .window-list-item-box:checked:hover, .panel-bottom .window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:active:hover, .panel-bottom .grouped-window-list-item-box:checked:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .workspace-switcher, .panel-bottom .workspace-graph, .panel-bottom .workspace-button { @@ -545,7 +545,7 @@ StScrollView StScrollBar { } .panel-bottom .workspace-graph:hover, .panel-bottom .workspace-button:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-box { @@ -553,11 +553,11 @@ StScrollView StScrollBar { } .panel-bottom .applet-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .panel-launchers .launcher:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-separator { @@ -565,27 +565,27 @@ StScrollView StScrollBar { } .panel-bottom .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:active:hover, .panel-left .window-list-item-box:checked:hover, .panel-left .window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:active:hover, .panel-left .grouped-window-list-item-box:checked:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-badge { @@ -598,7 +598,7 @@ StScrollView StScrollBar { } .panel-left .workspace-graph:hover, .panel-left .workspace-button:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-box { @@ -606,11 +606,11 @@ StScrollView StScrollBar { } .panel-left .applet-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .panel-launchers .launcher:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-separator { @@ -618,27 +618,27 @@ StScrollView StScrollBar { } .panel-left .systray:hover { - box-shadow: 4px 0 0 0 #4285F4 inset; + box-shadow: 4px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:active:hover, .panel-right .window-list-item-box:checked:hover, .panel-right .window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:active:hover, .panel-right .grouped-window-list-item-box:checked:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .workspace-switcher, .panel-right .workspace-graph, .panel-right .workspace-button { @@ -647,7 +647,7 @@ StScrollView StScrollBar { } .panel-right .workspace-graph:hover, .panel-right .workspace-button:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-box { @@ -655,11 +655,11 @@ StScrollView StScrollBar { } .panel-right .applet-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .panel-launchers .launcher:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-separator { @@ -667,7 +667,7 @@ StScrollView StScrollBar { } .panel-right .systray:hover { - box-shadow: -4px 0 0 0 #4285F4 inset; + box-shadow: -4px 0 0 0 #1A73E8 inset; } .panel-status-button { @@ -689,11 +689,11 @@ StScrollView StScrollBar { } .system-status-icon.warning { - color: #FBBC05; + color: #F4B400; } .system-status-icon.error { - color: #EA4335; + color: #D93025; } #overview { @@ -713,7 +713,7 @@ StScrollView StScrollBar { .window-caption#selected, .window-caption:focus { color: white; - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .workspace-controls { @@ -769,7 +769,7 @@ StScrollView StScrollBar { .window-close-area { background-image: url(assets/trash-icon.png); background-size: 100px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 0, 0, 0.12); border-bottom-width: 0; border-radius: 20px 20px 0 0; @@ -778,11 +778,11 @@ StScrollView StScrollBar { } .expo-background { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-overview-background-shade { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .expo-workspace-thumbnail-frame { @@ -790,7 +790,7 @@ StScrollView StScrollBar { } .expo-workspace-thumbnail-frame#active { - border: 1px solid #4285F4; + border: 1px solid #1A73E8; } #LookingGlassDialog { @@ -807,7 +807,7 @@ StScrollView StScrollBar { .datemenu-date-label { font-size: 15pt; font-weight: 500; - height: 21px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -822,7 +822,7 @@ StScrollView StScrollBar { .calendar-month-label { font-size: 9.75pt; font-weight: 500; - height: 13px; + height: 16px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -854,8 +854,8 @@ StScrollView StScrollBar { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -867,15 +867,15 @@ StScrollView StScrollBar { .calendar-day-base:active { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; } .calendar-week-number { font-size: 9pt; font-weight: 400; - width: 18px; - height: 25px; + width: 21px; + height: 28px; margin: 2px; padding: 0; border-radius: 100px; @@ -887,8 +887,8 @@ StScrollView StScrollBar { .calendar-day-heading { font-size: 9pt; font-weight: 400; - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 0; border-radius: 100px; @@ -919,7 +919,7 @@ StScrollView StScrollBar { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -931,8 +931,8 @@ StScrollView StScrollBar { } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -961,7 +961,7 @@ StScrollView StScrollBar { } #notification .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-with-image { @@ -1059,7 +1059,7 @@ StScrollView StScrollBar { .switcher-arrow { border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -1067,14 +1067,14 @@ StScrollView StScrollBar { } .switcher-preview-backdrop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .ripple-box { width: 104px; height: 104px; background-image: url(assets/corner-ripple.png); - background-color: #4285F4; + background-color: #1A73E8; border-radius: 52px; } @@ -1087,12 +1087,12 @@ StScrollView StScrollBar { } .run-dialog-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } .run-dialog-error-label { - color: #EA4335; + color: #D93025; } .run-dialog-error-box { @@ -1110,7 +1110,7 @@ StScrollView StScrollBar { } .lightbox { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .cinnamon-mount-operation-icon { @@ -1118,7 +1118,7 @@ StScrollView StScrollBar { } .mount-password-reask { - color: #FBBC05; + color: #F4B400; } .show-processes-dialog { @@ -1182,7 +1182,7 @@ StScrollView StScrollBar { } #keyboard { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .keyboard-key { @@ -1266,7 +1266,7 @@ StScrollView StScrollBar { .menu-category-button-greyed { padding: 0.4em 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-style: italic; } @@ -1352,7 +1352,7 @@ StScrollView StScrollBar { } .window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel { @@ -1360,7 +1360,7 @@ StScrollView StScrollBar { } .window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1390,11 +1390,11 @@ StScrollView StScrollBar { .grouped-window-list-badge { border-radius: 9999px; - background-color: #d6d6d6; + background-color: #1F1F1F; } .grouped-window-list-thumbnail-alert { - background: #FBBC05; + background: #F4B400; } .grouped-window-list-item-box { @@ -1424,11 +1424,11 @@ StScrollView StScrollBar { } .grouped-window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .grouped-window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1524,11 +1524,11 @@ StScrollView StScrollBar { min-width: 300px; padding: 12px 16px; spacing: 0.5em; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .workspace-button { - background-color: #d6d6d6; + background-color: #1F1F1F; width: 2em; height: 1em; color: rgba(255, 255, 255, 0.7); @@ -1541,11 +1541,11 @@ StScrollView StScrollBar { } .workspace-graph { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-graph .workspace { - background-color: #d6d6d6; + background-color: #1F1F1F; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -1647,7 +1647,7 @@ StScrollView StScrollBar { border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); padding: 12px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1696,8 +1696,8 @@ StScrollView StScrollBar { } .desklet-drag-placeholder { - border: 2px solid #4285F4; - background-color: rgba(0, 0, 0, 0.6); + border: 2px solid #1A73E8; + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1749,7 +1749,7 @@ StScrollView StScrollBar { } .expo-workspaces-name-entry { - font-size: 9.75pt; + font-size: 11.25pt; font-weight: 400; background-color: rgba(255, 255, 255, 0.04); color: white; @@ -1810,7 +1810,7 @@ StScrollView StScrollBar { } .flashspot { - background-color: #4285F4; + background-color: #1A73E8; } .osd-window { @@ -1826,7 +1826,7 @@ StScrollView StScrollBar { .osd-window .level-bar { border-radius: 0.3em; - background-color: #4285F4; + background-color: #1A73E8; } .tile-hud:top { diff --git a/src/cinnamon/cinnamon-dark-compact.css b/src/cinnamon/cinnamon-dark-compact.css index 7f0830080..d51a4e022 100644 --- a/src/cinnamon/cinnamon-dark-compact.css +++ b/src/cinnamon/cinnamon-dark-compact.css @@ -1,6 +1,6 @@ .notification-button, .modal-dialog-button { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -22,7 +22,7 @@ .notification-button:hover, .modal-dialog-button:hover, .notification-button:checked, .modal-dialog-button:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -31,7 +31,7 @@ .notification-button:active, .modal-dialog-button:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -50,7 +50,7 @@ .notification-icon-button, .keyboard-key, .sound-player StButton { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -71,7 +71,7 @@ .notification-icon-button:hover, .keyboard-key:hover, .sound-player StButton:hover, .notification-icon-button:checked, .keyboard-key:checked, .sound-player StButton:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -80,7 +80,7 @@ .notification-icon-button:active, .keyboard-key:active, .sound-player StButton:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -159,7 +159,7 @@ } .menu, .popup-combo-menu { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; color: white; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); @@ -209,18 +209,18 @@ } .tile-preview, .tile-hud { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid rgba(255, 255, 255, 0.12); } .tile-preview.snap, .tile-hud.snap { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid #8AB4F8; } .overview-empty-placeholder, .info-osd, .workspace-osd, #LookingGlassDialog, .switcher-list, .modal-dialog, .osd-window { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; border-radius: 2px; padding: 12px; @@ -396,7 +396,7 @@ StScrollView StScrollBar { #panel { color: rgba(255, 255, 255, 0.7); - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); height: 2.5em; width: 3.2em; } @@ -689,11 +689,11 @@ StScrollView StScrollBar { } .system-status-icon.warning { - color: #FBBC05; + color: #FDD633; } .system-status-icon.error { - color: #EA4335; + color: #F28B82; } #overview { @@ -769,7 +769,7 @@ StScrollView StScrollBar { .window-close-area { background-image: url(assets/trash-icon.png); background-size: 100px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 1px solid rgba(255, 255, 255, 0.12); border-bottom-width: 0; border-radius: 20px 20px 0 0; @@ -778,11 +778,11 @@ StScrollView StScrollBar { } .expo-background { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-overview-background-shade { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .expo-workspace-thumbnail-frame { @@ -807,7 +807,7 @@ StScrollView StScrollBar { .datemenu-date-label { font-size: 15pt; font-weight: 500; - height: 21px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -822,7 +822,7 @@ StScrollView StScrollBar { .calendar-month-label { font-size: 9.75pt; font-weight: 500; - height: 13px; + height: 16px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -854,8 +854,8 @@ StScrollView StScrollBar { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -874,8 +874,8 @@ StScrollView StScrollBar { .calendar-week-number { font-size: 9pt; font-weight: 400; - width: 18px; - height: 25px; + width: 21px; + height: 28px; margin: 2px; padding: 0; border-radius: 100px; @@ -887,8 +887,8 @@ StScrollView StScrollBar { .calendar-day-heading { font-size: 9pt; font-weight: 400; - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 0; border-radius: 100px; @@ -931,8 +931,8 @@ StScrollView StScrollBar { } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -944,7 +944,7 @@ StScrollView StScrollBar { } #notification { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; border: 1px solid rgba(255, 255, 255, 0.12); padding: 8px; @@ -1067,7 +1067,7 @@ StScrollView StScrollBar { } .switcher-preview-backdrop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .ripple-box { @@ -1092,7 +1092,7 @@ StScrollView StScrollBar { } .run-dialog-error-label { - color: #EA4335; + color: #F28B82; } .run-dialog-error-box { @@ -1110,7 +1110,7 @@ StScrollView StScrollBar { } .lightbox { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .cinnamon-mount-operation-icon { @@ -1118,7 +1118,7 @@ StScrollView StScrollBar { } .mount-password-reask { - color: #FBBC05; + color: #FDD633; } .show-processes-dialog { @@ -1182,7 +1182,7 @@ StScrollView StScrollBar { } #keyboard { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .keyboard-key { @@ -1209,7 +1209,7 @@ StScrollView StScrollBar { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #282828; + background-color: #212121; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -1352,7 +1352,7 @@ StScrollView StScrollBar { } .window-list-item-box .progress { - background-color: #34A853; + background-color: #81C995; } .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel { @@ -1360,12 +1360,12 @@ StScrollView StScrollBar { } .window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } .window-list-preview { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; padding: 10px 15px; spacing: 1em; @@ -1390,11 +1390,11 @@ StScrollView StScrollBar { .grouped-window-list-badge { border-radius: 9999px; - background-color: #d6d6d6; + background-color: #1F1F1F; } .grouped-window-list-thumbnail-alert { - background: #FBBC05; + background: #FDD633; } .grouped-window-list-item-box { @@ -1424,11 +1424,11 @@ StScrollView StScrollBar { } .grouped-window-list-item-box .progress { - background-color: #34A853; + background-color: #81C995; } .grouped-window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1520,7 +1520,7 @@ StScrollView StScrollBar { } .sound-player-overlay { - background-color: #424242; + background-color: #3C3C3C; min-width: 300px; padding: 12px 16px; spacing: 0.5em; @@ -1528,7 +1528,7 @@ StScrollView StScrollBar { } .workspace-button { - background-color: #d6d6d6; + background-color: #1F1F1F; width: 2em; height: 1em; color: rgba(255, 255, 255, 0.7); @@ -1541,11 +1541,11 @@ StScrollView StScrollBar { } .workspace-graph { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-graph .workspace { - background-color: #d6d6d6; + background-color: #1F1F1F; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -1647,14 +1647,14 @@ StScrollView StScrollBar { border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); padding: 12px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } .desklet-with-borders { font-size: 9pt; font-weight: 400; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; } @@ -1665,7 +1665,7 @@ StScrollView StScrollBar { .desklet-with-borders-and-header { font-size: 9pt; font-weight: 400; - background-color: #424242; + background-color: #3C3C3C; border-radius-bottomleft: 2px; border-radius-bottomright: 2px; } @@ -1677,7 +1677,7 @@ StScrollView StScrollBar { .desklet-header { font-size: 15pt; font-weight: 500; - background-color: #424242; + background-color: #3C3C3C; border-radius-topleft: 2px; border-radius-topright: 2px; } @@ -1687,7 +1687,7 @@ StScrollView StScrollBar { } .photoframe-box { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; } @@ -1697,7 +1697,7 @@ StScrollView StScrollBar { .desklet-drag-placeholder { border: 2px solid #8AB4F8; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1749,7 +1749,7 @@ StScrollView StScrollBar { } .expo-workspaces-name-entry { - font-size: 9.75pt; + font-size: 11.25pt; font-weight: 400; background-color: rgba(255, 255, 255, 0.04); color: white; diff --git a/src/cinnamon/cinnamon-dark.css b/src/cinnamon/cinnamon-dark.css index 650ecb2ed..879825558 100644 --- a/src/cinnamon/cinnamon-dark.css +++ b/src/cinnamon/cinnamon-dark.css @@ -1,6 +1,6 @@ .notification-button, .modal-dialog-button { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -22,7 +22,7 @@ .notification-button:hover, .modal-dialog-button:hover, .notification-button:checked, .modal-dialog-button:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -31,7 +31,7 @@ .notification-button:active, .modal-dialog-button:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -50,7 +50,7 @@ .notification-icon-button, .keyboard-key, .sound-player StButton { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -71,7 +71,7 @@ .notification-icon-button:hover, .keyboard-key:hover, .sound-player StButton:hover, .notification-icon-button:checked, .keyboard-key:checked, .sound-player StButton:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -80,7 +80,7 @@ .notification-icon-button:active, .keyboard-key:active, .sound-player StButton:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -159,7 +159,7 @@ } .menu, .popup-combo-menu { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; color: white; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); @@ -209,18 +209,18 @@ } .tile-preview, .tile-hud { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid rgba(255, 255, 255, 0.12); } .tile-preview.snap, .tile-hud.snap { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid #8AB4F8; } .overview-empty-placeholder, .info-osd, .workspace-osd, #LookingGlassDialog, .switcher-list, .modal-dialog, .osd-window { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; border-radius: 2px; padding: 12px; @@ -396,7 +396,7 @@ StScrollView StScrollBar { #panel { color: rgba(255, 255, 255, 0.7); - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); height: 2.5em; width: 3.2em; } @@ -689,11 +689,11 @@ StScrollView StScrollBar { } .system-status-icon.warning { - color: #FBBC05; + color: #FDD633; } .system-status-icon.error { - color: #EA4335; + color: #F28B82; } #overview { @@ -769,7 +769,7 @@ StScrollView StScrollBar { .window-close-area { background-image: url(assets/trash-icon.png); background-size: 100px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 1px solid rgba(255, 255, 255, 0.12); border-bottom-width: 0; border-radius: 20px 20px 0 0; @@ -778,11 +778,11 @@ StScrollView StScrollBar { } .expo-background { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-overview-background-shade { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .expo-workspace-thumbnail-frame { @@ -807,7 +807,7 @@ StScrollView StScrollBar { .datemenu-date-label { font-size: 15pt; font-weight: 500; - height: 26px; + height: 28px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -822,7 +822,7 @@ StScrollView StScrollBar { .calendar-month-label { font-size: 10.5pt; font-weight: 500; - height: 18px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -854,8 +854,8 @@ StScrollView StScrollBar { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -874,8 +874,8 @@ StScrollView StScrollBar { .calendar-week-number { font-size: 9pt; font-weight: 400; - width: 23px; - height: 30px; + width: 25px; + height: 32px; margin: 2px; padding: 0; border-radius: 100px; @@ -887,8 +887,8 @@ StScrollView StScrollBar { .calendar-day-heading { font-size: 9pt; font-weight: 400; - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 0; border-radius: 100px; @@ -931,8 +931,8 @@ StScrollView StScrollBar { } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -944,7 +944,7 @@ StScrollView StScrollBar { } #notification { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; border: 1px solid rgba(255, 255, 255, 0.12); padding: 8px; @@ -1067,7 +1067,7 @@ StScrollView StScrollBar { } .switcher-preview-backdrop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .ripple-box { @@ -1092,7 +1092,7 @@ StScrollView StScrollBar { } .run-dialog-error-label { - color: #EA4335; + color: #F28B82; } .run-dialog-error-box { @@ -1110,7 +1110,7 @@ StScrollView StScrollBar { } .lightbox { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .cinnamon-mount-operation-icon { @@ -1118,7 +1118,7 @@ StScrollView StScrollBar { } .mount-password-reask { - color: #FBBC05; + color: #FDD633; } .show-processes-dialog { @@ -1182,7 +1182,7 @@ StScrollView StScrollBar { } #keyboard { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .keyboard-key { @@ -1209,7 +1209,7 @@ StScrollView StScrollBar { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #282828; + background-color: #212121; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -1352,7 +1352,7 @@ StScrollView StScrollBar { } .window-list-item-box .progress { - background-color: #34A853; + background-color: #81C995; } .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel { @@ -1360,12 +1360,12 @@ StScrollView StScrollBar { } .window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } .window-list-preview { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; padding: 10px 15px; spacing: 1em; @@ -1390,11 +1390,11 @@ StScrollView StScrollBar { .grouped-window-list-badge { border-radius: 9999px; - background-color: #d6d6d6; + background-color: #1F1F1F; } .grouped-window-list-thumbnail-alert { - background: #FBBC05; + background: #FDD633; } .grouped-window-list-item-box { @@ -1424,11 +1424,11 @@ StScrollView StScrollBar { } .grouped-window-list-item-box .progress { - background-color: #34A853; + background-color: #81C995; } .grouped-window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1520,7 +1520,7 @@ StScrollView StScrollBar { } .sound-player-overlay { - background-color: #424242; + background-color: #3C3C3C; min-width: 300px; padding: 12px 16px; spacing: 0.5em; @@ -1528,7 +1528,7 @@ StScrollView StScrollBar { } .workspace-button { - background-color: #d6d6d6; + background-color: #1F1F1F; width: 2em; height: 1em; color: rgba(255, 255, 255, 0.7); @@ -1541,11 +1541,11 @@ StScrollView StScrollBar { } .workspace-graph { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-graph .workspace { - background-color: #d6d6d6; + background-color: #1F1F1F; border: 1px solid rgba(255, 255, 255, 0.12); } @@ -1647,14 +1647,14 @@ StScrollView StScrollBar { border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); padding: 12px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } .desklet-with-borders { font-size: 9pt; font-weight: 400; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; } @@ -1665,7 +1665,7 @@ StScrollView StScrollBar { .desklet-with-borders-and-header { font-size: 9pt; font-weight: 400; - background-color: #424242; + background-color: #3C3C3C; border-radius-bottomleft: 2px; border-radius-bottomright: 2px; } @@ -1677,7 +1677,7 @@ StScrollView StScrollBar { .desklet-header { font-size: 15pt; font-weight: 500; - background-color: #424242; + background-color: #3C3C3C; border-radius-topleft: 2px; border-radius-topright: 2px; } @@ -1687,7 +1687,7 @@ StScrollView StScrollBar { } .photoframe-box { - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; } @@ -1697,7 +1697,7 @@ StScrollView StScrollBar { .desklet-drag-placeholder { border: 2px solid #8AB4F8; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1749,7 +1749,7 @@ StScrollView StScrollBar { } .expo-workspaces-name-entry { - font-size: 10.5pt; + font-size: 12pt; font-weight: 400; background-color: rgba(255, 255, 255, 0.04); color: white; diff --git a/src/cinnamon/cinnamon-light-compact.css b/src/cinnamon/cinnamon-light-compact.css index e8abe76c0..88c839c07 100644 --- a/src/cinnamon/cinnamon-light-compact.css +++ b/src/cinnamon/cinnamon-light-compact.css @@ -99,11 +99,11 @@ .slider, .popup-slider-menu-item, .sound-player .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -128,13 +128,13 @@ border-radius: 2px 2px 0 0; color: rgba(0, 0, 0, 0.87); caret-color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } #notification StEntry:focus, .run-dialog-entry:focus, #menu-search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; padding: 0 8px; border-width: 0; color: rgba(0, 0, 0, 0.87); @@ -209,13 +209,13 @@ } .tile-preview, .tile-hud { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid rgba(0, 0, 0, 0.12); } .tile-preview.snap, .tile-hud.snap { - background-color: rgba(0, 0, 0, 0.6); - border: 2px solid #4285F4; + background-color: rgba(0, 0, 0, 0.3); + border: 2px solid #1A73E8; } .overview-empty-placeholder, .info-osd, .workspace-osd, #LookingGlassDialog, .switcher-list, .modal-dialog, .osd-window { @@ -242,7 +242,7 @@ stage { } .cinnamon-link { - color: #4285F4; + color: #1A73E8; font-style: italic; } @@ -265,7 +265,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StBin#trough { @@ -343,7 +343,7 @@ StScrollView StScrollBar { } .popup-image-menu-item { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-combobox-item { @@ -396,7 +396,7 @@ StScrollView StScrollBar { #panel { color: rgba(255, 255, 255, 0.7); - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); height: 2.5em; width: 3.2em; } @@ -469,23 +469,23 @@ StScrollView StScrollBar { } .panel-top .window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .window-list-item-box:active:hover, .panel-top .window-list-item-box:checked:hover, .panel-top .window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:active:hover, .panel-top .grouped-window-list-item-box:checked:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-badge { @@ -497,7 +497,7 @@ StScrollView StScrollBar { } .panel-top .workspace-graph:hover, .panel-top .workspace-button:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-box { @@ -505,11 +505,11 @@ StScrollView StScrollBar { } .panel-top .applet-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .panel-launchers .launcher:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-separator { @@ -517,27 +517,27 @@ StScrollView StScrollBar { } .panel-top .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:active:hover, .panel-bottom .window-list-item-box:checked:hover, .panel-bottom .window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:active:hover, .panel-bottom .grouped-window-list-item-box:checked:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .workspace-switcher, .panel-bottom .workspace-graph, .panel-bottom .workspace-button { @@ -545,7 +545,7 @@ StScrollView StScrollBar { } .panel-bottom .workspace-graph:hover, .panel-bottom .workspace-button:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-box { @@ -553,11 +553,11 @@ StScrollView StScrollBar { } .panel-bottom .applet-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .panel-launchers .launcher:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-separator { @@ -565,27 +565,27 @@ StScrollView StScrollBar { } .panel-bottom .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:active:hover, .panel-left .window-list-item-box:checked:hover, .panel-left .window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:active:hover, .panel-left .grouped-window-list-item-box:checked:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-badge { @@ -598,7 +598,7 @@ StScrollView StScrollBar { } .panel-left .workspace-graph:hover, .panel-left .workspace-button:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-box { @@ -606,11 +606,11 @@ StScrollView StScrollBar { } .panel-left .applet-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .panel-launchers .launcher:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-separator { @@ -618,27 +618,27 @@ StScrollView StScrollBar { } .panel-left .systray:hover { - box-shadow: 4px 0 0 0 #4285F4 inset; + box-shadow: 4px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:active:hover, .panel-right .window-list-item-box:checked:hover, .panel-right .window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:active:hover, .panel-right .grouped-window-list-item-box:checked:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .workspace-switcher, .panel-right .workspace-graph, .panel-right .workspace-button { @@ -647,7 +647,7 @@ StScrollView StScrollBar { } .panel-right .workspace-graph:hover, .panel-right .workspace-button:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-box { @@ -655,11 +655,11 @@ StScrollView StScrollBar { } .panel-right .applet-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .panel-launchers .launcher:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-separator { @@ -667,7 +667,7 @@ StScrollView StScrollBar { } .panel-right .systray:hover { - box-shadow: -4px 0 0 0 #4285F4 inset; + box-shadow: -4px 0 0 0 #1A73E8 inset; } .panel-status-button { @@ -689,11 +689,11 @@ StScrollView StScrollBar { } .system-status-icon.warning { - color: #FBBC05; + color: #F4B400; } .system-status-icon.error { - color: #EA4335; + color: #D93025; } #overview { @@ -713,7 +713,7 @@ StScrollView StScrollBar { .window-caption#selected, .window-caption:focus { color: white; - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .workspace-controls { @@ -769,7 +769,7 @@ StScrollView StScrollBar { .window-close-area { background-image: url(assets/trash-icon.png); background-size: 100px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 0, 0, 0.12); border-bottom-width: 0; border-radius: 20px 20px 0 0; @@ -778,11 +778,11 @@ StScrollView StScrollBar { } .expo-background { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-overview-background-shade { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .expo-workspace-thumbnail-frame { @@ -790,7 +790,7 @@ StScrollView StScrollBar { } .expo-workspace-thumbnail-frame#active { - border: 1px solid #4285F4; + border: 1px solid #1A73E8; } #LookingGlassDialog { @@ -807,7 +807,7 @@ StScrollView StScrollBar { .datemenu-date-label { font-size: 15pt; font-weight: 500; - height: 21px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -822,7 +822,7 @@ StScrollView StScrollBar { .calendar-month-label { font-size: 9.75pt; font-weight: 500; - height: 13px; + height: 16px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -854,8 +854,8 @@ StScrollView StScrollBar { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -867,15 +867,15 @@ StScrollView StScrollBar { .calendar-day-base:active { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; } .calendar-week-number { font-size: 9pt; font-weight: 400; - width: 18px; - height: 25px; + width: 21px; + height: 28px; margin: 2px; padding: 0; border-radius: 100px; @@ -887,8 +887,8 @@ StScrollView StScrollBar { .calendar-day-heading { font-size: 9pt; font-weight: 400; - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 0; border-radius: 100px; @@ -919,7 +919,7 @@ StScrollView StScrollBar { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -931,8 +931,8 @@ StScrollView StScrollBar { } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -961,7 +961,7 @@ StScrollView StScrollBar { } #notification .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-with-image { @@ -1059,7 +1059,7 @@ StScrollView StScrollBar { .switcher-arrow { border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -1067,14 +1067,14 @@ StScrollView StScrollBar { } .switcher-preview-backdrop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .ripple-box { width: 104px; height: 104px; background-image: url(assets/corner-ripple.png); - background-color: #4285F4; + background-color: #1A73E8; border-radius: 52px; } @@ -1087,12 +1087,12 @@ StScrollView StScrollBar { } .run-dialog-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } .run-dialog-error-label { - color: #EA4335; + color: #D93025; } .run-dialog-error-box { @@ -1110,7 +1110,7 @@ StScrollView StScrollBar { } .lightbox { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .cinnamon-mount-operation-icon { @@ -1118,7 +1118,7 @@ StScrollView StScrollBar { } .mount-password-reask { - color: #FBBC05; + color: #F4B400; } .show-processes-dialog { @@ -1182,7 +1182,7 @@ StScrollView StScrollBar { } #keyboard { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .keyboard-key { @@ -1266,7 +1266,7 @@ StScrollView StScrollBar { .menu-category-button-greyed { padding: 0.4em 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-style: italic; } @@ -1352,7 +1352,7 @@ StScrollView StScrollBar { } .window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel { @@ -1360,7 +1360,7 @@ StScrollView StScrollBar { } .window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1390,11 +1390,11 @@ StScrollView StScrollBar { .grouped-window-list-badge { border-radius: 9999px; - background-color: #d6d6d6; + background-color: #1F1F1F; } .grouped-window-list-thumbnail-alert { - background: #FBBC05; + background: #F4B400; } .grouped-window-list-item-box { @@ -1424,11 +1424,11 @@ StScrollView StScrollBar { } .grouped-window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .grouped-window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1524,11 +1524,11 @@ StScrollView StScrollBar { min-width: 300px; padding: 12px 16px; spacing: 0.5em; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .workspace-button { - background-color: #d6d6d6; + background-color: #1F1F1F; width: 2em; height: 1em; color: rgba(255, 255, 255, 0.7); @@ -1541,11 +1541,11 @@ StScrollView StScrollBar { } .workspace-graph { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-graph .workspace { - background-color: #d6d6d6; + background-color: #1F1F1F; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -1647,7 +1647,7 @@ StScrollView StScrollBar { border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); padding: 12px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1696,8 +1696,8 @@ StScrollView StScrollBar { } .desklet-drag-placeholder { - border: 2px solid #4285F4; - background-color: rgba(0, 0, 0, 0.6); + border: 2px solid #1A73E8; + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1749,7 +1749,7 @@ StScrollView StScrollBar { } .expo-workspaces-name-entry { - font-size: 9.75pt; + font-size: 11.25pt; font-weight: 400; background-color: rgba(255, 255, 255, 0.04); color: white; @@ -1810,7 +1810,7 @@ StScrollView StScrollBar { } .flashspot { - background-color: #4285F4; + background-color: #1A73E8; } .osd-window { @@ -1826,7 +1826,7 @@ StScrollView StScrollBar { .osd-window .level-bar { border-radius: 0.3em; - background-color: #4285F4; + background-color: #1A73E8; } .tile-hud:top { diff --git a/src/cinnamon/cinnamon-light.css b/src/cinnamon/cinnamon-light.css index 429b652bb..63c69687d 100644 --- a/src/cinnamon/cinnamon-light.css +++ b/src/cinnamon/cinnamon-light.css @@ -99,11 +99,11 @@ .slider, .popup-slider-menu-item, .sound-player .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -128,13 +128,13 @@ border-radius: 2px 2px 0 0; color: rgba(0, 0, 0, 0.87); caret-color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } #notification StEntry:focus, .run-dialog-entry:focus, #menu-search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; padding: 0 8px; border-width: 0; color: rgba(0, 0, 0, 0.87); @@ -209,13 +209,13 @@ } .tile-preview, .tile-hud { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid rgba(0, 0, 0, 0.12); } .tile-preview.snap, .tile-hud.snap { - background-color: rgba(0, 0, 0, 0.6); - border: 2px solid #4285F4; + background-color: rgba(0, 0, 0, 0.3); + border: 2px solid #1A73E8; } .overview-empty-placeholder, .info-osd, .workspace-osd, #LookingGlassDialog, .switcher-list, .modal-dialog, .osd-window { @@ -242,7 +242,7 @@ stage { } .cinnamon-link { - color: #4285F4; + color: #1A73E8; font-style: italic; } @@ -265,7 +265,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StBin#trough { @@ -343,7 +343,7 @@ StScrollView StScrollBar { } .popup-image-menu-item { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-combobox-item { @@ -396,7 +396,7 @@ StScrollView StScrollBar { #panel { color: rgba(255, 255, 255, 0.7); - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); height: 2.5em; width: 3.2em; } @@ -469,23 +469,23 @@ StScrollView StScrollBar { } .panel-top .window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .window-list-item-box:active:hover, .panel-top .window-list-item-box:checked:hover, .panel-top .window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:active:hover, .panel-top .grouped-window-list-item-box:checked:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-badge { @@ -497,7 +497,7 @@ StScrollView StScrollBar { } .panel-top .workspace-graph:hover, .panel-top .workspace-button:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-box { @@ -505,11 +505,11 @@ StScrollView StScrollBar { } .panel-top .applet-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .panel-launchers .launcher:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-separator { @@ -517,27 +517,27 @@ StScrollView StScrollBar { } .panel-top .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:active:hover, .panel-bottom .window-list-item-box:checked:hover, .panel-bottom .window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:active:hover, .panel-bottom .grouped-window-list-item-box:checked:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .workspace-switcher, .panel-bottom .workspace-graph, .panel-bottom .workspace-button { @@ -545,7 +545,7 @@ StScrollView StScrollBar { } .panel-bottom .workspace-graph:hover, .panel-bottom .workspace-button:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-box { @@ -553,11 +553,11 @@ StScrollView StScrollBar { } .panel-bottom .applet-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .panel-launchers .launcher:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-separator { @@ -565,27 +565,27 @@ StScrollView StScrollBar { } .panel-bottom .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:active:hover, .panel-left .window-list-item-box:checked:hover, .panel-left .window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:active:hover, .panel-left .grouped-window-list-item-box:checked:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-badge { @@ -598,7 +598,7 @@ StScrollView StScrollBar { } .panel-left .workspace-graph:hover, .panel-left .workspace-button:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-box { @@ -606,11 +606,11 @@ StScrollView StScrollBar { } .panel-left .applet-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .panel-launchers .launcher:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-separator { @@ -618,27 +618,27 @@ StScrollView StScrollBar { } .panel-left .systray:hover { - box-shadow: 4px 0 0 0 #4285F4 inset; + box-shadow: 4px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:active:hover, .panel-right .window-list-item-box:checked:hover, .panel-right .window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:active:hover, .panel-right .grouped-window-list-item-box:checked:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .workspace-switcher, .panel-right .workspace-graph, .panel-right .workspace-button { @@ -647,7 +647,7 @@ StScrollView StScrollBar { } .panel-right .workspace-graph:hover, .panel-right .workspace-button:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-box { @@ -655,11 +655,11 @@ StScrollView StScrollBar { } .panel-right .applet-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .panel-launchers .launcher:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-separator { @@ -667,7 +667,7 @@ StScrollView StScrollBar { } .panel-right .systray:hover { - box-shadow: -4px 0 0 0 #4285F4 inset; + box-shadow: -4px 0 0 0 #1A73E8 inset; } .panel-status-button { @@ -689,11 +689,11 @@ StScrollView StScrollBar { } .system-status-icon.warning { - color: #FBBC05; + color: #F4B400; } .system-status-icon.error { - color: #EA4335; + color: #D93025; } #overview { @@ -713,7 +713,7 @@ StScrollView StScrollBar { .window-caption#selected, .window-caption:focus { color: white; - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .workspace-controls { @@ -769,7 +769,7 @@ StScrollView StScrollBar { .window-close-area { background-image: url(assets/trash-icon.png); background-size: 100px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 0, 0, 0.12); border-bottom-width: 0; border-radius: 20px 20px 0 0; @@ -778,11 +778,11 @@ StScrollView StScrollBar { } .expo-background { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-overview-background-shade { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .expo-workspace-thumbnail-frame { @@ -790,7 +790,7 @@ StScrollView StScrollBar { } .expo-workspace-thumbnail-frame#active { - border: 1px solid #4285F4; + border: 1px solid #1A73E8; } #LookingGlassDialog { @@ -807,7 +807,7 @@ StScrollView StScrollBar { .datemenu-date-label { font-size: 15pt; font-weight: 500; - height: 26px; + height: 28px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -822,7 +822,7 @@ StScrollView StScrollBar { .calendar-month-label { font-size: 10.5pt; font-weight: 500; - height: 18px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -854,8 +854,8 @@ StScrollView StScrollBar { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -867,15 +867,15 @@ StScrollView StScrollBar { .calendar-day-base:active { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; } .calendar-week-number { font-size: 9pt; font-weight: 400; - width: 23px; - height: 30px; + width: 25px; + height: 32px; margin: 2px; padding: 0; border-radius: 100px; @@ -887,8 +887,8 @@ StScrollView StScrollBar { .calendar-day-heading { font-size: 9pt; font-weight: 400; - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 0; border-radius: 100px; @@ -919,7 +919,7 @@ StScrollView StScrollBar { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -931,8 +931,8 @@ StScrollView StScrollBar { } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -961,7 +961,7 @@ StScrollView StScrollBar { } #notification .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-with-image { @@ -1059,7 +1059,7 @@ StScrollView StScrollBar { .switcher-arrow { border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -1067,14 +1067,14 @@ StScrollView StScrollBar { } .switcher-preview-backdrop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .ripple-box { width: 104px; height: 104px; background-image: url(assets/corner-ripple.png); - background-color: #4285F4; + background-color: #1A73E8; border-radius: 52px; } @@ -1087,12 +1087,12 @@ StScrollView StScrollBar { } .run-dialog-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } .run-dialog-error-label { - color: #EA4335; + color: #D93025; } .run-dialog-error-box { @@ -1110,7 +1110,7 @@ StScrollView StScrollBar { } .lightbox { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .cinnamon-mount-operation-icon { @@ -1118,7 +1118,7 @@ StScrollView StScrollBar { } .mount-password-reask { - color: #FBBC05; + color: #F4B400; } .show-processes-dialog { @@ -1182,7 +1182,7 @@ StScrollView StScrollBar { } #keyboard { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .keyboard-key { @@ -1266,7 +1266,7 @@ StScrollView StScrollBar { .menu-category-button-greyed { padding: 0.4em 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-style: italic; } @@ -1352,7 +1352,7 @@ StScrollView StScrollBar { } .window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel { @@ -1360,7 +1360,7 @@ StScrollView StScrollBar { } .window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1390,11 +1390,11 @@ StScrollView StScrollBar { .grouped-window-list-badge { border-radius: 9999px; - background-color: #d6d6d6; + background-color: #1F1F1F; } .grouped-window-list-thumbnail-alert { - background: #FBBC05; + background: #F4B400; } .grouped-window-list-item-box { @@ -1424,11 +1424,11 @@ StScrollView StScrollBar { } .grouped-window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .grouped-window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1524,11 +1524,11 @@ StScrollView StScrollBar { min-width: 300px; padding: 12px 16px; spacing: 0.5em; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .workspace-button { - background-color: #d6d6d6; + background-color: #1F1F1F; width: 2em; height: 1em; color: rgba(255, 255, 255, 0.7); @@ -1541,11 +1541,11 @@ StScrollView StScrollBar { } .workspace-graph { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-graph .workspace { - background-color: #d6d6d6; + background-color: #1F1F1F; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -1647,7 +1647,7 @@ StScrollView StScrollBar { border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); padding: 12px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1696,8 +1696,8 @@ StScrollView StScrollBar { } .desklet-drag-placeholder { - border: 2px solid #4285F4; - background-color: rgba(0, 0, 0, 0.6); + border: 2px solid #1A73E8; + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1749,7 +1749,7 @@ StScrollView StScrollBar { } .expo-workspaces-name-entry { - font-size: 10.5pt; + font-size: 12pt; font-weight: 400; background-color: rgba(255, 255, 255, 0.04); color: white; @@ -1810,7 +1810,7 @@ StScrollView StScrollBar { } .flashspot { - background-color: #4285F4; + background-color: #1A73E8; } .osd-window { @@ -1826,7 +1826,7 @@ StScrollView StScrollBar { .osd-window .level-bar { border-radius: 0.3em; - background-color: #4285F4; + background-color: #1A73E8; } .tile-hud:top { diff --git a/src/cinnamon/cinnamon.css b/src/cinnamon/cinnamon.css index 429b652bb..63c69687d 100644 --- a/src/cinnamon/cinnamon.css +++ b/src/cinnamon/cinnamon.css @@ -99,11 +99,11 @@ .slider, .popup-slider-menu-item, .sound-player .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -128,13 +128,13 @@ border-radius: 2px 2px 0 0; color: rgba(0, 0, 0, 0.87); caret-color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } #notification StEntry:focus, .run-dialog-entry:focus, #menu-search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; padding: 0 8px; border-width: 0; color: rgba(0, 0, 0, 0.87); @@ -209,13 +209,13 @@ } .tile-preview, .tile-hud { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 2px solid rgba(0, 0, 0, 0.12); } .tile-preview.snap, .tile-hud.snap { - background-color: rgba(0, 0, 0, 0.6); - border: 2px solid #4285F4; + background-color: rgba(0, 0, 0, 0.3); + border: 2px solid #1A73E8; } .overview-empty-placeholder, .info-osd, .workspace-osd, #LookingGlassDialog, .switcher-list, .modal-dialog, .osd-window { @@ -242,7 +242,7 @@ stage { } .cinnamon-link { - color: #4285F4; + color: #1A73E8; font-style: italic; } @@ -265,7 +265,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StBin#trough { @@ -343,7 +343,7 @@ StScrollView StScrollBar { } .popup-image-menu-item { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-combobox-item { @@ -396,7 +396,7 @@ StScrollView StScrollBar { #panel { color: rgba(255, 255, 255, 0.7); - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); height: 2.5em; width: 3.2em; } @@ -469,23 +469,23 @@ StScrollView StScrollBar { } .panel-top .window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .window-list-item-box:active:hover, .panel-top .window-list-item-box:checked:hover, .panel-top .window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:active:hover, .panel-top .grouped-window-list-item-box:checked:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-item-box:focus:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .grouped-window-list-badge { @@ -497,7 +497,7 @@ StScrollView StScrollBar { } .panel-top .workspace-graph:hover, .panel-top .workspace-button:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-box { @@ -505,11 +505,11 @@ StScrollView StScrollBar { } .panel-top .applet-box:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .panel-launchers .launcher:hover { - box-shadow: 0 3px 0 0 #4285F4 inset; + box-shadow: 0 3px 0 0 #1A73E8 inset; } .panel-top .applet-separator { @@ -517,27 +517,27 @@ StScrollView StScrollBar { } .panel-top .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .window-list-item-box:active:hover, .panel-bottom .window-list-item-box:checked:hover, .panel-bottom .window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:active:hover, .panel-bottom .grouped-window-list-item-box:checked:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .grouped-window-list-item-box:focus:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .workspace-switcher, .panel-bottom .workspace-graph, .panel-bottom .workspace-button { @@ -545,7 +545,7 @@ StScrollView StScrollBar { } .panel-bottom .workspace-graph:hover, .panel-bottom .workspace-button:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-box { @@ -553,11 +553,11 @@ StScrollView StScrollBar { } .panel-bottom .applet-box:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .panel-launchers .launcher:hover { - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .panel-bottom .applet-separator { @@ -565,27 +565,27 @@ StScrollView StScrollBar { } .panel-bottom .systray:hover { - box-shadow: 0 4px 0 0 #4285F4 inset; + box-shadow: 0 4px 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .window-list-item-box:active:hover, .panel-left .window-list-item-box:checked:hover, .panel-left .window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:active:hover, .panel-left .grouped-window-list-item-box:checked:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-item-box:focus:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .grouped-window-list-badge { @@ -598,7 +598,7 @@ StScrollView StScrollBar { } .panel-left .workspace-graph:hover, .panel-left .workspace-button:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-box { @@ -606,11 +606,11 @@ StScrollView StScrollBar { } .panel-left .applet-box:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .panel-launchers .launcher:hover { - box-shadow: 3px 0 0 0 #4285F4 inset; + box-shadow: 3px 0 0 0 #1A73E8 inset; } .panel-left .applet-separator { @@ -618,27 +618,27 @@ StScrollView StScrollBar { } .panel-left .systray:hover { - box-shadow: 4px 0 0 0 #4285F4 inset; + box-shadow: 4px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .window-list-item-box:active:hover, .panel-right .window-list-item-box:checked:hover, .panel-right .window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:active:hover, .panel-right .grouped-window-list-item-box:checked:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .grouped-window-list-item-box:focus:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .workspace-switcher, .panel-right .workspace-graph, .panel-right .workspace-button { @@ -647,7 +647,7 @@ StScrollView StScrollBar { } .panel-right .workspace-graph:hover, .panel-right .workspace-button:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-box { @@ -655,11 +655,11 @@ StScrollView StScrollBar { } .panel-right .applet-box:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .panel-launchers .launcher:hover { - box-shadow: -3px 0 0 0 #4285F4 inset; + box-shadow: -3px 0 0 0 #1A73E8 inset; } .panel-right .applet-separator { @@ -667,7 +667,7 @@ StScrollView StScrollBar { } .panel-right .systray:hover { - box-shadow: -4px 0 0 0 #4285F4 inset; + box-shadow: -4px 0 0 0 #1A73E8 inset; } .panel-status-button { @@ -689,11 +689,11 @@ StScrollView StScrollBar { } .system-status-icon.warning { - color: #FBBC05; + color: #F4B400; } .system-status-icon.error { - color: #EA4335; + color: #D93025; } #overview { @@ -713,7 +713,7 @@ StScrollView StScrollBar { .window-caption#selected, .window-caption:focus { color: white; - box-shadow: 0 -3px 0 0 #4285F4 inset; + box-shadow: 0 -3px 0 0 #1A73E8 inset; } .workspace-controls { @@ -769,7 +769,7 @@ StScrollView StScrollBar { .window-close-area { background-image: url(assets/trash-icon.png); background-size: 100px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 0, 0, 0.12); border-bottom-width: 0; border-radius: 20px 20px 0 0; @@ -778,11 +778,11 @@ StScrollView StScrollBar { } .expo-background { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-overview-background-shade { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .expo-workspace-thumbnail-frame { @@ -790,7 +790,7 @@ StScrollView StScrollBar { } .expo-workspace-thumbnail-frame#active { - border: 1px solid #4285F4; + border: 1px solid #1A73E8; } #LookingGlassDialog { @@ -807,7 +807,7 @@ StScrollView StScrollBar { .datemenu-date-label { font-size: 15pt; font-weight: 500; - height: 26px; + height: 28px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -822,7 +822,7 @@ StScrollView StScrollBar { .calendar-month-label { font-size: 10.5pt; font-weight: 500; - height: 18px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -854,8 +854,8 @@ StScrollView StScrollBar { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -867,15 +867,15 @@ StScrollView StScrollBar { .calendar-day-base:active { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; } .calendar-week-number { font-size: 9pt; font-weight: 400; - width: 23px; - height: 30px; + width: 25px; + height: 32px; margin: 2px; padding: 0; border-radius: 100px; @@ -887,8 +887,8 @@ StScrollView StScrollBar { .calendar-day-heading { font-size: 9pt; font-weight: 400; - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 0; border-radius: 100px; @@ -919,7 +919,7 @@ StScrollView StScrollBar { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -931,8 +931,8 @@ StScrollView StScrollBar { } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -961,7 +961,7 @@ StScrollView StScrollBar { } #notification .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-with-image { @@ -1059,7 +1059,7 @@ StScrollView StScrollBar { .switcher-arrow { border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -1067,14 +1067,14 @@ StScrollView StScrollBar { } .switcher-preview-backdrop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .ripple-box { width: 104px; height: 104px; background-image: url(assets/corner-ripple.png); - background-color: #4285F4; + background-color: #1A73E8; border-radius: 52px; } @@ -1087,12 +1087,12 @@ StScrollView StScrollBar { } .run-dialog-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } .run-dialog-error-label { - color: #EA4335; + color: #D93025; } .run-dialog-error-box { @@ -1110,7 +1110,7 @@ StScrollView StScrollBar { } .lightbox { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .cinnamon-mount-operation-icon { @@ -1118,7 +1118,7 @@ StScrollView StScrollBar { } .mount-password-reask { - color: #FBBC05; + color: #F4B400; } .show-processes-dialog { @@ -1182,7 +1182,7 @@ StScrollView StScrollBar { } #keyboard { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .keyboard-key { @@ -1266,7 +1266,7 @@ StScrollView StScrollBar { .menu-category-button-greyed { padding: 0.4em 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-style: italic; } @@ -1352,7 +1352,7 @@ StScrollView StScrollBar { } .window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .window-list-item-box.top StLabel, .window-list-item-box.bottom StLabel { @@ -1360,7 +1360,7 @@ StScrollView StScrollBar { } .window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1390,11 +1390,11 @@ StScrollView StScrollBar { .grouped-window-list-badge { border-radius: 9999px; - background-color: #d6d6d6; + background-color: #1F1F1F; } .grouped-window-list-thumbnail-alert { - background: #FBBC05; + background: #F4B400; } .grouped-window-list-item-box { @@ -1424,11 +1424,11 @@ StScrollView StScrollBar { } .grouped-window-list-item-box .progress { - background-color: #34A853; + background-color: #0F9D58; } .grouped-window-list-item-demands-attention { - background-color: #383838; + background-color: #353535; color: rgba(255, 255, 255, 0.7); } @@ -1524,11 +1524,11 @@ StScrollView StScrollBar { min-width: 300px; padding: 12px 16px; spacing: 0.5em; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .workspace-button { - background-color: #d6d6d6; + background-color: #1F1F1F; width: 2em; height: 1em; color: rgba(255, 255, 255, 0.7); @@ -1541,11 +1541,11 @@ StScrollView StScrollBar { } .workspace-graph { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .workspace-graph .workspace { - background-color: #d6d6d6; + background-color: #1F1F1F; border: 1px solid rgba(0, 0, 0, 0.12); } @@ -1647,7 +1647,7 @@ StScrollView StScrollBar { border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); padding: 12px; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1696,8 +1696,8 @@ StScrollView StScrollBar { } .desklet-drag-placeholder { - border: 2px solid #4285F4; - background-color: rgba(0, 0, 0, 0.6); + border: 2px solid #1A73E8; + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; } @@ -1749,7 +1749,7 @@ StScrollView StScrollBar { } .expo-workspaces-name-entry { - font-size: 10.5pt; + font-size: 12pt; font-weight: 400; background-color: rgba(255, 255, 255, 0.04); color: white; @@ -1810,7 +1810,7 @@ StScrollView StScrollBar { } .flashspot { - background-color: #4285F4; + background-color: #1A73E8; } .osd-window { @@ -1826,7 +1826,7 @@ StScrollView StScrollBar { .osd-window .level-bar { border-radius: 0.3em; - background-color: #4285F4; + background-color: #1A73E8; } .tile-hud:top { diff --git a/src/gnome-shell/3.18/gnome-shell-compact.css b/src/gnome-shell/3.18/gnome-shell-compact.css index 612c302e7..d3775e90e 100644 --- a/src/gnome-shell/3.18/gnome-shell-compact.css +++ b/src/gnome-shell/3.18/gnome-shell-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .combo-box-label { @@ -915,7 +919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -936,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -970,7 +974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1014,11 +1018,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1031,7 +1035,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1047,8 +1051,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); transition-duration: 100ms; @@ -1105,7 +1109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1134,13 +1138,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-today-button, .world-clocks-button, .message-list-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1181,7 +1185,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .message-list-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1191,7 +1195,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1206,8 +1210,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1244,8 +1248,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1258,13 +1262,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:active, .calendar-day-base:selected { transition-duration: 200ms; color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24) !important; + background-color: rgba(26, 115, 232, 0.24) !important; border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1298,7 +1302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1306,12 +1310,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1343,8 +1346,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section-close > StIcon { icon-size: 16px; border-radius: 16px; - padding: 4.5px; - color: rgba(0, 0, 0, 0.54); + padding: 6px; + color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -1362,7 +1365,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1397,7 +1400,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-secondary-bin { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-secondary-bin > StIcon { @@ -1413,9 +1416,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1424,7 +1427,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1445,7 +1448,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1526,7 +1529,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1663,7 +1666,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1872,7 +1875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2086,20 +2089,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2142,7 +2145,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2154,15 +2157,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2172,7 +2177,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2210,7 +2215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2222,7 +2227,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2289,7 +2294,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2344,7 +2349,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2353,7 +2358,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2408,9 +2413,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2435,12 +2440,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2458,13 +2463,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2476,8 +2481,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2544,7 +2549,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2583,8 +2589,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2594,7 +2602,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2603,7 +2611,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2633,7 +2641,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2810,13 +2818,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2836,7 +2844,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2858,7 +2866,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2867,7 +2875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2896,7 +2904,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2919,7 +2927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; transition-duration: 200ms; @@ -2935,16 +2943,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2958,12 +2966,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -2973,8 +2982,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -2982,8 +2991,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3001,7 +3010,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3045,7 +3055,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3105,151 +3115,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3263,12 +3281,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { 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 54de9517d..3f070dbd1 100644 --- a/src/gnome-shell/3.18/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.18/gnome-shell-dark-compact.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .access-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Geolocation Dialog */ @@ -728,7 +732,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .geolocation-dialog-reason { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Network Agent Dialog */ @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -832,7 +836,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -885,7 +889,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .combo-box-label { @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -987,7 +991,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1014,11 +1018,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1031,7 +1035,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1047,8 +1051,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); transition-duration: 100ms; @@ -1105,7 +1109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #calendarArea { @@ -1134,13 +1138,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-today-button, .world-clocks-button, .message-list-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1191,7 +1195,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1206,8 +1210,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1244,8 +1248,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1263,8 +1267,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1306,12 +1310,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1343,7 +1346,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section-close > StIcon { icon-size: 16px; border-radius: 16px; - padding: 4.5px; + padding: 6px; color: rgba(255, 255, 255, 0.7); background-color: transparent; } @@ -1362,7 +1365,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1413,7 +1416,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1849,7 +1852,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1872,7 +1875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2086,7 +2089,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2099,21 +2102,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2142,7 +2145,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2154,15 +2157,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2289,7 +2294,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2353,7 +2358,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2373,7 +2378,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2390,7 +2395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2399,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2408,9 +2413,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2423,7 +2428,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2440,7 +2445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2464,7 +2469,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2476,8 +2481,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2544,7 +2549,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2583,6 +2589,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2633,7 +2641,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2810,13 +2818,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2836,7 +2844,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2858,7 +2866,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2867,12 +2875,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2884,7 +2892,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2918,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -2958,7 +2966,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; @@ -3002,6 +3011,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3036,7 +3046,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3045,7 +3055,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3105,145 +3115,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ diff --git a/src/gnome-shell/3.18/gnome-shell-dark.css b/src/gnome-shell/3.18/gnome-shell-dark.css index 3c49be6a4..a1336de56 100644 --- a/src/gnome-shell/3.18/gnome-shell-dark.css +++ b/src/gnome-shell/3.18/gnome-shell-dark.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .access-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Geolocation Dialog */ @@ -728,7 +732,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .geolocation-dialog-reason { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Network Agent Dialog */ @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -832,7 +836,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -885,7 +889,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .combo-box-label { @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -987,7 +991,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1014,11 +1018,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1031,7 +1035,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1105,7 +1109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #calendarArea { @@ -1134,13 +1138,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-today-button, .world-clocks-button, .message-list-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1191,7 +1195,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1206,8 +1210,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1244,8 +1248,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1263,8 +1267,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1306,12 +1310,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1343,7 +1346,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section-close > StIcon { icon-size: 16px; border-radius: 16px; - padding: 7px; + padding: 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; } @@ -1362,7 +1365,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1413,7 +1416,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1849,7 +1852,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1872,7 +1875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2086,7 +2089,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2099,21 +2102,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2142,7 +2145,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2154,15 +2157,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2289,7 +2294,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2353,7 +2358,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2373,7 +2378,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2390,7 +2395,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2399,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2408,9 +2413,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2423,7 +2428,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2440,7 +2445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2464,7 +2469,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2476,8 +2481,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2544,7 +2549,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2583,6 +2589,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2633,7 +2641,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2810,13 +2818,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2836,7 +2844,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2858,7 +2866,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2867,12 +2875,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2884,7 +2892,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2918,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -2958,7 +2966,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; @@ -3002,6 +3011,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3036,7 +3046,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3045,7 +3055,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3105,145 +3115,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ 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 612c302e7..446a7b0ae 100644 --- a/src/gnome-shell/3.18/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.18/gnome-shell-light-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .combo-box-label { @@ -915,7 +919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -936,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -970,7 +974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1014,11 +1018,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1031,7 +1035,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1047,8 +1051,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); transition-duration: 100ms; @@ -1105,7 +1109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1134,13 +1138,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-today-button, .world-clocks-button, .message-list-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1181,7 +1185,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .message-list-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1191,7 +1195,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1206,8 +1210,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1244,8 +1248,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1258,13 +1262,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:active, .calendar-day-base:selected { transition-duration: 200ms; color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24) !important; + background-color: rgba(26, 115, 232, 0.24) !important; border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1298,7 +1302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1306,12 +1310,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1343,8 +1346,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section-close > StIcon { icon-size: 16px; border-radius: 16px; - padding: 4.5px; - color: rgba(0, 0, 0, 0.54); + padding: 6px; + color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -1362,7 +1365,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1397,7 +1400,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-secondary-bin { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-secondary-bin > StIcon { @@ -1413,9 +1416,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1424,7 +1427,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1445,7 +1448,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1526,7 +1529,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1663,7 +1666,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1872,7 +1875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2086,20 +2089,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2142,7 +2145,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2154,15 +2157,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2172,7 +2177,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2210,7 +2215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2222,7 +2227,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2289,7 +2294,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2344,7 +2349,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2353,7 +2358,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2408,9 +2413,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2435,12 +2440,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2458,13 +2463,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2476,8 +2481,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2544,7 +2549,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2583,8 +2589,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2594,7 +2602,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2603,7 +2611,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2633,7 +2641,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2810,13 +2818,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2836,7 +2844,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2858,7 +2866,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2867,7 +2875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2896,7 +2904,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2919,7 +2927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; transition-duration: 200ms; @@ -2935,16 +2943,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2958,12 +2966,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -2973,8 +2982,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -2982,8 +2991,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3001,7 +3010,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3045,7 +3055,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3105,151 +3115,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3263,12 +3281,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.18/gnome-shell-light.css b/src/gnome-shell/3.18/gnome-shell-light.css index cf51964ce..99ff00938 100644 --- a/src/gnome-shell/3.18/gnome-shell-light.css +++ b/src/gnome-shell/3.18/gnome-shell-light.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .combo-box-label { @@ -915,7 +919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -936,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -970,7 +974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1014,11 +1018,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1031,7 +1035,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1105,7 +1109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1134,13 +1138,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-today-button, .world-clocks-button, .message-list-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1181,7 +1185,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .message-list-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1191,7 +1195,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1206,8 +1210,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1244,8 +1248,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1258,13 +1262,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:active, .calendar-day-base:selected { transition-duration: 200ms; color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24) !important; + background-color: rgba(26, 115, 232, 0.24) !important; border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1298,7 +1302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1306,12 +1310,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1343,8 +1346,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section-close > StIcon { icon-size: 16px; border-radius: 16px; - padding: 7px; - color: rgba(0, 0, 0, 0.54); + padding: 8px; + color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -1362,7 +1365,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1397,7 +1400,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-secondary-bin { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-secondary-bin > StIcon { @@ -1413,9 +1416,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1424,7 +1427,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1445,7 +1448,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1526,7 +1529,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1663,7 +1666,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1872,7 +1875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2086,20 +2089,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2142,7 +2145,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2154,15 +2157,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2172,7 +2177,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2210,7 +2215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2222,7 +2227,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2289,7 +2294,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2344,7 +2349,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2353,7 +2358,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2408,9 +2413,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2435,12 +2440,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2458,13 +2463,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2476,8 +2481,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2544,7 +2549,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2583,8 +2589,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2594,7 +2602,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2603,7 +2611,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2633,7 +2641,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2810,13 +2818,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2836,7 +2844,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2858,7 +2866,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2867,7 +2875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2896,7 +2904,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2919,7 +2927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; transition-duration: 200ms; @@ -2935,16 +2943,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2958,12 +2966,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -2973,8 +2982,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -2982,8 +2991,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3001,7 +3010,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3045,7 +3055,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3105,151 +3115,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3263,12 +3281,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.18/gnome-shell.css b/src/gnome-shell/3.18/gnome-shell.css index cf51964ce..c6e66415d 100644 --- a/src/gnome-shell/3.18/gnome-shell.css +++ b/src/gnome-shell/3.18/gnome-shell.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .combo-box-label { @@ -915,7 +919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -936,7 +940,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -970,7 +974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1014,11 +1018,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1031,7 +1035,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1105,7 +1109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1134,13 +1138,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .datemenu-today-button, .world-clocks-button, .message-list-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1181,7 +1185,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .message-list-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1191,7 +1195,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1206,8 +1210,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1244,8 +1248,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1258,13 +1262,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:active, .calendar-day-base:selected { transition-duration: 200ms; color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24) !important; + background-color: rgba(26, 115, 232, 0.24) !important; border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1298,7 +1302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1306,12 +1310,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1343,8 +1346,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-list-section-close > StIcon { icon-size: 16px; border-radius: 16px; - padding: 7px; - color: rgba(0, 0, 0, 0.54); + padding: 8px; + color: rgba(0, 0, 0, 0.6); background-color: transparent; } @@ -1362,7 +1365,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1397,7 +1400,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-secondary-bin { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-secondary-bin > StIcon { @@ -1413,9 +1416,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1424,7 +1427,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1445,7 +1448,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1526,7 +1529,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1663,7 +1666,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1872,7 +1875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2086,20 +2089,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2142,7 +2145,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2154,15 +2157,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2172,7 +2177,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2210,7 +2215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2222,7 +2227,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2289,7 +2294,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2344,7 +2349,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2353,7 +2358,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2408,9 +2413,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2435,12 +2440,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2458,13 +2463,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2476,8 +2481,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2544,7 +2549,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2583,8 +2589,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2594,7 +2602,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2603,7 +2611,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2633,7 +2641,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2810,13 +2818,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2836,7 +2844,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2858,7 +2866,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2867,7 +2875,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2896,7 +2904,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2919,7 +2927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; transition-duration: 200ms; @@ -2935,16 +2943,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2958,12 +2966,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -2973,8 +2982,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -2982,8 +2991,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3001,7 +3010,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3045,7 +3055,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3105,151 +3115,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3263,12 +3281,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.24/gnome-shell-compact.css b/src/gnome-shell/3.24/gnome-shell-compact.css index 411e20854..28c860a5e 100644 --- a/src/gnome-shell/3.24/gnome-shell-compact.css +++ b/src/gnome-shell/3.24/gnome-shell-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -923,7 +927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -960,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -978,7 +982,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1022,11 +1026,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1039,7 +1043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1055,8 +1059,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); transition-duration: 100ms; @@ -1113,7 +1117,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1159,13 +1163,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1211,7 +1215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1225,7 +1229,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1240,8 +1244,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1278,8 +1282,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1298,13 +1302,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1338,7 +1342,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1346,12 +1350,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1372,12 +1375,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1391,7 +1398,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1431,7 +1438,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1451,9 +1458,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1462,7 +1469,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1483,7 +1490,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1569,7 +1576,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1706,7 +1713,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1915,7 +1922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2129,20 +2136,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2185,7 +2192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2197,15 +2204,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2215,7 +2224,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2253,7 +2262,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2265,7 +2274,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2332,7 +2341,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2387,7 +2396,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2396,7 +2405,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2451,9 +2460,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2478,12 +2487,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2501,13 +2510,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2519,8 +2528,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2587,7 +2596,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2626,8 +2636,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2637,7 +2649,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2646,7 +2658,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2676,7 +2688,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2853,13 +2865,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2879,7 +2891,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2901,7 +2913,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2910,7 +2922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2939,7 +2951,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2963,7 +2975,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2978,16 +2990,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3001,12 +3013,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3016,8 +3029,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3025,8 +3038,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3044,7 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3088,7 +3102,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3148,151 +3162,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3306,12 +3328,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { 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 8b0697b81..4962204bf 100644 --- a/src/gnome-shell/3.24/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.24/gnome-shell-dark-compact.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .access-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Geolocation Dialog */ @@ -728,7 +732,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .geolocation-dialog-reason { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Network Agent Dialog */ @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -832,7 +836,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -885,7 +889,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -995,7 +999,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1022,11 +1026,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1039,7 +1043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1055,8 +1059,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); transition-duration: 100ms; @@ -1113,7 +1117,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #calendarArea { @@ -1159,13 +1163,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1225,7 +1229,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1240,8 +1244,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1278,8 +1282,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1303,8 +1307,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1346,12 +1350,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1372,12 +1375,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1391,7 +1398,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1451,7 +1458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1892,7 +1899,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1915,7 +1922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2129,7 +2136,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2142,21 +2149,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2185,7 +2192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2197,15 +2204,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2332,7 +2341,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2396,7 +2405,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2416,7 +2425,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2433,7 +2442,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2442,7 +2451,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2451,9 +2460,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2466,7 +2475,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2483,7 +2492,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2507,7 +2516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2519,8 +2528,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2587,7 +2596,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2626,6 +2636,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2676,7 +2688,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2853,13 +2865,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2879,7 +2891,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2901,7 +2913,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2910,12 +2922,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2927,7 +2939,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2962,7 +2974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3001,7 +3013,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; @@ -3045,6 +3058,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3079,7 +3093,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3088,7 +3102,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3148,145 +3162,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ diff --git a/src/gnome-shell/3.24/gnome-shell-dark.css b/src/gnome-shell/3.24/gnome-shell-dark.css index 14a3ef330..a4352b201 100644 --- a/src/gnome-shell/3.24/gnome-shell-dark.css +++ b/src/gnome-shell/3.24/gnome-shell-dark.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .access-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Geolocation Dialog */ @@ -728,7 +732,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .geolocation-dialog-reason { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* Network Agent Dialog */ @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -832,7 +836,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -885,7 +889,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -995,7 +999,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1022,11 +1026,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1039,7 +1043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1113,7 +1117,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #calendarArea { @@ -1159,13 +1163,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1225,7 +1229,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1240,8 +1244,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1278,8 +1282,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1303,8 +1307,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1346,12 +1350,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1372,12 +1375,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1391,7 +1398,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1451,7 +1458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1892,7 +1899,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1915,7 +1922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2129,7 +2136,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2142,21 +2149,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2185,7 +2192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2197,15 +2204,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2332,7 +2341,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2396,7 +2405,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2416,7 +2425,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2433,7 +2442,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2442,7 +2451,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2451,9 +2460,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2466,7 +2475,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2483,7 +2492,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2507,7 +2516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2519,8 +2528,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2587,7 +2596,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2626,6 +2636,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2676,7 +2688,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2853,13 +2865,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2879,7 +2891,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2901,7 +2913,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2910,12 +2922,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2927,7 +2939,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2962,7 +2974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3001,7 +3013,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; @@ -3045,6 +3058,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3079,7 +3093,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3088,7 +3102,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3148,145 +3162,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ 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 411e20854..b9b1becb7 100644 --- a/src/gnome-shell/3.24/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.24/gnome-shell-light-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -923,7 +927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -960,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -978,7 +982,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1022,11 +1026,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1039,7 +1043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1055,8 +1059,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); transition-duration: 100ms; @@ -1113,7 +1117,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1159,13 +1163,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1211,7 +1215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1225,7 +1229,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1240,8 +1244,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1278,8 +1282,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1298,13 +1302,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1338,7 +1342,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1346,12 +1350,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1372,12 +1375,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1391,7 +1398,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1431,7 +1438,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1451,9 +1458,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1462,7 +1469,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1483,7 +1490,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1569,7 +1576,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1706,7 +1713,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1915,7 +1922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2129,20 +2136,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2185,7 +2192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2197,15 +2204,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2215,7 +2224,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2253,7 +2262,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2265,7 +2274,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2332,7 +2341,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2387,7 +2396,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2396,7 +2405,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2451,9 +2460,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2478,12 +2487,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2501,13 +2510,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2519,8 +2528,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2587,7 +2596,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2626,8 +2636,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2637,7 +2649,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2646,7 +2658,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2676,7 +2688,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2853,13 +2865,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2879,7 +2891,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2901,7 +2913,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2910,7 +2922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2939,7 +2951,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2963,7 +2975,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2978,16 +2990,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3001,12 +3013,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3016,8 +3029,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3025,8 +3038,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3044,7 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3088,7 +3102,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3148,151 +3162,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3306,12 +3328,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.24/gnome-shell-light.css b/src/gnome-shell/3.24/gnome-shell-light.css index 35b185869..03ca52189 100644 --- a/src/gnome-shell/3.24/gnome-shell-light.css +++ b/src/gnome-shell/3.24/gnome-shell-light.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -923,7 +927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -960,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -978,7 +982,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1022,11 +1026,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1039,7 +1043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1113,7 +1117,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1159,13 +1163,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1211,7 +1215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1225,7 +1229,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1240,8 +1244,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1278,8 +1282,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1298,13 +1302,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1338,7 +1342,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1346,12 +1350,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1372,12 +1375,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1391,7 +1398,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1431,7 +1438,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1451,9 +1458,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1462,7 +1469,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1483,7 +1490,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1569,7 +1576,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1706,7 +1713,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1915,7 +1922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2129,20 +2136,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2185,7 +2192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2197,15 +2204,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2215,7 +2224,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2253,7 +2262,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2265,7 +2274,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2332,7 +2341,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2387,7 +2396,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2396,7 +2405,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2451,9 +2460,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2478,12 +2487,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2501,13 +2510,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2519,8 +2528,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2587,7 +2596,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2626,8 +2636,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2637,7 +2649,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2646,7 +2658,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2676,7 +2688,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2853,13 +2865,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2879,7 +2891,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2901,7 +2913,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2910,7 +2922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2939,7 +2951,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2963,7 +2975,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2978,16 +2990,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3001,12 +3013,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3016,8 +3029,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3025,8 +3038,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3044,7 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3088,7 +3102,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3148,151 +3162,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3306,12 +3328,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.24/gnome-shell.css b/src/gnome-shell/3.24/gnome-shell.css index 35b185869..12bf61946 100644 --- a/src/gnome-shell/3.24/gnome-shell.css +++ b/src/gnome-shell/3.24/gnome-shell.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -425,7 +429,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -477,7 +481,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -591,7 +595,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -621,7 +625,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -701,8 +705,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .access-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Geolocation Dialog */ @@ -727,8 +731,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .geolocation-dialog-reason { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* Network Agent Dialog */ @@ -770,17 +774,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -824,7 +828,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -866,7 +870,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -878,14 +882,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .level-bar { - background-color: #4285F4; + background-color: #1A73E8; border-radius: 0; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -923,7 +927,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -944,7 +948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -952,7 +956,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -960,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -978,7 +982,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1022,11 +1026,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1039,7 +1043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1113,7 +1117,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #calendarArea { @@ -1159,13 +1163,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1211,7 +1215,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1225,7 +1229,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1240,8 +1244,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1278,8 +1282,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1298,13 +1302,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1338,7 +1342,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1346,12 +1350,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1372,12 +1375,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1391,7 +1398,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1431,7 +1438,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1451,9 +1458,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1462,7 +1469,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1483,7 +1490,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1569,7 +1576,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1706,7 +1713,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1915,7 +1922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2129,20 +2136,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2185,7 +2192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2197,15 +2204,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2215,7 +2224,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2253,7 +2262,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2265,7 +2274,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2332,7 +2341,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .legacy-tray { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; border: none; border-bottom-width: 0; @@ -2387,7 +2396,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2396,7 +2405,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2451,9 +2460,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2478,12 +2487,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2501,13 +2510,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2519,8 +2528,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2587,7 +2596,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2626,8 +2636,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2637,7 +2649,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2646,7 +2658,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2676,7 +2688,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2853,13 +2865,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2879,7 +2891,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2901,7 +2913,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2910,7 +2922,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2939,7 +2951,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2963,7 +2975,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2978,16 +2990,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3001,12 +3013,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3016,8 +3029,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3025,8 +3038,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3044,7 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3088,7 +3102,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3148,151 +3162,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3306,12 +3328,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.26/gnome-shell-compact.css b/src/gnome-shell/3.26/gnome-shell-compact.css index 9c529d8cb..69c988b9f 100644 --- a/src/gnome-shell/3.26/gnome-shell-compact.css +++ b/src/gnome-shell/3.26/gnome-shell-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1043,8 +1047,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2381,7 +2390,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2436,9 +2445,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2486,13 +2495,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2504,8 +2513,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2572,7 +2581,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2611,8 +2621,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2622,7 +2634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2631,7 +2643,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2661,7 +2673,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2838,13 +2850,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2864,7 +2876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2886,7 +2898,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2895,7 +2907,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2924,7 +2936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2948,7 +2960,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2963,16 +2975,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2986,12 +2998,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3001,8 +3014,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3010,8 +3023,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3029,7 +3042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3073,7 +3087,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3133,151 +3147,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3291,12 +3313,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { 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 f5c371bb9..4e9faafac 100644 --- a/src/gnome-shell/3.26/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.26/gnome-shell-dark-compact.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -417,7 +421,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -819,7 +823,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -983,7 +987,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1043,8 +1047,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1344,8 +1348,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1492,7 +1499,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1924,7 +1931,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,7 +2176,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2182,21 +2189,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2381,7 +2390,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2401,7 +2410,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2418,7 +2427,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2427,7 +2436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2436,9 +2445,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2451,7 +2460,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2468,7 +2477,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2492,7 +2501,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2504,8 +2513,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2572,7 +2581,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2611,6 +2621,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2661,7 +2673,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2838,13 +2850,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2864,7 +2876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2886,7 +2898,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2895,12 +2907,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2912,7 +2924,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2947,7 +2959,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -2986,7 +2998,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; @@ -3030,6 +3043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3064,7 +3078,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3073,7 +3087,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3133,145 +3147,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ diff --git a/src/gnome-shell/3.26/gnome-shell-dark.css b/src/gnome-shell/3.26/gnome-shell-dark.css index def1803e1..18be6e9b3 100644 --- a/src/gnome-shell/3.26/gnome-shell-dark.css +++ b/src/gnome-shell/3.26/gnome-shell-dark.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -417,7 +421,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -819,7 +823,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -983,7 +987,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1344,8 +1348,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1492,7 +1499,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1924,7 +1931,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,7 +2176,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2182,21 +2189,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2381,7 +2390,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2401,7 +2410,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2418,7 +2427,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2427,7 +2436,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2436,9 +2445,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2451,7 +2460,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2468,7 +2477,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2492,7 +2501,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2504,8 +2513,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2572,7 +2581,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2611,6 +2621,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2661,7 +2673,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2838,13 +2850,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2864,7 +2876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2886,7 +2898,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2895,12 +2907,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2912,7 +2924,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2947,7 +2959,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -2986,7 +2998,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; @@ -3030,6 +3043,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3064,7 +3078,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3073,7 +3087,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3133,145 +3147,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ 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 9c529d8cb..d688135a7 100644 --- a/src/gnome-shell/3.26/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.26/gnome-shell-light-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1043,8 +1047,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2381,7 +2390,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2436,9 +2445,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2486,13 +2495,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2504,8 +2513,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2572,7 +2581,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2611,8 +2621,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2622,7 +2634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2631,7 +2643,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2661,7 +2673,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2838,13 +2850,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2864,7 +2876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2886,7 +2898,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2895,7 +2907,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2924,7 +2936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2948,7 +2960,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2963,16 +2975,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2986,12 +2998,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3001,8 +3014,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3010,8 +3023,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3029,7 +3042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3073,7 +3087,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3133,151 +3147,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3291,12 +3313,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.26/gnome-shell-light.css b/src/gnome-shell/3.26/gnome-shell-light.css index 38831436d..d15e74877 100644 --- a/src/gnome-shell/3.26/gnome-shell-light.css +++ b/src/gnome-shell/3.26/gnome-shell-light.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2381,7 +2390,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2436,9 +2445,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2486,13 +2495,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2504,8 +2513,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2572,7 +2581,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2611,8 +2621,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2622,7 +2634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2631,7 +2643,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2661,7 +2673,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2838,13 +2850,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2864,7 +2876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2886,7 +2898,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2895,7 +2907,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2924,7 +2936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2948,7 +2960,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2963,16 +2975,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2986,12 +2998,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3001,8 +3014,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3010,8 +3023,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3029,7 +3042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3073,7 +3087,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3133,151 +3147,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3291,12 +3313,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.26/gnome-shell.css b/src/gnome-shell/3.26/gnome-shell.css index 38831436d..ade729600 100644 --- a/src/gnome-shell/3.26/gnome-shell.css +++ b/src/gnome-shell/3.26/gnome-shell.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2381,7 +2390,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* On-screen Keyboard */ #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .keyboard-layout { @@ -2436,9 +2445,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-subkeys { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2486,13 +2495,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2504,8 +2513,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2572,7 +2581,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2611,8 +2621,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2622,7 +2634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2631,7 +2643,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2661,7 +2673,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2838,13 +2850,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2864,7 +2876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2886,7 +2898,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2895,7 +2907,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2924,7 +2936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2948,7 +2960,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -2963,16 +2975,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -2986,12 +2998,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3001,8 +3014,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3010,8 +3023,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3029,7 +3042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3073,7 +3087,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3133,151 +3147,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3291,12 +3313,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.28/gnome-shell-compact.css b/src/gnome-shell/3.28/gnome-shell-compact.css index 150284ff3..aa3db66c9 100644 --- a/src/gnome-shell/3.28/gnome-shell-compact.css +++ b/src/gnome-shell/3.28/gnome-shell-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1043,8 +1047,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2388,7 +2397,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2439,9 +2448,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2456,12 +2465,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2506,12 +2515,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2529,13 +2538,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2547,8 +2556,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2615,7 +2624,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2654,8 +2664,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2665,7 +2677,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2674,7 +2686,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2704,7 +2716,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2881,13 +2893,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2907,7 +2919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2929,7 +2941,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2938,7 +2950,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2967,7 +2979,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2991,7 +3003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3006,16 +3018,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3029,12 +3041,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3044,8 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3053,8 +3066,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3072,7 +3085,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3116,7 +3130,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3176,151 +3190,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3334,12 +3356,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { 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 5e9c3d359..88437576d 100644 --- a/src/gnome-shell/3.28/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.28/gnome-shell-dark-compact.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -417,7 +421,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -819,7 +823,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -983,7 +987,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1043,8 +1047,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1344,8 +1348,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1492,7 +1499,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1924,7 +1931,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,7 +2176,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2182,21 +2189,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2388,7 +2397,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2404,7 +2413,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2421,7 +2430,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2430,7 +2439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2439,19 +2448,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { border-color: transparent; - background-color: #424242; + background-color: #3C3C3C; background-size: 24px; } .keyboard-key.default-key:active { - background-color: #686868; + background-color: #636363; } .keyboard-key.enter-key { @@ -2494,7 +2503,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2511,7 +2520,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2535,7 +2544,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2547,8 +2556,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2615,7 +2624,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2654,6 +2664,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2704,7 +2716,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2881,13 +2893,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2907,7 +2919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2929,7 +2941,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2938,12 +2950,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2955,7 +2967,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2990,7 +3002,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3029,7 +3041,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; @@ -3073,6 +3086,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3107,7 +3121,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3116,7 +3130,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3176,145 +3190,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ diff --git a/src/gnome-shell/3.28/gnome-shell-dark.css b/src/gnome-shell/3.28/gnome-shell-dark.css index 11d15c699..787d9469d 100644 --- a/src/gnome-shell/3.28/gnome-shell-dark.css +++ b/src/gnome-shell/3.28/gnome-shell-dark.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; @@ -73,6 +74,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -126,6 +129,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -359,7 +363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -417,7 +421,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -819,7 +823,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -983,7 +987,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1344,8 +1348,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1492,7 +1499,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1924,7 +1931,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,7 +2176,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2182,21 +2189,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2388,7 +2397,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2404,7 +2413,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2421,7 +2430,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2430,7 +2439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2439,19 +2448,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { border-color: transparent; - background-color: #424242; + background-color: #3C3C3C; background-size: 24px; } .keyboard-key.default-key:active { - background-color: #686868; + background-color: #636363; } .keyboard-key.enter-key { @@ -2494,7 +2503,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2511,7 +2520,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2535,7 +2544,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2547,8 +2556,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2615,7 +2624,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2654,6 +2664,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2704,7 +2716,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2881,13 +2893,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2907,7 +2919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2929,7 +2941,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2938,12 +2950,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2955,7 +2967,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2990,7 +3002,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3029,7 +3041,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; @@ -3073,6 +3086,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3107,7 +3121,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3116,7 +3130,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3176,145 +3190,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ 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 150284ff3..4d27ae82c 100644 --- a/src/gnome-shell/3.28/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.28/gnome-shell-light-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1043,8 +1047,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2388,7 +2397,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2439,9 +2448,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2456,12 +2465,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2506,12 +2515,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2529,13 +2538,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2547,8 +2556,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2615,7 +2624,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2654,8 +2664,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2665,7 +2677,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2674,7 +2686,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2704,7 +2716,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2881,13 +2893,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2907,7 +2919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2929,7 +2941,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2938,7 +2950,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2967,7 +2979,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2991,7 +3003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3006,16 +3018,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3029,12 +3041,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3044,8 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3053,8 +3066,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3072,7 +3085,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3116,7 +3130,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3176,151 +3190,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3334,12 +3356,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.28/gnome-shell-light.css b/src/gnome-shell/3.28/gnome-shell-light.css index 72bfcebca..5a3ea4ec3 100644 --- a/src/gnome-shell/3.28/gnome-shell-light.css +++ b/src/gnome-shell/3.28/gnome-shell-light.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2388,7 +2397,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2439,9 +2448,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2456,12 +2465,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2506,12 +2515,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2529,13 +2538,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2547,8 +2556,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2615,7 +2624,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2654,8 +2664,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2665,7 +2677,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2674,7 +2686,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2704,7 +2716,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2881,13 +2893,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2907,7 +2919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2929,7 +2941,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2938,7 +2950,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2967,7 +2979,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2991,7 +3003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3006,16 +3018,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3029,12 +3041,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3044,8 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3053,8 +3066,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3072,7 +3085,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3116,7 +3130,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3176,151 +3190,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3334,12 +3356,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.28/gnome-shell.css b/src/gnome-shell/3.28/gnome-shell.css index 72bfcebca..9bd47b327 100644 --- a/src/gnome-shell/3.28/gnome-shell.css +++ b/src/gnome-shell/3.28/gnome-shell.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,8 +45,8 @@ stage { } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -53,8 +54,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -72,7 +73,8 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,8 +100,8 @@ stage { } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -106,8 +109,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -125,7 +128,8 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,11 +247,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -slider-height: 2px; -slider-background-color: rgba(0, 0, 0, 0.26); -slider-border-color: transparent; - -slider-active-background-color: #4285F4; + -slider-active-background-color: #1A73E8; -slider-active-border-color: transparent; -slider-border-width: 0; -slider-handle-radius: 6px; @@ -294,11 +298,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -328,18 +332,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -385,7 +389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -416,8 +420,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -449,7 +453,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -501,7 +505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -608,7 +612,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -638,7 +642,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -710,7 +714,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -757,17 +761,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -811,7 +815,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -853,7 +857,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -872,7 +876,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; } #panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen { @@ -1027,7 +1031,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1106,11 +1110,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1123,11 +1127,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1139,7 +1143,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1200,13 +1204,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1252,7 +1256,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1266,7 +1270,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1281,8 +1285,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1319,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1339,13 +1343,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1379,7 +1383,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1387,12 +1391,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1413,12 +1416,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1432,7 +1439,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1472,7 +1479,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1492,9 +1499,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1503,7 +1510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1524,7 +1531,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1610,7 +1617,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .system-menu-action { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1745,7 +1752,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1793,7 +1800,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1955,7 +1962,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2169,20 +2176,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2225,7 +2232,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2237,15 +2244,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2255,7 +2264,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2293,7 +2302,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2305,7 +2314,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2372,7 +2381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2388,7 +2397,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2439,9 +2448,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2456,12 +2465,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2506,12 +2515,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2529,13 +2538,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2547,8 +2556,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2615,7 +2624,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2654,8 +2664,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2665,7 +2677,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2674,7 +2686,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2704,7 +2716,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2881,13 +2893,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2907,7 +2919,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2929,7 +2941,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2938,7 +2950,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2967,7 +2979,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2991,7 +3003,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3006,16 +3018,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3029,12 +3041,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3044,8 +3057,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3053,8 +3066,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3072,7 +3085,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3116,7 +3130,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3176,151 +3190,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3334,12 +3356,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.30/gnome-shell-compact.css b/src/gnome-shell/3.30/gnome-shell-compact.css index 3806ecc4f..3695d53f9 100644 --- a/src/gnome-shell/3.30/gnome-shell-compact.css +++ b/src/gnome-shell/3.30/gnome-shell-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -331,18 +335,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -388,7 +392,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -419,8 +423,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -452,7 +456,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -504,7 +508,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -611,7 +615,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -641,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -713,7 +717,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -760,17 +764,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -814,7 +818,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -856,7 +860,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -865,14 +869,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; font-feature-settings: "tnum"; } @@ -1028,7 +1032,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1044,8 +1048,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1107,11 +1111,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1124,15 +1128,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1144,7 +1148,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1205,13 +1209,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1257,7 +1261,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1271,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1286,8 +1290,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1324,8 +1328,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1345,13 +1349,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1385,7 +1389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1393,12 +1397,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1419,12 +1422,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1438,7 +1445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1478,7 +1485,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1498,9 +1505,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1509,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1530,7 +1537,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1617,7 +1624,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1752,7 +1759,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1800,7 +1807,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1962,7 +1969,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2176,20 +2183,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2232,7 +2239,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2244,15 +2251,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2262,7 +2271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2300,7 +2309,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2312,7 +2321,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2379,7 +2388,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2395,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2446,9 +2455,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2513,12 +2522,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2536,13 +2545,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2554,8 +2563,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2622,7 +2631,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2661,8 +2671,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2672,7 +2684,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2681,7 +2693,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2711,7 +2723,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2887,14 +2899,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2914,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2936,7 +2948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2945,7 +2957,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2974,7 +2986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2998,7 +3010,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3013,16 +3025,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3036,12 +3048,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3051,8 +3064,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3060,8 +3073,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3079,7 +3092,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3123,7 +3137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3183,151 +3197,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3341,12 +3363,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { 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 723fa2f0b..3b09bcebd 100644 --- a/src/gnome-shell/3.30/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.30/gnome-shell-dark-compact.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; @@ -45,6 +46,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -98,6 +101,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -249,7 +253,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-border-color: transparent; -barlevel-active-background-color: #8AB4F8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -362,7 +366,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -420,7 +424,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -452,7 +456,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -611,7 +615,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -641,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -814,7 +818,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -822,7 +826,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -856,7 +860,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -865,14 +869,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(255, 255, 255, 0.12); -barlevel-active-background-color: white; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -983,7 +987,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; font-feature-settings: "tnum"; } @@ -1028,7 +1032,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1044,8 +1048,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1124,15 +1128,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel .remote-access-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1144,7 +1148,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1205,13 +1209,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1271,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1286,8 +1290,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1324,8 +1328,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1350,8 +1354,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1393,12 +1397,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1419,12 +1422,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1438,7 +1445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1498,7 +1505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1800,7 +1807,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1931,7 +1938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1962,7 +1969,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2176,7 +2183,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2189,21 +2196,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2232,7 +2239,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2244,15 +2251,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2395,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2411,7 +2420,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2428,7 +2437,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2437,7 +2446,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2446,19 +2455,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { border-color: transparent; - background-color: #424242; + background-color: #3C3C3C; background-size: 24px; } .keyboard-key.default-key:active { - background-color: #686868; + background-color: #636363; } .keyboard-key.enter-key { @@ -2501,7 +2510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2518,7 +2527,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2542,7 +2551,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2554,8 +2563,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2622,7 +2631,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2661,6 +2671,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2711,7 +2723,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2887,14 +2899,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2914,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2936,7 +2948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2945,12 +2957,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2962,7 +2974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2997,7 +3009,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3036,7 +3048,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; @@ -3080,6 +3093,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3114,7 +3128,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3123,7 +3137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3183,145 +3197,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ diff --git a/src/gnome-shell/3.30/gnome-shell-dark.css b/src/gnome-shell/3.30/gnome-shell-dark.css index 0fa33cd12..a61f7687a 100644 --- a/src/gnome-shell/3.30/gnome-shell-dark.css +++ b/src/gnome-shell/3.30/gnome-shell-dark.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; @@ -45,6 +46,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -98,6 +101,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -249,7 +253,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-border-color: transparent; -barlevel-active-background-color: #8AB4F8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -362,7 +366,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -420,7 +424,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -452,7 +456,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -611,7 +615,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -641,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -814,7 +818,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -822,7 +826,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-rise: 0; -arrow-box-shadow: none; margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -856,7 +860,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -865,14 +869,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(255, 255, 255, 0.12); -barlevel-active-background-color: white; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -983,7 +987,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; font-feature-settings: "tnum"; } @@ -1028,7 +1032,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1124,15 +1128,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel .remote-access-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1144,7 +1148,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1205,13 +1209,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1271,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1286,8 +1290,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1324,8 +1328,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1350,8 +1354,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1393,12 +1397,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1419,12 +1422,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1438,7 +1445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1498,7 +1505,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1800,7 +1807,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1931,7 +1938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -1962,7 +1969,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2176,7 +2183,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2189,21 +2196,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2232,7 +2239,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2244,15 +2251,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2395,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2411,7 +2420,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2428,7 +2437,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2437,7 +2446,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2446,19 +2455,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { border-color: transparent; - background-color: #424242; + background-color: #3C3C3C; background-size: 24px; } .keyboard-key.default-key:active { - background-color: #686868; + background-color: #636363; } .keyboard-key.enter-key { @@ -2501,7 +2510,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2518,7 +2527,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2542,7 +2551,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2554,8 +2563,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2622,7 +2631,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2661,6 +2671,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2711,7 +2723,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2887,14 +2899,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2914,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2936,7 +2948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2945,12 +2957,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -2962,7 +2974,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -2997,7 +3009,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3036,7 +3048,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; @@ -3080,6 +3093,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3114,7 +3128,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3123,7 +3137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3183,145 +3197,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ 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 3806ecc4f..a4d0871cd 100644 --- a/src/gnome-shell/3.30/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.30/gnome-shell-light-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -331,18 +335,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -388,7 +392,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -419,8 +423,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -452,7 +456,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -504,7 +508,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -611,7 +615,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -641,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -713,7 +717,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -760,17 +764,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -814,7 +818,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -856,7 +860,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -865,14 +869,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; font-feature-settings: "tnum"; } @@ -1028,7 +1032,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1044,8 +1048,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1107,11 +1111,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1124,15 +1128,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1144,7 +1148,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1205,13 +1209,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1257,7 +1261,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1271,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1286,8 +1290,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1324,8 +1328,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1345,13 +1349,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1385,7 +1389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1393,12 +1397,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1419,12 +1422,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1438,7 +1445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1478,7 +1485,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1498,9 +1505,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1509,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1530,7 +1537,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1617,7 +1624,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1752,7 +1759,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1800,7 +1807,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1962,7 +1969,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2176,20 +2183,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2232,7 +2239,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2244,15 +2251,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2262,7 +2271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2300,7 +2309,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2312,7 +2321,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2379,7 +2388,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2395,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2446,9 +2455,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2513,12 +2522,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2536,13 +2545,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2554,8 +2563,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2622,7 +2631,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2661,8 +2671,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2672,7 +2684,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2681,7 +2693,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2711,7 +2723,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2887,14 +2899,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2914,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2936,7 +2948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2945,7 +2957,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2974,7 +2986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2998,7 +3010,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3013,16 +3025,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3036,12 +3048,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3051,8 +3064,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3060,8 +3073,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3079,7 +3092,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3123,7 +3137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3183,151 +3197,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3341,12 +3363,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.30/gnome-shell-light.css b/src/gnome-shell/3.30/gnome-shell-light.css index 4e47108ba..5a2be15e7 100644 --- a/src/gnome-shell/3.30/gnome-shell-light.css +++ b/src/gnome-shell/3.30/gnome-shell-light.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -331,18 +335,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -388,7 +392,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -419,8 +423,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -452,7 +456,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -504,7 +508,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -611,7 +615,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -641,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -713,7 +717,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -760,17 +764,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -814,7 +818,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -856,7 +860,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -865,14 +869,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; font-feature-settings: "tnum"; } @@ -1028,7 +1032,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1107,11 +1111,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1124,15 +1128,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1144,7 +1148,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1205,13 +1209,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1257,7 +1261,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1271,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1286,8 +1290,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1324,8 +1328,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1345,13 +1349,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1385,7 +1389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1393,12 +1397,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1419,12 +1422,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1438,7 +1445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1478,7 +1485,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1498,9 +1505,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1509,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1530,7 +1537,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1617,7 +1624,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1752,7 +1759,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1800,7 +1807,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1962,7 +1969,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2176,20 +2183,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2232,7 +2239,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2244,15 +2251,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2262,7 +2271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2300,7 +2309,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2312,7 +2321,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2379,7 +2388,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2395,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2446,9 +2455,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2513,12 +2522,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2536,13 +2545,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2554,8 +2563,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2622,7 +2631,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2661,8 +2671,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2672,7 +2684,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2681,7 +2693,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2711,7 +2723,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2887,14 +2899,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2914,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2936,7 +2948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2945,7 +2957,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2974,7 +2986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2998,7 +3010,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3013,16 +3025,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3036,12 +3048,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3051,8 +3064,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3060,8 +3073,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3079,7 +3092,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3123,7 +3137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3183,151 +3197,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3341,12 +3363,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.30/gnome-shell.css b/src/gnome-shell/3.30/gnome-shell.css index 4e47108ba..8c44b71fb 100644 --- a/src/gnome-shell/3.30/gnome-shell.css +++ b/src/gnome-shell/3.30/gnome-shell.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -331,18 +335,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -388,7 +392,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -419,8 +423,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -452,7 +456,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -504,7 +508,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -611,7 +615,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -641,7 +645,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -713,7 +717,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -760,17 +764,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -814,7 +818,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; @@ -856,7 +860,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -865,14 +869,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -911,7 +915,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -932,7 +936,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -940,7 +944,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -948,7 +952,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -966,7 +970,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1010,11 +1014,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; font-feature-settings: "tnum"; } @@ -1028,7 +1032,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #panel .panel-corner { -panel-corner-radius: 0; - -panel-corner-background-color: rgba(0, 0, 0, 0); + -panel-corner-background-color: rgba(0, 0, 0, 0.6); -panel-corner-border-width: 2px; -panel-corner-border-color: transparent; } @@ -1107,11 +1111,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1124,15 +1128,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1144,7 +1148,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1205,13 +1209,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1257,7 +1261,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1271,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1286,8 +1290,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1324,8 +1328,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1345,13 +1349,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1385,7 +1389,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1393,12 +1397,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1419,12 +1422,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1438,7 +1445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1478,7 +1485,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1498,9 +1505,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1509,7 +1516,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1530,7 +1537,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1617,7 +1624,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1752,7 +1759,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1800,7 +1807,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1962,7 +1969,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2176,20 +2183,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2232,7 +2239,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2244,15 +2251,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2262,7 +2271,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2300,7 +2309,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2312,7 +2321,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2379,7 +2388,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2395,7 +2404,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } .key-container { @@ -2446,9 +2455,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2463,12 +2472,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2513,12 +2522,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2536,13 +2545,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2554,8 +2563,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2622,7 +2631,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2661,8 +2671,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2672,7 +2684,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2681,7 +2693,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2711,7 +2723,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2887,14 +2899,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -2914,7 +2926,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -2936,7 +2948,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -2945,7 +2957,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -2974,7 +2986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -2998,7 +3010,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3013,16 +3025,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3036,12 +3048,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3051,8 +3064,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3060,8 +3073,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3079,7 +3092,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3123,7 +3137,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3183,151 +3197,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3341,12 +3363,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.32/gnome-shell-compact.css b/src/gnome-shell/3.32/gnome-shell-compact.css index bd1992b55..e90c8a8a6 100644 --- a/src/gnome-shell/3.32/gnome-shell-compact.css +++ b/src/gnome-shell/3.32/gnome-shell-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -320,18 +324,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -377,7 +381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -408,8 +412,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -441,7 +445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -493,7 +497,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -600,7 +604,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -630,7 +634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -750,17 +754,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -804,13 +808,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; +} + +.popup-menu-content, +.candidate-popup-content { margin: 5px 8px 8px; background-color: #FFFFFF; border-radius: 2px; @@ -846,7 +854,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -855,14 +863,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -901,7 +909,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -922,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -930,7 +938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -938,7 +946,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -956,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1000,11 +1008,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; font-feature-settings: "tnum"; } @@ -1034,8 +1042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1066,7 +1074,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(48, 48, 48, 0.01); + background-color: rgba(31, 31, 31, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1097,11 +1105,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1114,15 +1122,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1134,7 +1142,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1195,13 +1203,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1247,7 +1255,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1267,12 +1275,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } .world-clocks-time { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-feature-settings: "tnum"; font-size: 1em; } @@ -1293,14 +1301,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .weather-forecast-time { - color: rgba(0, 0, 0, 0.54); - font-size: 7pt; + color: rgba(0, 0, 0, 0.6); + font-size: 9pt; font-weight: 400; } .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1315,12 +1323,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .pager-button:hover, .pager-button:focus { @@ -1343,8 +1351,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1364,13 +1372,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1404,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1412,12 +1420,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1438,12 +1445,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1457,7 +1468,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1502,7 +1513,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1522,9 +1533,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1533,7 +1544,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1554,7 +1565,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1641,7 +1652,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1681,9 +1692,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; } +.select-area-rubberband { + background-color: rgba(138, 180, 248, 0.3); + border: 1px solid #8AB4F8; +} + .popup-menu-arrow { - width: 16px; - height: 16px; icon-size: 1.2307692308em; } @@ -1789,7 +1803,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1837,7 +1851,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -2003,7 +2017,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2223,20 +2237,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2279,7 +2293,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2291,15 +2305,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2309,7 +2325,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2347,7 +2363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2359,7 +2375,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2426,7 +2442,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2442,7 +2458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } #keyboard .page-indicator { @@ -2502,9 +2518,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2519,12 +2535,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2594,7 +2610,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .emoji-panel .keyboard-key:latched { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -2605,12 +2621,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2628,13 +2644,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2646,8 +2662,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2714,7 +2730,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2753,8 +2770,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2764,7 +2783,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2773,7 +2792,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2803,7 +2822,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2979,14 +2998,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -3006,7 +3025,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -3028,7 +3047,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -3037,7 +3056,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -3066,7 +3085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -3090,7 +3109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3105,16 +3124,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3128,12 +3147,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3143,8 +3163,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3152,8 +3172,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3171,7 +3191,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3215,7 +3236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3275,151 +3296,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3433,12 +3462,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { 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 e10d776e7..ab21cc933 100644 --- a/src/gnome-shell/3.32/gnome-shell-dark-compact.css +++ b/src/gnome-shell/3.32/gnome-shell-dark-compact.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; @@ -45,6 +46,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -98,6 +101,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -249,7 +253,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-border-color: transparent; -barlevel-active-background-color: #8AB4F8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -351,7 +355,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -409,7 +413,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -441,7 +445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -600,7 +604,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -630,7 +634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -804,15 +808,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; +} + +.popup-menu-content, +.candidate-popup-content { margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -846,7 +854,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -855,14 +863,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(255, 255, 255, 0.12); -barlevel-active-background-color: white; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -930,7 +938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -973,7 +981,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1000,11 +1008,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; font-feature-settings: "tnum"; } @@ -1034,8 +1042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1066,7 +1074,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(48, 48, 48, 0.01); + background-color: rgba(31, 31, 31, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1114,15 +1122,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel .remote-access-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1134,7 +1142,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1195,13 +1203,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1267,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } @@ -1294,13 +1302,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .weather-forecast-time { color: rgba(255, 255, 255, 0.7); - font-size: 7pt; + font-size: 9pt; font-weight: 400; } .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1315,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1343,8 +1351,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1369,8 +1377,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1412,12 +1420,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1438,12 +1445,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1457,7 +1468,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1522,7 +1533,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1681,9 +1692,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; } +.select-area-rubberband { + background-color: rgba(138, 180, 248, 0.3); + border: 1px solid #8AB4F8; +} + .popup-menu-arrow { - width: 16px; - height: 16px; icon-size: 1.2307692308em; } @@ -1837,7 +1851,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1972,7 +1986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -2003,7 +2017,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2223,7 +2237,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2236,21 +2250,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2279,7 +2293,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2291,15 +2305,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2442,7 +2458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } #keyboard .page-indicator { @@ -2467,7 +2483,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2484,7 +2500,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2493,7 +2509,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2502,19 +2518,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { border-color: transparent; - background-color: #424242; + background-color: #3C3C3C; background-size: 24px; } .keyboard-key.default-key:active { - background-color: #686868; + background-color: #636363; } .keyboard-key.enter-key { @@ -2557,7 +2573,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2610,7 +2626,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2634,7 +2650,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2646,8 +2662,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2714,7 +2730,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2753,6 +2770,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2803,7 +2822,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2979,14 +2998,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -3006,7 +3025,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -3028,7 +3047,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -3037,12 +3056,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -3054,7 +3073,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -3089,7 +3108,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3128,7 +3147,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; @@ -3172,6 +3192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3206,7 +3227,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3215,7 +3236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3275,145 +3296,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ diff --git a/src/gnome-shell/3.32/gnome-shell-dark.css b/src/gnome-shell/3.32/gnome-shell-dark.css index 65dc106fa..0aa6d386d 100644 --- a/src/gnome-shell/3.32/gnome-shell-dark.css +++ b/src/gnome-shell/3.32/gnome-shell-dark.css @@ -29,7 +29,8 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; @@ -45,6 +46,7 @@ stage { .button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -98,6 +101,7 @@ stage { .modal-dialog-linked-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #FDD633; padding: 0 0; } @@ -249,7 +253,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-border-color: transparent; -barlevel-active-background-color: #8AB4F8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -351,7 +355,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog { border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); } @@ -409,7 +413,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-dialog-subtitle { color: rgba(255, 255, 255, 0.7); - font-weight: bold; + font-weight: normal; } /* End Session Dialog */ @@ -441,7 +445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #FDD633; padding-top: 6px; } @@ -600,7 +604,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #F28B82; padding-bottom: 8px; } @@ -630,7 +634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #FDD633; } .polkit-dialog-user-icon { @@ -804,15 +808,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; +} + +.popup-menu-content, +.candidate-popup-content { margin: 5px 8px 8px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -846,7 +854,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -855,14 +863,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(255, 255, 255, 0.12); -barlevel-active-background-color: white; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #F28B82; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -930,7 +938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -973,7 +981,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .resize-popup, .switcher-list, .workspace-switcher-container { color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44); border-radius: 2px; @@ -1000,11 +1008,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; font-feature-settings: "tnum"; } @@ -1066,7 +1074,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(48, 48, 48, 0.01); + background-color: rgba(31, 31, 31, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1114,15 +1122,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #FDD633; } #panel .remote-access-indicator { - color: #FBBC05; + color: #FDD633; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1134,7 +1142,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1195,13 +1203,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1267,7 +1275,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } @@ -1294,13 +1302,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .weather-forecast-time { color: rgba(255, 255, 255, 0.7); - font-size: 7pt; + font-size: 9pt; font-weight: 400; } .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1315,8 +1323,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; @@ -1343,8 +1351,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1369,8 +1377,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1412,12 +1420,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(255, 255, 255, 0.3); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1438,12 +1445,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(255, 255, 255, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(138, 180, 248, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(255, 255, 255, 0.2); + background-color: rgba(138, 180, 248, 0.2); } .message-list-sections { @@ -1457,7 +1468,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1522,7 +1533,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; color: rgba(255, 255, 255, 0.7); font-size: 1em; @@ -1681,9 +1692,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; } +.select-area-rubberband { + background-color: rgba(138, 180, 248, 0.3); + border: 1px solid #8AB4F8; +} + .popup-menu-arrow { - width: 16px; - height: 16px; icon-size: 1.1428571429em; } @@ -1837,7 +1851,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -1972,7 +1986,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; padding: 7px 8px; color: white; - background-color: #424242; + background-color: #3C3C3C; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-align: center; -x-offset: 8px; @@ -2003,7 +2017,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2223,7 +2237,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } @@ -2236,21 +2250,21 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: white; - background-color: #424242; + background-color: #3C3C3C; border: none; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } .notification-banner:hover { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner:focus { - background-color: #424242; + background-color: #3C3C3C; } .notification-banner .notification-icon { @@ -2279,7 +2293,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(255, 255, 255, 0.7); + color: #8AB4F8; font-weight: 500; } @@ -2291,15 +2305,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(255, 255, 255, 0.08); - color: white; +.notification-banner .notification-button:focus { + background-color: rgba(138, 180, 248, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(138, 180, 248, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(255, 255, 255, 0.2); - color: white; + background-color: rgba(138, 180, 248, 0.2); } .summary-source-counter { @@ -2442,7 +2458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } #keyboard .page-indicator { @@ -2467,7 +2483,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; border: none; color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2484,7 +2500,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:hover, .keyboard-key:checked { color: white; - background-color: #424242; + background-color: #3C3C3C; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2493,7 +2509,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key:active { color: white; - background-color: #6f6f6f; + background-color: #6b6b6b; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2502,19 +2518,19 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { border-color: transparent; - background-color: #424242; + background-color: #3C3C3C; background-size: 24px; } .keyboard-key.default-key:active { - background-color: #686868; + background-color: #636363; } .keyboard-key.enter-key { @@ -2557,7 +2573,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -arrow-base: 0; -arrow-rise: 0; -boxpointer-gap: 5px; - background-color: #424242; + background-color: #3C3C3C; border-radius: 2px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); } @@ -2610,7 +2626,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2634,7 +2650,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2646,8 +2662,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2714,7 +2730,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2753,6 +2770,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: rgba(0, 0, 0, 0.87); background-color: #8AB4F8; border-color: transparent; @@ -2803,7 +2822,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #FDD633; } .login-dialog-message-hint { @@ -2979,14 +2998,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -3006,7 +3025,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -3028,7 +3047,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -3037,12 +3056,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } #LookingGlassDialog { - background-color: #424242; + background-color: #3C3C3C; spacing: 4px; padding: 0; border: none; @@ -3054,7 +3073,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border: none; border-radius: 0; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12); } @@ -3089,7 +3108,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { #LookingGlassDialog .notebook-tab:selected { border-bottom-width: 0; border-color: transparent; - background-color: rgba(66, 66, 66, 0.01); + background-color: rgba(60, 60, 60, 0.01); box-shadow: inset 0 -2px 0px #8AB4F8; color: white; text-shadow: none; @@ -3128,7 +3147,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; @@ -3172,6 +3192,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button:focus { color: white; + background-color: rgba(255, 255, 255, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3206,7 +3227,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #LookingGlassPropertyInspector { - background: #424242; + background: #3C3C3C; border: none; border-radius: 2px; padding: 6px; @@ -3215,7 +3236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3275,145 +3296,153 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(255, 255, 255, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ 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 bd1992b55..603f1ea0f 100644 --- a/src/gnome-shell/3.32/gnome-shell-light-compact.css +++ b/src/gnome-shell/3.32/gnome-shell-light-compact.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 32px; + min-width: 48px; margin: 4px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 11.25pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -320,18 +324,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -377,7 +381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -408,8 +412,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -441,7 +445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -493,7 +497,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -600,7 +604,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -630,7 +634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -750,17 +754,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -804,13 +808,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; +} + +.popup-menu-content, +.candidate-popup-content { margin: 5px 8px 8px; background-color: #FFFFFF; border-radius: 2px; @@ -846,7 +854,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -855,14 +863,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -901,7 +909,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -922,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -930,7 +938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -938,7 +946,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -956,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1000,11 +1008,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 25px; + height: 28px; font-feature-settings: "tnum"; } @@ -1034,8 +1042,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button { - -natural-hpadding: 12px; - -minimum-hpadding: 6px; + -natural-hpadding: 8px; + -minimum-hpadding: 4px; font-weight: bold; color: rgba(255, 255, 255, 0.7); text-shadow: none; @@ -1066,7 +1074,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(48, 48, 48, 0.01); + background-color: rgba(0, 0, 0, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1097,11 +1105,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1114,15 +1122,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1134,7 +1142,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1195,13 +1203,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 17px; + min-height: 20px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 42px; + min-height: 48px; } .message-list-section-list:ltr { @@ -1247,7 +1255,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1267,12 +1275,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } .world-clocks-time { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-feature-settings: "tnum"; font-size: 1em; } @@ -1293,14 +1301,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .weather-forecast-time { - color: rgba(0, 0, 0, 0.54); - font-size: 7pt; + color: rgba(0, 0, 0, 0.6); + font-size: 9pt; font-weight: 400; } .calendar-month-label { transition-duration: 100ms; - height: 17px; + height: 20px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1315,12 +1323,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 25px; - height: 25px; + width: 28px; + height: 28px; margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .pager-button:hover, .pager-button:focus { @@ -1343,8 +1351,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 25px; - height: 25px; + width: 28px; + height: 28px; padding: 0; margin: 2px; border-radius: 100px; @@ -1364,13 +1372,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1404,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1412,12 +1420,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 25px; - height: 18px; + width: 28px; + height: 21px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1438,12 +1445,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1457,7 +1468,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 50px; + min-height: 56px; background-color: transparent; border-radius: 2px; } @@ -1502,7 +1513,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 18px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1522,9 +1533,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 34px; + min-height: 40px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1533,7 +1544,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1554,7 +1565,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1641,7 +1652,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 12px; @@ -1681,9 +1692,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; } +.select-area-rubberband { + background-color: rgba(138, 180, 248, 0.3); + border: 1px solid #8AB4F8; +} + .popup-menu-arrow { - width: 16px; - height: 16px; icon-size: 1.2307692308em; } @@ -1789,7 +1803,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1837,7 +1851,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -2003,7 +2017,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2223,20 +2237,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 50px; + min-height: 56px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2279,7 +2293,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2291,15 +2305,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2309,7 +2325,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2347,7 +2363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2359,7 +2375,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2426,7 +2442,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2442,7 +2458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } #keyboard .page-indicator { @@ -2502,9 +2518,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2519,12 +2535,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2594,7 +2610,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .emoji-panel .keyboard-key:latched { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -2605,12 +2621,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 25px; + min-height: 28px; padding: 0 8px; border-radius: 2px; } @@ -2628,13 +2644,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 25px; + height: 28px; } .vertical .candidate-page-button-box { @@ -2646,8 +2662,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 25px; - min-height: 25px; + min-width: 28px; + min-height: 28px; padding: 0; } @@ -2714,7 +2730,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2753,8 +2770,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2764,7 +2783,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2773,7 +2792,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2803,7 +2822,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2979,14 +2998,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -3006,7 +3025,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -3028,7 +3047,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -3037,7 +3056,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -3066,7 +3085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -3090,7 +3109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3105,16 +3124,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3128,12 +3147,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 32px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 9.75pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3143,8 +3163,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3152,8 +3172,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3171,7 +3191,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3215,7 +3236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3275,151 +3296,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3433,12 +3462,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.32/gnome-shell-light.css b/src/gnome-shell/3.32/gnome-shell-light.css index dc0fdd121..d96278e16 100644 --- a/src/gnome-shell/3.32/gnome-shell-light.css +++ b/src/gnome-shell/3.32/gnome-shell-light.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -320,18 +324,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -377,7 +381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -408,8 +412,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -441,7 +445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -493,7 +497,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -600,7 +604,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -630,7 +634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -750,17 +754,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -804,13 +808,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; +} + +.popup-menu-content, +.candidate-popup-content { margin: 5px 8px 8px; background-color: #FFFFFF; border-radius: 2px; @@ -846,7 +854,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -855,14 +863,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -901,7 +909,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -922,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -930,7 +938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -938,7 +946,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -956,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1000,11 +1008,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; font-feature-settings: "tnum"; } @@ -1066,7 +1074,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(48, 48, 48, 0.01); + background-color: rgba(0, 0, 0, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1097,11 +1105,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1114,15 +1122,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1134,7 +1142,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: rgba(0, 0, 0, 0.6); } #panel.solid .panel-button { @@ -1195,13 +1203,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1247,7 +1255,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1267,12 +1275,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } .world-clocks-time { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-feature-settings: "tnum"; font-size: 1em; } @@ -1293,14 +1301,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .weather-forecast-time { - color: rgba(0, 0, 0, 0.54); - font-size: 7pt; + color: rgba(0, 0, 0, 0.6); + font-size: 9pt; font-weight: 400; } .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1315,12 +1323,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .pager-button:hover, .pager-button:focus { @@ -1343,8 +1351,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1364,13 +1372,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1404,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1412,12 +1420,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1438,12 +1445,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1457,7 +1468,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1502,7 +1513,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1522,9 +1533,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1533,7 +1544,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1554,7 +1565,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1641,7 +1652,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1681,9 +1692,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; } +.select-area-rubberband { + background-color: rgba(138, 180, 248, 0.3); + border: 1px solid #8AB4F8; +} + .popup-menu-arrow { - width: 16px; - height: 16px; icon-size: 1.1428571429em; } @@ -1789,7 +1803,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1837,7 +1851,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -2003,7 +2017,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2223,20 +2237,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2279,7 +2293,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2291,15 +2305,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2309,7 +2325,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2347,7 +2363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2359,7 +2375,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2426,7 +2442,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2442,7 +2458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } #keyboard .page-indicator { @@ -2502,9 +2518,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2519,12 +2535,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2594,7 +2610,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .emoji-panel .keyboard-key:latched { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -2605,12 +2621,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2628,13 +2644,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2646,8 +2662,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2714,7 +2730,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2753,8 +2770,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2764,7 +2783,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2773,7 +2792,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2803,7 +2822,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2979,14 +2998,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -3006,7 +3025,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -3028,7 +3047,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -3037,7 +3056,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -3066,7 +3085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -3090,7 +3109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3105,16 +3124,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3128,12 +3147,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3143,8 +3163,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3152,8 +3172,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3171,7 +3191,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3215,7 +3236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); } #dashtodockContainer:overview #dash { @@ -3275,151 +3296,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3433,12 +3462,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/3.32/gnome-shell.css b/src/gnome-shell/3.32/gnome-shell.css index dc0fdd121..b4cd0b191 100644 --- a/src/gnome-shell/3.32/gnome-shell.css +++ b/src/gnome-shell/3.32/gnome-shell.css @@ -29,12 +29,13 @@ stage { /* Buttons */ .button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border-width: 0; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -44,15 +45,16 @@ stage { } .button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -60,8 +62,8 @@ stage { } .button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -80,6 +82,7 @@ stage { .modal-dialog-linked-button { min-height: 36px; + min-width: 48px; margin: 6px; padding: 0 8px; margin-right: 0; @@ -87,7 +90,7 @@ stage { border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -97,15 +100,16 @@ stage { } .modal-dialog-linked-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; } .modal-dialog-linked-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -113,8 +117,8 @@ stage { } .modal-dialog-linked-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -154,7 +158,7 @@ StEntry { border-radius: 2px 2px 0 0; border-width: 0; color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); font-size: 12pt; font-weight: 400; @@ -170,7 +174,7 @@ StEntry:hover { StEntry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; } StEntry:insensitive { @@ -181,7 +185,7 @@ StEntry:insensitive { StEntry StIcon.capslock-warning { icon-size: 16px; - warning-color: #FBBC05; + warning-color: #F4B400; padding: 0 0; } @@ -217,7 +221,7 @@ StScrollBar StButton#vhandle, StScrollBar StButton#hhandle { } StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { @@ -243,13 +247,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Slider */ .slider { height: 20px; - color: #4285F4; + color: #1A73E8; -barlevel-height: 2px; -barlevel-background-color: rgba(0, 0, 0, 0.26); -barlevel-border-color: transparent; - -barlevel-active-background-color: #4285F4; + -barlevel-active-background-color: #1A73E8; -barlevel-active-border-color: transparent; - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-border-color: transparent; -barlevel-overdrive-separator-width: 2px; -barlevel-border-width: 0; @@ -297,11 +301,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .check-box:hover:checked StBin { - background-color: rgba(66, 133, 244, 0.08); + background-color: rgba(26, 115, 232, 0.08); } .check-box:active:checked StBin { - background-color: rgba(66, 133, 244, 0.2); + background-color: rgba(26, 115, 232, 0.2); } /* Switches */ @@ -320,18 +324,18 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .shell-link { transition-duration: 100ms; border-radius: 2px; - color: #4285F4; + color: #1A73E8; } .shell-link:hover { - color: #4285F4; - background-color: rgba(66, 133, 244, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); } .shell-link:active { transition-duration: 200ms; - color: #4285F4; - background-color: rgba(66, 133, 244, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); } /* Modal Dialogs */ @@ -377,7 +381,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .modal-dialog .run-dialog-label { font-size: 1em; font-weight: normal; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); padding-bottom: .4em; } @@ -408,8 +412,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-dialog-subtitle { - color: rgba(0, 0, 0, 0.54); - font-weight: bold; + color: rgba(0, 0, 0, 0.6); + font-weight: normal; } /* End Session Dialog */ @@ -441,7 +445,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .end-session-dialog-warning { width: 28em; - color: #FBBC05; + color: #F4B400; padding-top: 6px; } @@ -493,7 +497,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .end-session-dialog-app-list-item-description { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -600,7 +604,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .prompt-dialog-error-label { font-size: 1em; - color: #EA4335; + color: #D93025; padding-bottom: 8px; } @@ -630,7 +634,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .polkit-dialog-user-root-label { - color: #FBBC05; + color: #F4B400; } .polkit-dialog-user-icon { @@ -702,7 +706,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .extension-dialog .message-dialog-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* Inhibit-Shortcuts Dialog */ @@ -750,17 +754,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .popup-menu .popup-menu-item:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); box-shadow: 0 0 transparent; font-weight: normal; } .popup-menu .popup-menu-item:checked.selected { - background-color: rgba(66, 133, 244, 0.4); + background-color: rgba(26, 115, 232, 0.4); } .popup-menu .popup-menu-item:checked:active { - background-color: rgba(66, 133, 244, 0.6); + background-color: rgba(26, 115, 232, 0.6); } .popup-menu .popup-menu-item.selected { @@ -804,13 +808,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu-boxpointer, .candidate-popup-boxpointer { - -arrow-border-radius: 0; + -arrow-border-radius: 20px; -arrow-background-color: transparent; -arrow-border-width: 0; -arrow-border-color: transparent; -arrow-base: 0; -arrow-rise: 0; -arrow-box-shadow: none; +} + +.popup-menu-content, +.candidate-popup-content { margin: 5px 8px 8px; background-color: #FFFFFF; border-radius: 2px; @@ -846,7 +854,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .osd-window .osd-monitor-label { - font-size: 45px; + font-size: 48px; font-weight: 400; } @@ -855,14 +863,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -barlevel-height: 8px; -barlevel-background-color: rgba(0, 0, 0, 0.12); -barlevel-active-background-color: rgba(0, 0, 0, 0.87); - -barlevel-overdrive-color: #EA4335; + -barlevel-overdrive-color: #D93025; -barlevel-overdrive-separator-width: 2px; } /* Pad OSD */ .pad-osd-window { padding: 32px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .pad-osd-window .pad-osd-title-box { @@ -901,7 +909,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .switcher-list .item-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -922,7 +930,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .switcher-arrow { transition-duration: 100ms; border-color: rgba(0, 0, 0, 0); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .switcher-arrow:highlighted { @@ -930,7 +938,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .input-source-switcher-symbol { - font-size: 45px; + font-size: 48px; font-weight: 400; width: 96px; height: 96px; @@ -938,7 +946,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Window Cycler */ .cycler-highlight { - border: 4px solid #4285F4; + border: 4px solid #1A73E8; } /* Workspace Switcher */ @@ -956,7 +964,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .ws-switcher-active-up, .ws-switcher-active-down { height: 48px; - background-color: #4285F4; + background-color: #1A73E8; color: white; background-size: 32px; border-radius: 2px; @@ -1000,11 +1008,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* TOP BAR */ #panel { - background-color: #303030; + background-color: #1F1F1F; /* transition from solid to transparent */ transition-duration: 250ms; font-weight: bold; - height: 30px; + height: 32px; font-feature-settings: "tnum"; } @@ -1066,7 +1074,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(48, 48, 48, 0.01); + background-color: rgba(31, 31, 31, 0.01); box-shadow: inset 0 -2px 0px white; color: white; } @@ -1097,11 +1105,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .panel-button.clock-display > StBoxLayout > StIcon { - color: rgba(66, 133, 244, 0.7); + color: rgba(26, 115, 232, 0.7); } #panel .panel-button.clock-display:hover > StBoxLayout > StIcon, #panel .panel-button.clock-display:active > StBoxLayout > StIcon { - color: #4285F4; + color: #1A73E8; } #panel .panel-status-indicators-box, @@ -1114,15 +1122,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel .screencast-indicator { - color: #FBBC05; + color: #F4B400; } #panel .remote-access-indicator { - color: #FBBC05; + color: #F4B400; } #panel.solid { - background-color: #303030; + background-color: #1F1F1F; /* transition from transparent to solid */ transition-duration: 250ms; background-gradient-direction: none; @@ -1134,7 +1142,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.solid .panel-corner { - -panel-corner-background-color: #303030; + -panel-corner-background-color: #1F1F1F; } #panel.solid .panel-button { @@ -1195,13 +1203,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-button, .weather-button, .events-section-title { - min-height: 22px; + min-height: 24px; padding: 4px 8px; border-radius: 2px; } .datemenu-today-button { - min-height: 52px; + min-height: 56px; } .message-list-section-list:ltr { @@ -1247,7 +1255,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .world-clocks-header, .weather-header, .events-section-title { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: bold; } @@ -1267,12 +1275,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .world-clocks-city { - font-weight: bold; + font-weight: normal; font-size: 1em; } .world-clocks-time { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-feature-settings: "tnum"; font-size: 1em; } @@ -1293,14 +1301,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .weather-forecast-time { - color: rgba(0, 0, 0, 0.54); - font-size: 7pt; + color: rgba(0, 0, 0, 0.6); + font-size: 9pt; font-weight: 400; } .calendar-month-label { transition-duration: 100ms; - height: 22px; + height: 24px; margin: 2px; padding: 6px 16px; border-radius: 2px; @@ -1315,12 +1323,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .pager-button { transition-duration: 100ms; - width: 30px; - height: 30px; + width: 32px; + height: 32px; margin: 2px; border-radius: 100px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .pager-button:hover, .pager-button:focus { @@ -1343,8 +1351,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { font-size: 9pt; font-weight: 400; text-align: center; - width: 30px; - height: 30px; + width: 32px; + height: 32px; padding: 0; margin: 2px; border-radius: 100px; @@ -1364,13 +1372,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-day-base:selected { color: rgba(0, 0, 0, 0.87); - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); border-color: transparent; } .calendar-day-base.calendar-day-heading { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin-top: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1404,7 +1412,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .calendar-day-with-events { - color: #4285F4; + color: #1A73E8; font-weight: normal; text-decoration: underline; background-image: none; @@ -1412,12 +1420,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .calendar-other-month-day { color: rgba(0, 0, 0, 0.26); - opacity: 0.5; } .calendar-week-number { - width: 30px; - height: 23px; + width: 32px; + height: 25px; margin: 2px; padding: 7px 0 0; border-radius: 100px; @@ -1438,12 +1445,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 8px 8px 0; } -.message-list-clear-button.button:hover, .message-list-clear-button.button:focus { - background-color: rgba(0, 0, 0, 0.08); +.message-list-clear-button.button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.message-list-clear-button.button:hover { + background-color: rgba(26, 115, 232, 0.08); } .message-list-clear-button.button:active { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(26, 115, 232, 0.2); } .message-list-sections { @@ -1457,7 +1468,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message { transition-duration: 100ms; - min-height: 60px; + min-height: 64px; background-color: transparent; border-radius: 2px; } @@ -1502,7 +1513,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .message-secondary-bin > .event-time { min-height: 22px; padding-top: 2px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ @@ -1522,9 +1533,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .message-content { - min-height: 44px; + min-height: 48px; padding: 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: 1em; } @@ -1533,7 +1544,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { icon-size: 16px; border-radius: 16px; padding: 4px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /* FIXME: how do you do this in sass? */ @@ -1554,7 +1565,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { margin: 16px 0; padding: 8px; border-radius: 100px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .message-media-control:hover, .message-media-control:focus { @@ -1641,7 +1652,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .system-menu-action { -st-icon-style: symbolic; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); border-radius: 100px; /* wish we could do 50% */ padding: 16px; @@ -1681,9 +1692,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { background-image: none; } +.select-area-rubberband { + background-color: rgba(138, 180, 248, 0.3); + border: 1px solid #8AB4F8; +} + .popup-menu-arrow { - width: 16px; - height: 16px; icon-size: 1.1428571429em; } @@ -1789,7 +1803,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .nm-dialog-item:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); } @@ -1837,7 +1851,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .window-caption { spacing: 25px; color: white; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); border-radius: 2px; padding: 4px 8px; } @@ -2003,7 +2017,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .app-view-control { - padding: 0 16px; + padding: 0 8px; font-weight: bold; color: rgba(255, 255, 255, 0.7); } @@ -2223,20 +2237,20 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .search-statustext, .no-frequent-applications-label { - font-size: 45px; + font-size: 48px; font-weight: 400; color: rgba(255, 255, 255, 0.5); } /* NOTIFICATIONS & MESSAGE TRAY */ .url-highlighter { - link-color: #4285F4; + link-color: #1A73E8; } .notification-banner { font-size: 1em; width: 34em; - min-height: 60px; + min-height: 64px; margin: 5px; border-radius: 2px; color: rgba(0, 0, 0, 0.87); @@ -2279,7 +2293,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 0 8px; border-radius: 2px; background-color: transparent; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; font-weight: 500; } @@ -2291,15 +2305,17 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-radius: 2px; } -.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus { - background-color: rgba(0, 0, 0, 0.08); - color: rgba(0, 0, 0, 0.87); +.notification-banner .notification-button:focus { + background-color: rgba(26, 115, 232, 0.12); +} + +.notification-banner .notification-button:hover { + background-color: rgba(26, 115, 232, 0.08); } .notification-banner .notification-button:active { transition-duration: 200ms; - background-color: rgba(0, 0, 0, 0.2); - color: rgba(0, 0, 0, 0.87); + background-color: rgba(26, 115, 232, 0.2); } .summary-source-counter { @@ -2309,7 +2325,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { width: 1.6em; -shell-counter-overlap-x: 3px; -shell-counter-overlap-y: 3px; - background-color: #4285F4; + background-color: #1A73E8; color: white; border: 2px solid white; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); @@ -2347,7 +2363,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .chat-sent { padding-left: 18pt; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-sent:rtl { @@ -2359,7 +2375,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding-left: 4px; font-size: 9pt; font-weight: 400; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .chat-meta-message:rtl { @@ -2426,7 +2442,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Eeeky things */ .magnifier-zoom-region { - border: 2px solid #4285F4; + border: 2px solid #1A73E8; } .magnifier-zoom-region.full-screen { @@ -2442,7 +2458,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #keyboard { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); } #keyboard .page-indicator { @@ -2502,9 +2518,9 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .keyboard-key:grayed { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; - border-color: rgba(0, 0, 0, 0.6); + border-color: rgba(0, 0, 0, 0.3); } .keyboard-key.default-key { @@ -2519,12 +2535,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .keyboard-key.enter-key { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; background-image: url("assets/key-enter.svg"); } .keyboard-key.enter-key:active { - background-color: #689df6; + background-color: #488fed; } .keyboard-key.shift-key-lowercase { @@ -2594,7 +2610,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .emoji-panel .keyboard-key:latched { border-color: transparent; - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -2605,12 +2621,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .candidate-index { padding: 0 4px 0 0; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .candidate-box { transition-duration: 100ms; - min-height: 30px; + min-height: 32px; padding: 0 8px; border-radius: 2px; } @@ -2628,13 +2644,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-box:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); color: rgba(0, 0, 0, 0.87); transition-duration: 0ms; } .candidate-page-button-box { - height: 30px; + height: 32px; } .vertical .candidate-page-button-box { @@ -2646,8 +2662,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .candidate-page-button { - min-width: 30px; - min-height: 30px; + min-width: 32px; + min-height: 32px; padding: 0; } @@ -2714,7 +2730,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button { - padding: 0 16px; + min-width: 48px; + padding: 0 8px; color: rgba(255, 255, 255, 0.7); background-color: transparent; border-color: transparent; @@ -2753,8 +2770,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog .modal-dialog-button:default { + min-width: 32px; + padding: 0 16px; color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); text-shadow: none; @@ -2764,7 +2783,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus { color: white; - background-color: #4285F4; + background-color: #1A73E8; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2773,7 +2792,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .login-dialog .modal-dialog-button:default:active { color: white; - background-color: #6fa2f7; + background-color: #5195ee; border-color: transparent; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345); text-shadow: none; @@ -2803,7 +2822,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .login-dialog-message-warning { - color: #FBBC05; + color: #F4B400; } .login-dialog-message-hint { @@ -2979,14 +2998,14 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .screen-shield-clock-time { - font-size: 112px; + font-size: 96px; font-weight: 300; text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24); font-feature-settings: "tnum"; } .screen-shield-clock-date { - font-size: 45px; + font-size: 34px; font-weight: 400; } @@ -3006,7 +3025,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .screen-shield-notifications-container .screen-shield-notification-source { padding: 8px; border: none; - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; border-radius: 2px; } @@ -3028,7 +3047,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #panel.lock-screen { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .screen-shield-background { @@ -3037,7 +3056,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } #lockDialogGroup { - background: #303030; + background: #212121; background-size: cover; } @@ -3066,7 +3085,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { -natural-hpadding: 12px; -minimum-hpadding: 6px; font-weight: bold; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); transition-duration: 100ms; padding-left: 16px; padding-right: 16px; @@ -3090,7 +3109,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { border-bottom-width: 0; border-color: transparent; background-color: rgba(255, 255, 255, 0.01); - box-shadow: inset 0 -2px 0px #4285F4; + box-shadow: inset 0 -2px 0px #1A73E8; color: rgba(0, 0, 0, 0.87); text-shadow: none; } @@ -3105,16 +3124,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-dialog StEntry { - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); } .lg-dialog .shell-link { - color: #4285F4; + color: #1A73E8; } .lg-dialog .shell-link:hover { - color: #4285F4; + color: #1A73E8; } .lg-completions-text { @@ -3128,12 +3147,13 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .lg-obj-inspector-button { min-height: 36px; - padding: 0 16px; + min-width: 48px; + padding: 0 8px; border: none; border-radius: 2px; font-size: 10.5pt; font-weight: 500; - color: rgba(0, 0, 0, 0.54); + color: #1A73E8; background-color: transparent; border-color: transparent; box-shadow: 0 0 transparent; @@ -3143,8 +3163,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:hover { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.08); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.08); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3152,8 +3172,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:active { - color: rgba(0, 0, 0, 0.87); - background-color: rgba(0, 0, 0, 0.2); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.2); border-color: transparent; box-shadow: 0 0 transparent; text-shadow: none; @@ -3171,7 +3191,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { } .lg-obj-inspector-button:focus { - color: rgba(0, 0, 0, 0.87); + color: #1A73E8; + background-color: rgba(26, 115, 232, 0.12); text-shadow: none; icon-shadow: none; box-shadow: 0 0 transparent; @@ -3215,7 +3236,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { /* Dash to Dock */ #dashtodockContainer #dash { - background-color: #303030; + background-color: #1F1F1F; } #dashtodockContainer:overview #dash { @@ -3275,151 +3296,159 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { padding: 6px 6px 6px 3px; } +#dashtodockContainer .focused .overview-icon { + background-color: rgba(0, 0, 0, 0.12); +} + +#dashtodockContainer .default.focused .overview-icon { + background-color: transparent; +} + #dashtodockContainer .app-well-app-running-dot { background-color: transparent; } -#dashtodockContainer .dash-item-container > StWidget { +#dashtodockContainer .default { background-size: cover; } -#dashtodockContainer.left .dash-item-container > StWidget.running1 { +#dashtodockContainer.left .default.running1 { background-image: url("assets/dash/left-running1.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.left .default.running1.focused { background-image: url("assets/dash/left-running1-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2 { +#dashtodockContainer.left .default.running2 { background-image: url("assets/dash/left-running2.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.left .default.running2.focused { background-image: url("assets/dash/left-running2-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3 { +#dashtodockContainer.left .default.running3 { background-image: url("assets/dash/left-running3.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.left .default.running3.focused { background-image: url("assets/dash/left-running3-focused.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4 { +#dashtodockContainer.left .default.running4 { background-image: url("assets/dash/left-running4.svg"); } -#dashtodockContainer.left .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.left .default.running4.focused { background-image: url("assets/dash/left-running4-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1 { +#dashtodockContainer.right .default.running1 { background-image: url("assets/dash/right-running1.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.right .default.running1.focused { background-image: url("assets/dash/right-running1-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2 { +#dashtodockContainer.right .default.running2 { background-image: url("assets/dash/right-running2.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.right .default.running2.focused { background-image: url("assets/dash/right-running2-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3 { +#dashtodockContainer.right .default.running3 { background-image: url("assets/dash/right-running3.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.right .default.running3.focused { background-image: url("assets/dash/right-running3-focused.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4 { +#dashtodockContainer.right .default.running4 { background-image: url("assets/dash/right-running4.svg"); } -#dashtodockContainer.right .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.right .default.running4.focused { background-image: url("assets/dash/right-running4-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1 { +#dashtodockContainer.top .default.running1 { background-image: url("assets/dash/top-running1.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.top .default.running1.focused { background-image: url("assets/dash/top-running1-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2 { +#dashtodockContainer.top .default.running2 { background-image: url("assets/dash/top-running2.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.top .default.running2.focused { background-image: url("assets/dash/top-running2-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3 { +#dashtodockContainer.top .default.running3 { background-image: url("assets/dash/top-running3.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.top .default.running3.focused { background-image: url("assets/dash/top-running3-focused.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4 { +#dashtodockContainer.top .default.running4 { background-image: url("assets/dash/top-running4.svg"); } -#dashtodockContainer.top .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.top .default.running4.focused { background-image: url("assets/dash/top-running4-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1 { +#dashtodockContainer.bottom .default.running1 { background-image: url("assets/dash/bottom-running1.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running1.focused { +#dashtodockContainer.bottom .default.running1.focused { background-image: url("assets/dash/bottom-running1-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2 { +#dashtodockContainer.bottom .default.running2 { background-image: url("assets/dash/bottom-running2.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running2.focused { +#dashtodockContainer.bottom .default.running2.focused { background-image: url("assets/dash/bottom-running2-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3 { +#dashtodockContainer.bottom .default.running3 { background-image: url("assets/dash/bottom-running3.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running3.focused { +#dashtodockContainer.bottom .default.running3.focused { background-image: url("assets/dash/bottom-running3-focused.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4 { +#dashtodockContainer.bottom .default.running4 { background-image: url("assets/dash/bottom-running4.svg"); } -#dashtodockContainer.bottom .dash-item-container > StWidget.running4.focused { +#dashtodockContainer.bottom .default.running4.focused { background-image: url("assets/dash/bottom-running4-focused.svg"); } /* Simple Dock */ #dash:desktop { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } /* GPaste */ .popup-menu .search-entry { color: rgba(0, 0, 0, 0.87); - selection-background-color: rgba(66, 133, 244, 0.24); + selection-background-color: rgba(26, 115, 232, 0.24); selected-color: rgba(0, 0, 0, 0.87); transition-duration: 100ms; background-color: rgba(0, 0, 0, 0.04); @@ -3433,12 +3462,12 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active { .popup-menu .search-entry:focus { border-color: transparent; - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; color: rgba(0, 0, 0, 0.87); } .popup-menu .search-entry .search-entry-icon { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon { diff --git a/src/gnome-shell/README.md b/src/gnome-shell/README.md index 0d26ed777..c21e5abfa 100644 --- a/src/gnome-shell/README.md +++ b/src/gnome-shell/README.md @@ -53,13 +53,13 @@ To change the GDM (lock/login screen) theme, you need to replace the system's _d 1. Restore to the original theme file(s) from the backup: ```sh - sudo mv -av /usr/share/gnome-shell/gnome-shell-theme.gresource{~,} + sudo mv -v /usr/share/gnome-shell/gnome-shell-theme.gresource{~,} # For Ubuntu 17.10 or 18.04, you also need the following: - sudo mv -av /usr/share/gnome-shell/theme/ubuntu.css{~,} + sudo mv -v /usr/share/gnome-shell/theme/ubuntu.css{~,} # For Ubuntu 18.10, you also need the following: - sudo mv -av /usr/share/gnome-shell/theme/Yaru/gnome-shell.css{~,} + sudo mv -v /usr/share/gnome-shell/theme/Yaru/gnome-shell.css{~,} ``` 2. Reload the theme. If you are running GNOME Shell, press Alt + F2 then type `rt`. diff --git a/src/gnome-shell/assets-dark/checkbox.svg b/src/gnome-shell/assets-dark/checkbox.svg index c406de295..29a61fb80 100644 --- a/src/gnome-shell/assets-dark/checkbox.svg +++ b/src/gnome-shell/assets-dark/checkbox.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets-dark/key-enter.svg b/src/gnome-shell/assets-dark/key-enter.svg index 8769f7790..104f94b64 100644 --- a/src/gnome-shell/assets-dark/key-enter.svg +++ b/src/gnome-shell/assets-dark/key-enter.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets-dark/key-shift-latched-uppercase.svg b/src/gnome-shell/assets-dark/key-shift-latched-uppercase.svg index 900111a90..06ccd5394 100644 --- a/src/gnome-shell/assets-dark/key-shift-latched-uppercase.svg +++ b/src/gnome-shell/assets-dark/key-shift-latched-uppercase.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets-dark/key-shift-uppercase.svg b/src/gnome-shell/assets-dark/key-shift-uppercase.svg index 994a1d395..cbc1bafcf 100644 --- a/src/gnome-shell/assets-dark/key-shift-uppercase.svg +++ b/src/gnome-shell/assets-dark/key-shift-uppercase.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets-dark/more-results.svg b/src/gnome-shell/assets-dark/more-results.svg index 5fa89fd32..4fde7d939 100644 --- a/src/gnome-shell/assets-dark/more-results.svg +++ b/src/gnome-shell/assets-dark/more-results.svg @@ -1,4 +1,4 @@ - - + + diff --git a/src/gnome-shell/assets-dark/toggle-on.svg b/src/gnome-shell/assets-dark/toggle-on.svg index ae616dafe..180880d19 100644 --- a/src/gnome-shell/assets-dark/toggle-on.svg +++ b/src/gnome-shell/assets-dark/toggle-on.svg @@ -1,4 +1,4 @@ - + diff --git a/src/gnome-shell/assets-dark/window-close-active.svg b/src/gnome-shell/assets-dark/window-close-active.svg index 36481be21..b6050f9f8 100644 --- a/src/gnome-shell/assets-dark/window-close-active.svg +++ b/src/gnome-shell/assets-dark/window-close-active.svg @@ -1,5 +1,5 @@ - - - + + + diff --git a/src/gnome-shell/assets-dark/window-close.svg b/src/gnome-shell/assets-dark/window-close.svg index 38ffee581..2303c0176 100644 --- a/src/gnome-shell/assets-dark/window-close.svg +++ b/src/gnome-shell/assets-dark/window-close.svg @@ -1,5 +1,5 @@ - - - + + + diff --git a/src/gnome-shell/assets/calendar-arrow-left.svg b/src/gnome-shell/assets/calendar-arrow-left.svg index 738a3f2ca..da7213da2 100644 --- a/src/gnome-shell/assets/calendar-arrow-left.svg +++ b/src/gnome-shell/assets/calendar-arrow-left.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/calendar-arrow-right.svg b/src/gnome-shell/assets/calendar-arrow-right.svg index acb514b9a..0b5a963e9 100644 --- a/src/gnome-shell/assets/calendar-arrow-right.svg +++ b/src/gnome-shell/assets/calendar-arrow-right.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/checkbox-off.svg b/src/gnome-shell/assets/checkbox-off.svg index cb4ae5326..2700c5f76 100644 --- a/src/gnome-shell/assets/checkbox-off.svg +++ b/src/gnome-shell/assets/checkbox-off.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/checkbox.svg b/src/gnome-shell/assets/checkbox.svg index c406de295..b77fa265f 100644 --- a/src/gnome-shell/assets/checkbox.svg +++ b/src/gnome-shell/assets/checkbox.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/close.svg b/src/gnome-shell/assets/close.svg index e8b831585..26850a514 100644 --- a/src/gnome-shell/assets/close.svg +++ b/src/gnome-shell/assets/close.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/key-shift-latched-uppercase.svg b/src/gnome-shell/assets/key-shift-latched-uppercase.svg index 900111a90..e39123a2f 100644 --- a/src/gnome-shell/assets/key-shift-latched-uppercase.svg +++ b/src/gnome-shell/assets/key-shift-latched-uppercase.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/key-shift-uppercase.svg b/src/gnome-shell/assets/key-shift-uppercase.svg index 994a1d395..f8fc678bf 100644 --- a/src/gnome-shell/assets/key-shift-uppercase.svg +++ b/src/gnome-shell/assets/key-shift-uppercase.svg @@ -1,3 +1,3 @@ - + diff --git a/src/gnome-shell/assets/more-results.svg b/src/gnome-shell/assets/more-results.svg index 5fa89fd32..847c26047 100644 --- a/src/gnome-shell/assets/more-results.svg +++ b/src/gnome-shell/assets/more-results.svg @@ -1,4 +1,4 @@ - + diff --git a/src/gnome-shell/assets/toggle-on.svg b/src/gnome-shell/assets/toggle-on.svg index ae616dafe..09f9e530d 100644 --- a/src/gnome-shell/assets/toggle-on.svg +++ b/src/gnome-shell/assets/toggle-on.svg @@ -1,4 +1,4 @@ - + diff --git a/src/gnome-shell/assets/window-close-active.svg b/src/gnome-shell/assets/window-close-active.svg index 36481be21..7ee327c46 100644 --- a/src/gnome-shell/assets/window-close-active.svg +++ b/src/gnome-shell/assets/window-close-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/gnome-shell/assets/window-close.svg b/src/gnome-shell/assets/window-close.svg index 38ffee581..d2a4fceb3 100644 --- a/src/gnome-shell/assets/window-close.svg +++ b/src/gnome-shell/assets/window-close.svg @@ -1,5 +1,5 @@ - + diff --git a/src/gtk-2.0/assets-dark.svg b/src/gtk-2.0/assets-dark.svg index 2418db7d0..ca95e8a1a 100644 --- a/src/gtk-2.0/assets-dark.svg +++ b/src/gtk-2.0/assets-dark.svg @@ -43,15 +43,15 @@ - + - + - + diff --git a/src/gtk-2.0/assets-dark/button-active.png b/src/gtk-2.0/assets-dark/button-active.png index 070271316..0c7dd80c8 100644 Binary files a/src/gtk-2.0/assets-dark/button-active.png and b/src/gtk-2.0/assets-dark/button-active.png differ diff --git a/src/gtk-2.0/assets-dark/button-hover.png b/src/gtk-2.0/assets-dark/button-hover.png index 6eeaa43d8..c6a2fa818 100644 Binary files a/src/gtk-2.0/assets-dark/button-hover.png and b/src/gtk-2.0/assets-dark/button-hover.png differ diff --git a/src/gtk-2.0/assets-dark/button.png b/src/gtk-2.0/assets-dark/button.png index 390856e6f..c19638420 100644 Binary files a/src/gtk-2.0/assets-dark/button.png and b/src/gtk-2.0/assets-dark/button.png differ diff --git a/src/gtk-2.0/assets-dark/frame-notebook.png b/src/gtk-2.0/assets-dark/frame-notebook.png index 29c2c6251..1ac768041 100644 Binary files a/src/gtk-2.0/assets-dark/frame-notebook.png and b/src/gtk-2.0/assets-dark/frame-notebook.png differ diff --git a/src/gtk-2.0/assets-dark/progressbar-trough.png b/src/gtk-2.0/assets-dark/progressbar-trough.png index 74b3921a9..dc67a3f36 100644 Binary files a/src/gtk-2.0/assets-dark/progressbar-trough.png and b/src/gtk-2.0/assets-dark/progressbar-trough.png differ diff --git a/src/gtk-2.0/assets-dark/scale-slider-disabled.png b/src/gtk-2.0/assets-dark/scale-slider-disabled.png index f7165aee7..efa6f93cd 100644 Binary files a/src/gtk-2.0/assets-dark/scale-slider-disabled.png and b/src/gtk-2.0/assets-dark/scale-slider-disabled.png differ diff --git a/src/gtk-2.0/assets-dark/scrollbar-horz-trough.png b/src/gtk-2.0/assets-dark/scrollbar-horz-trough.png index 51158e024..a0557419b 100644 Binary files a/src/gtk-2.0/assets-dark/scrollbar-horz-trough.png and b/src/gtk-2.0/assets-dark/scrollbar-horz-trough.png differ diff --git a/src/gtk-2.0/assets-dark/scrollbar-vert-ltr-trough.png b/src/gtk-2.0/assets-dark/scrollbar-vert-ltr-trough.png index 36b4ed6c1..fb07768df 100644 Binary files a/src/gtk-2.0/assets-dark/scrollbar-vert-ltr-trough.png and b/src/gtk-2.0/assets-dark/scrollbar-vert-ltr-trough.png differ diff --git a/src/gtk-2.0/assets-dark/scrollbar-vert-rtl-trough.png b/src/gtk-2.0/assets-dark/scrollbar-vert-rtl-trough.png index 596237faf..8d905d7ac 100644 Binary files a/src/gtk-2.0/assets-dark/scrollbar-vert-rtl-trough.png and b/src/gtk-2.0/assets-dark/scrollbar-vert-rtl-trough.png differ diff --git a/src/gtk-2.0/assets-dark/treeview-ltr-button-active.png b/src/gtk-2.0/assets-dark/treeview-ltr-button-active.png index 22083546d..0e1d93cf4 100644 Binary files a/src/gtk-2.0/assets-dark/treeview-ltr-button-active.png and b/src/gtk-2.0/assets-dark/treeview-ltr-button-active.png differ diff --git a/src/gtk-2.0/assets-dark/treeview-ltr-button-hover.png b/src/gtk-2.0/assets-dark/treeview-ltr-button-hover.png index f72ebb36f..564905608 100644 Binary files a/src/gtk-2.0/assets-dark/treeview-ltr-button-hover.png and b/src/gtk-2.0/assets-dark/treeview-ltr-button-hover.png differ diff --git a/src/gtk-2.0/assets-dark/treeview-ltr-button.png b/src/gtk-2.0/assets-dark/treeview-ltr-button.png index eae6879f6..1687745e1 100644 Binary files a/src/gtk-2.0/assets-dark/treeview-ltr-button.png and b/src/gtk-2.0/assets-dark/treeview-ltr-button.png differ diff --git a/src/gtk-2.0/assets-dark/treeview-rtl-button-active.png b/src/gtk-2.0/assets-dark/treeview-rtl-button-active.png index 99e6f020f..9493a4222 100644 Binary files a/src/gtk-2.0/assets-dark/treeview-rtl-button-active.png and b/src/gtk-2.0/assets-dark/treeview-rtl-button-active.png differ diff --git a/src/gtk-2.0/assets-dark/treeview-rtl-button-hover.png b/src/gtk-2.0/assets-dark/treeview-rtl-button-hover.png index f8aac007c..d11cc60d7 100644 Binary files a/src/gtk-2.0/assets-dark/treeview-rtl-button-hover.png and b/src/gtk-2.0/assets-dark/treeview-rtl-button-hover.png differ diff --git a/src/gtk-2.0/assets-dark/treeview-rtl-button.png b/src/gtk-2.0/assets-dark/treeview-rtl-button.png index 1f5d8a5a3..b163d3016 100644 Binary files a/src/gtk-2.0/assets-dark/treeview-rtl-button.png and b/src/gtk-2.0/assets-dark/treeview-rtl-button.png differ diff --git a/src/gtk-2.0/assets.svg b/src/gtk-2.0/assets.svg index d404a7ba9..45f9757cc 100644 --- a/src/gtk-2.0/assets.svg +++ b/src/gtk-2.0/assets.svg @@ -15,7 +15,7 @@ - + @@ -39,11 +39,11 @@ - + - + diff --git a/src/gtk-2.0/assets/checkbox-checked-active.png b/src/gtk-2.0/assets/checkbox-checked-active.png index 15e38b8c0..814930df1 100644 Binary files a/src/gtk-2.0/assets/checkbox-checked-active.png and b/src/gtk-2.0/assets/checkbox-checked-active.png differ diff --git a/src/gtk-2.0/assets/checkbox-checked-hover.png b/src/gtk-2.0/assets/checkbox-checked-hover.png index 1056b87f8..8d2459e3d 100644 Binary files a/src/gtk-2.0/assets/checkbox-checked-hover.png and b/src/gtk-2.0/assets/checkbox-checked-hover.png differ diff --git a/src/gtk-2.0/assets/checkbox-checked.png b/src/gtk-2.0/assets/checkbox-checked.png index 545d67806..c93289315 100644 Binary files a/src/gtk-2.0/assets/checkbox-checked.png and b/src/gtk-2.0/assets/checkbox-checked.png differ diff --git a/src/gtk-2.0/assets/checkbox-mixed-active.png b/src/gtk-2.0/assets/checkbox-mixed-active.png index 9fc083d4b..760d8b6b1 100644 Binary files a/src/gtk-2.0/assets/checkbox-mixed-active.png and b/src/gtk-2.0/assets/checkbox-mixed-active.png differ diff --git a/src/gtk-2.0/assets/checkbox-mixed-hover.png b/src/gtk-2.0/assets/checkbox-mixed-hover.png index c5abbb29d..ff35693f4 100644 Binary files a/src/gtk-2.0/assets/checkbox-mixed-hover.png and b/src/gtk-2.0/assets/checkbox-mixed-hover.png differ diff --git a/src/gtk-2.0/assets/checkbox-mixed.png b/src/gtk-2.0/assets/checkbox-mixed.png index 91325138f..09402cd85 100644 Binary files a/src/gtk-2.0/assets/checkbox-mixed.png and b/src/gtk-2.0/assets/checkbox-mixed.png differ diff --git a/src/gtk-2.0/assets/checkbox-unchecked.png b/src/gtk-2.0/assets/checkbox-unchecked.png index d7a7728f1..75c89edbf 100644 Binary files a/src/gtk-2.0/assets/checkbox-unchecked.png and b/src/gtk-2.0/assets/checkbox-unchecked.png differ diff --git a/src/gtk-2.0/assets/combo-left-entry-active.png b/src/gtk-2.0/assets/combo-left-entry-active.png index db5c08bef..3335374b9 100644 Binary files a/src/gtk-2.0/assets/combo-left-entry-active.png and b/src/gtk-2.0/assets/combo-left-entry-active.png differ diff --git a/src/gtk-2.0/assets/combo-right-entry-active.png b/src/gtk-2.0/assets/combo-right-entry-active.png index 65e1aa41f..26516ff63 100644 Binary files a/src/gtk-2.0/assets/combo-right-entry-active.png and b/src/gtk-2.0/assets/combo-right-entry-active.png differ diff --git a/src/gtk-2.0/assets/entry-active.png b/src/gtk-2.0/assets/entry-active.png index 64e5538a4..bb97ac168 100644 Binary files a/src/gtk-2.0/assets/entry-active.png and b/src/gtk-2.0/assets/entry-active.png differ diff --git a/src/gtk-2.0/assets/handle-horz-hover.png b/src/gtk-2.0/assets/handle-horz-hover.png index 7f3a508eb..770dde3b7 100644 Binary files a/src/gtk-2.0/assets/handle-horz-hover.png and b/src/gtk-2.0/assets/handle-horz-hover.png differ diff --git a/src/gtk-2.0/assets/handle-vert-hover.png b/src/gtk-2.0/assets/handle-vert-hover.png index a21c1cc80..2fc327991 100644 Binary files a/src/gtk-2.0/assets/handle-vert-hover.png and b/src/gtk-2.0/assets/handle-vert-hover.png differ diff --git a/src/gtk-2.0/assets/menu-checkbox-checked.png b/src/gtk-2.0/assets/menu-checkbox-checked.png index 4c18a7bcc..5c7bfdfb4 100644 Binary files a/src/gtk-2.0/assets/menu-checkbox-checked.png and b/src/gtk-2.0/assets/menu-checkbox-checked.png differ diff --git a/src/gtk-2.0/assets/menu-checkbox-mixed.png b/src/gtk-2.0/assets/menu-checkbox-mixed.png index 6eaadc6a6..f7d2a6446 100644 Binary files a/src/gtk-2.0/assets/menu-checkbox-mixed.png and b/src/gtk-2.0/assets/menu-checkbox-mixed.png differ diff --git a/src/gtk-2.0/assets/menu-checkbox-unchecked.png b/src/gtk-2.0/assets/menu-checkbox-unchecked.png index e95664819..51e3ba31c 100644 Binary files a/src/gtk-2.0/assets/menu-checkbox-unchecked.png and b/src/gtk-2.0/assets/menu-checkbox-unchecked.png differ diff --git a/src/gtk-2.0/assets/menu-radio-checked.png b/src/gtk-2.0/assets/menu-radio-checked.png index 762e49524..5bbb46eb7 100644 Binary files a/src/gtk-2.0/assets/menu-radio-checked.png and b/src/gtk-2.0/assets/menu-radio-checked.png differ diff --git a/src/gtk-2.0/assets/menu-radio-mixed.png b/src/gtk-2.0/assets/menu-radio-mixed.png index 5c446abbb..93dfdd048 100644 Binary files a/src/gtk-2.0/assets/menu-radio-mixed.png and b/src/gtk-2.0/assets/menu-radio-mixed.png differ diff --git a/src/gtk-2.0/assets/menu-radio-unchecked.png b/src/gtk-2.0/assets/menu-radio-unchecked.png index 7a162b72d..509d0aa41 100644 Binary files a/src/gtk-2.0/assets/menu-radio-unchecked.png and b/src/gtk-2.0/assets/menu-radio-unchecked.png differ diff --git a/src/gtk-2.0/assets/pan-down-alt.png b/src/gtk-2.0/assets/pan-down-alt.png index 40d71a04e..882e1073c 100644 Binary files a/src/gtk-2.0/assets/pan-down-alt.png and b/src/gtk-2.0/assets/pan-down-alt.png differ diff --git a/src/gtk-2.0/assets/pan-left-alt.png b/src/gtk-2.0/assets/pan-left-alt.png index 213982490..005464ac5 100644 Binary files a/src/gtk-2.0/assets/pan-left-alt.png and b/src/gtk-2.0/assets/pan-left-alt.png differ diff --git a/src/gtk-2.0/assets/pan-right-alt.png b/src/gtk-2.0/assets/pan-right-alt.png index bc082e93d..f0df5f8e7 100644 Binary files a/src/gtk-2.0/assets/pan-right-alt.png and b/src/gtk-2.0/assets/pan-right-alt.png differ diff --git a/src/gtk-2.0/assets/pan-up-alt.png b/src/gtk-2.0/assets/pan-up-alt.png index c5cc3a377..718429b91 100644 Binary files a/src/gtk-2.0/assets/pan-up-alt.png and b/src/gtk-2.0/assets/pan-up-alt.png differ diff --git a/src/gtk-2.0/assets/progressbar-progress.png b/src/gtk-2.0/assets/progressbar-progress.png index 35cd51459..6b67701ba 100644 Binary files a/src/gtk-2.0/assets/progressbar-progress.png and b/src/gtk-2.0/assets/progressbar-progress.png differ diff --git a/src/gtk-2.0/assets/progressbar-trough.png b/src/gtk-2.0/assets/progressbar-trough.png index bc17889ac..fa8d10561 100644 Binary files a/src/gtk-2.0/assets/progressbar-trough.png and b/src/gtk-2.0/assets/progressbar-trough.png differ diff --git a/src/gtk-2.0/assets/radio-checked-active.png b/src/gtk-2.0/assets/radio-checked-active.png index 2ef325dc6..61fa53a49 100644 Binary files a/src/gtk-2.0/assets/radio-checked-active.png and b/src/gtk-2.0/assets/radio-checked-active.png differ diff --git a/src/gtk-2.0/assets/radio-checked-hover.png b/src/gtk-2.0/assets/radio-checked-hover.png index 63d81222d..4828c70fb 100644 Binary files a/src/gtk-2.0/assets/radio-checked-hover.png and b/src/gtk-2.0/assets/radio-checked-hover.png differ diff --git a/src/gtk-2.0/assets/radio-checked.png b/src/gtk-2.0/assets/radio-checked.png index 4317aa75e..abf9b91b5 100644 Binary files a/src/gtk-2.0/assets/radio-checked.png and b/src/gtk-2.0/assets/radio-checked.png differ diff --git a/src/gtk-2.0/assets/radio-mixed-active.png b/src/gtk-2.0/assets/radio-mixed-active.png index 45a32cf32..052b2e0a1 100644 Binary files a/src/gtk-2.0/assets/radio-mixed-active.png and b/src/gtk-2.0/assets/radio-mixed-active.png differ diff --git a/src/gtk-2.0/assets/radio-mixed-hover.png b/src/gtk-2.0/assets/radio-mixed-hover.png index 7fd76fae4..8f9d6fd42 100644 Binary files a/src/gtk-2.0/assets/radio-mixed-hover.png and b/src/gtk-2.0/assets/radio-mixed-hover.png differ diff --git a/src/gtk-2.0/assets/radio-mixed.png b/src/gtk-2.0/assets/radio-mixed.png index 9382a9fed..df99814c6 100644 Binary files a/src/gtk-2.0/assets/radio-mixed.png and b/src/gtk-2.0/assets/radio-mixed.png differ diff --git a/src/gtk-2.0/assets/radio-unchecked.png b/src/gtk-2.0/assets/radio-unchecked.png index cb12d6cfb..33fe866a5 100644 Binary files a/src/gtk-2.0/assets/radio-unchecked.png and b/src/gtk-2.0/assets/radio-unchecked.png differ diff --git a/src/gtk-2.0/assets/scale-horz-trough-active.png b/src/gtk-2.0/assets/scale-horz-trough-active.png index 3b053b7e4..54ce6c608 100644 Binary files a/src/gtk-2.0/assets/scale-horz-trough-active.png and b/src/gtk-2.0/assets/scale-horz-trough-active.png differ diff --git a/src/gtk-2.0/assets/scale-slider-active.png b/src/gtk-2.0/assets/scale-slider-active.png index 675dd6ab1..397950ea3 100644 Binary files a/src/gtk-2.0/assets/scale-slider-active.png and b/src/gtk-2.0/assets/scale-slider-active.png differ diff --git a/src/gtk-2.0/assets/scale-slider-disabled.png b/src/gtk-2.0/assets/scale-slider-disabled.png index 1faf77403..d61eeec75 100644 Binary files a/src/gtk-2.0/assets/scale-slider-disabled.png and b/src/gtk-2.0/assets/scale-slider-disabled.png differ diff --git a/src/gtk-2.0/assets/scale-slider-hover.png b/src/gtk-2.0/assets/scale-slider-hover.png index a73a00d7e..0ca0740a1 100644 Binary files a/src/gtk-2.0/assets/scale-slider-hover.png and b/src/gtk-2.0/assets/scale-slider-hover.png differ diff --git a/src/gtk-2.0/assets/scale-slider.png b/src/gtk-2.0/assets/scale-slider.png index 265d4424d..603e9a2bc 100644 Binary files a/src/gtk-2.0/assets/scale-slider.png and b/src/gtk-2.0/assets/scale-slider.png differ diff --git a/src/gtk-2.0/assets/scale-vert-trough-active.png b/src/gtk-2.0/assets/scale-vert-trough-active.png index 3e1dd87d3..69eba27bb 100644 Binary files a/src/gtk-2.0/assets/scale-vert-trough-active.png and b/src/gtk-2.0/assets/scale-vert-trough-active.png differ diff --git a/src/gtk-2.0/assets/scrollbar-horz-slider-hover.png b/src/gtk-2.0/assets/scrollbar-horz-slider-hover.png index 62fe6586f..e2e37af93 100644 Binary files a/src/gtk-2.0/assets/scrollbar-horz-slider-hover.png and b/src/gtk-2.0/assets/scrollbar-horz-slider-hover.png differ diff --git a/src/gtk-2.0/assets/scrollbar-vert-ltr-slider-hover.png b/src/gtk-2.0/assets/scrollbar-vert-ltr-slider-hover.png index b6ccfc2b5..8687465d6 100644 Binary files a/src/gtk-2.0/assets/scrollbar-vert-ltr-slider-hover.png and b/src/gtk-2.0/assets/scrollbar-vert-ltr-slider-hover.png differ diff --git a/src/gtk-2.0/assets/scrollbar-vert-rtl-slider-hover.png b/src/gtk-2.0/assets/scrollbar-vert-rtl-slider-hover.png index 708dc2e31..62b5fd655 100644 Binary files a/src/gtk-2.0/assets/scrollbar-vert-rtl-slider-hover.png and b/src/gtk-2.0/assets/scrollbar-vert-rtl-slider-hover.png differ diff --git a/src/gtk-2.0/assets/tab.png b/src/gtk-2.0/assets/tab.png index ede5eb1d8..72ff725f1 100644 Binary files a/src/gtk-2.0/assets/tab.png and b/src/gtk-2.0/assets/tab.png differ diff --git a/src/gtk-2.0/gtkrc b/src/gtk-2.0/gtkrc index c9238272b..4f7b6fc63 100644 --- a/src/gtk-2.0/gtkrc +++ b/src/gtk-2.0/gtkrc @@ -1,8 +1,8 @@ # Based on Bridge by ScionicSpectre and Adwaita by GNOME # vim:set ts=2 sw=2 sts=2 ai et: # -# This is the GTK+ 2 version of Flat-Plat-Blue. Its whole purpose is to look as the -# GTK+ 3 version as much as possible until GTK+ 2 dies completely. +# This is the GTK 2 version of Flat-Plat-Blue. It's whole purpose is to look as the +# GTK 3 version as much as possible until GTK 2 dies completely. # # Note: comments for explaining styles are on the bottom of each file beside the # widget matches. @@ -16,15 +16,15 @@ gtk-color-scheme = "text_color:#212121\nbase_color:#FFFFFF" # Foreground/background gtk-color-scheme = "fg_color:#212121\nbg_color:#F2F2F2" # Selected foreground/background -gtk-color-scheme = "selected_fg_color:#FFFFFF\nselected_bg_color:#1E88E5" +gtk-color-scheme = "selected_fg_color:#FFFFFF\nselected_bg_color:#1A73E8" # Titlebar foreground/background -gtk-color-scheme = "titlebar_fg_color:#FFFFFF\ntitlebar_bg_color:#E0E0E0" +gtk-color-scheme = "titlebar_fg_color:#FFFFFF\ntitlebar_bg_color:#353535" # Menus gtk-color-scheme = "menu_color:#FFFFFF" # Tooltips foreground/background gtk-color-scheme = "tooltip_fg_color:#FFFFFF\ntooltip_bg_color:#616161" # Links -gtk-color-scheme = "link_color:#4285F4\nvisited_link_color:#9C27B0" +gtk-color-scheme = "link_color:#1A73E8\nvisited_link_color:#9C27B0" # Set GTK settings gtk-auto-mnemonics = 1 diff --git a/src/gtk-2.0/gtkrc-dark b/src/gtk-2.0/gtkrc-dark index 0ed783f76..5f4c5b088 100644 --- a/src/gtk-2.0/gtkrc-dark +++ b/src/gtk-2.0/gtkrc-dark @@ -1,8 +1,8 @@ # Based on Bridge by ScionicSpectre and Adwaita by GNOME # vim:set ts=2 sw=2 sts=2 ai et: # -# This is the GTK+ 2 version of Flat-Plat-Blue. Its whole purpose is to look as the -# GTK+ 3 version as much as possible until GTK+ 2 dies completely. +# This is the GTK 2 version of Flat-Plat-Blue. It's whole purpose is to look as the +# GTK 3 version as much as possible until GTK 2 dies completely. # # Note: comments for explaining styles are on the bottom of each file beside the # widget matches. @@ -12,15 +12,15 @@ # order to not mess up the dark theme. # Text/base -gtk-color-scheme = "text_color:#FFFFFF\nbase_color:#303030" +gtk-color-scheme = "text_color:#FFFFFF\nbase_color:#2C2C2C" # Foreground/background -gtk-color-scheme = "fg_color:#FFFFFF\nbg_color:#282828" +gtk-color-scheme = "fg_color:#FFFFFF\nbg_color:#212121" # Selected foreground/background -gtk-color-scheme = "selected_fg_color:#FFFFFF\nselected_bg_color:#1E88E5" +gtk-color-scheme = "selected_fg_color:#FFFFFF\nselected_bg_color:#8AB4F8" # Titlebar foreground/background -gtk-color-scheme = "titlebar_fg_color:#FFFFFF\ntitlebar_bg_color:#383838" +gtk-color-scheme = "titlebar_fg_color:#FFFFFF\ntitlebar_bg_color:#353535" # Menus -gtk-color-scheme = "menu_color:#424242" +gtk-color-scheme = "menu_color:#3C3C3C" # Tooltips foreground/background gtk-color-scheme = "tooltip_fg_color:#FFFFFF\ntooltip_bg_color:#616161" # Links diff --git a/src/gtk-2.0/gtkrc-light b/src/gtk-2.0/gtkrc-light index ab46df310..7a6cb9aef 100644 --- a/src/gtk-2.0/gtkrc-light +++ b/src/gtk-2.0/gtkrc-light @@ -1,8 +1,8 @@ # Based on Bridge by ScionicSpectre and Adwaita by GNOME # vim:set ts=2 sw=2 sts=2 ai et: # -# This is the GTK+ 2 version of Flat-Plat-Blue. Its whole purpose is to look as the -# GTK+ 3 version as much as possible until GTK+ 2 dies completely. +# This is the GTK 2 version of Flat-Plat-Blue. It's whole purpose is to look as the +# GTK 3 version as much as possible until GTK 2 dies completely. # # Note: comments for explaining styles are on the bottom of each file beside the # widget matches. @@ -16,7 +16,7 @@ gtk-color-scheme = "text_color:#212121\nbase_color:#FFFFFF" # Foreground/background gtk-color-scheme = "fg_color:#212121\nbg_color:#F2F2F2" # Selected foreground/background -gtk-color-scheme = "selected_fg_color:#FFFFFF\nselected_bg_color:#1E88E5" +gtk-color-scheme = "selected_fg_color:#FFFFFF\nselected_bg_color:#1A73E8" # Titlebar foreground/background gtk-color-scheme = "titlebar_fg_color:#212121\ntitlebar_bg_color:#E0E0E0" # Menus @@ -24,7 +24,7 @@ gtk-color-scheme = "menu_color:#FFFFFF" # Tooltips foreground/background gtk-color-scheme = "tooltip_fg_color:#FFFFFF\ntooltip_bg_color:#616161" # Links -gtk-color-scheme = "link_color:#4285F4\nvisited_link_color:#9C27B0" +gtk-color-scheme = "link_color:#1A73E8\nvisited_link_color:#9C27B0" # Set GTK settings gtk-auto-mnemonics = 1 diff --git a/src/gtk/3.0/gtk-compact.css b/src/gtk/3.0/gtk-compact.css index 5adee0b49..f246cd0d0 100644 --- a/src/gtk/3.0/gtk-compact.css +++ b/src/gtk/3.0/gtk-compact.css @@ -12,17 +12,17 @@ @keyframes ripple-on-headerbar { from { - background-image: radial-gradient(circle, #4285F4 0%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 0%, transparent 0%); } to { - background-image: radial-gradient(circle, #4285F4 100%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 100%, transparent 0%); } } * { background-clip: padding-box; -GtkToolButton-icon-spacing: 0; - -GtkTextView-error-underline-color: #EA4335; + -GtkTextView-error-underline-color: #D93025; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 24; @@ -34,7 +34,7 @@ outline-color: transparent; outline-offset: -4px; -gtk-outline-radius: 2px; - -gtk-secondary-caret-color: #4285F4; + -gtk-secondary-caret-color: #1A73E8; } *:focus { @@ -80,7 +80,7 @@ } .gtkstyle-fallback:selected { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -94,7 +94,7 @@ } .view:selected:hover { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.08); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.08); } .view:disabled { @@ -111,7 +111,7 @@ textview text { textview border { background-color: #FAFAFA; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .rubberband, @@ -139,7 +139,7 @@ label { } label.separator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } label:disabled { @@ -152,8 +152,14 @@ button label:disabled { color: inherit; } +label.osd { + border-radius: 2px; + background-color: rgba(97, 97, 97, 0.9); + color: white; +} + .dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } assistant .sidebar { @@ -205,7 +211,7 @@ entry { border-radius: 2px 2px 0 0; caret-color: currentColor; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -213,7 +219,7 @@ entry { spinbutton:focus:not(.vertical), entry:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton:drop(active):not(.vertical), @@ -238,7 +244,7 @@ entry.flat { spinbutton:not(.vertical) image, entry image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, @@ -267,7 +273,7 @@ entry image.right { spinbutton:not(.vertical) undershoot.left, entry undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -278,7 +284,7 @@ entry undershoot.left { spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -289,15 +295,15 @@ entry undershoot.right { spinbutton.error:not(.vertical), entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #EA4335; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #D93025; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.error:focus:not(.vertical), entry.error:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.error:disabled:not(.vertical), @@ -310,15 +316,15 @@ entry.error:disabled { spinbutton.warning:not(.vertical), entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FBBC05; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #F4B400; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.warning:focus:not(.vertical), entry.warning:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.warning:disabled:not(.vertical), @@ -331,7 +337,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { margin: 2px -8px; - border-bottom: 2px solid #4285F4; + border-bottom: 2px solid #1A73E8; background-color: transparent; } @@ -339,22 +345,22 @@ spinbutton.vertical entry, .gedit-search-slider .linked:not(.vertical) > entry { border-radius: 2px; transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry:focus, .gedit-search-slider .linked:not(.vertical) > entry:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:drop(active), .gedit-search-slider .linked:not(.vertical) > entry:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) > entry:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -362,18 +368,18 @@ spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) spinbutton.vertical entry.error, .gedit-search-slider .linked:not(.vertical) > entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #EA4335; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #D93025; color: white; } spinbutton.vertical entry.error:focus, .gedit-search-slider .linked:not(.vertical) > entry.error:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.error:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -393,24 +399,24 @@ spinbutton.vertical entry.error image:disabled, .gedit-search-slider .linked:not spinbutton.vertical entry.warning, .gedit-search-slider .linked:not(.vertical) > entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #FBBC05; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.warning:focus, .gedit-search-slider .linked:not(.vertical) > entry.warning:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.warning:disabled, .gedit-search-slider .linked:not(.vertical) > entry.warning:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } spinbutton.vertical entry.warning image, .gedit-search-slider .linked:not(.vertical) > entry.warning image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.warning image:hover, .gedit-search-slider .linked:not(.vertical) > entry.warning image:hover, spinbutton.vertical entry.warning image:active, .gedit-search-slider .linked:not(.vertical) > entry.warning image:active { @@ -462,7 +468,7 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f } .entry-tag.button:not(:hover):not(:active), .button.documents-entry-tag:not(:hover):not(:active), .button.photos-entry-tag:not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /*********** @@ -470,10 +476,10 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f ***********/ @keyframes needs-attention { from { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } to { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#1A73E8), to(transparent)); } } @@ -486,7 +492,7 @@ button { font-weight: 500; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; - box-shadow: inset 0 0 0 9999px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: inset 0 0 0 9999px transparent, 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; @@ -497,20 +503,20 @@ button { button:focus { - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:hover, button:drop(active) { - box-shadow: inset 0 0 0 9999px transparent, 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px transparent, 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 5px 3px -3px rgba(0, 0, 0, 0.2), 0 8px 6px 1px rgba(0, 0, 0, 0.14), 0 3px 8.4px 2px rgba(0, 0, 0, 0.12); background-image: radial-gradient(circle, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; } @@ -524,7 +530,7 @@ button:disabled { button:checked { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -537,9 +543,9 @@ button:checked:disabled { modelbutton.flat, .menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, notebook > header > tabs > arrow, scrollbar button, check, -radio, calendar.button, button.sidebar-button, infobar.info button, infobar.question button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .lock-dialog button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, -.path-bar button, popover.background.menu button, -popover.background button.model, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, .nemo-window .toolbar button, +radio, calendar.button, button.sidebar-button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, +.path-bar.linked:not(.vertical) > button, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), popover.background.menu button, +popover.background button.model, actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, infobar.info button, infobar.question button, .lock-dialog button, .lightdm-gtk-greeter button, .nemo-window .toolbar button, button.flat { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; @@ -549,14 +555,14 @@ button.flat { background-repeat: no-repeat; background-position: center; background-size: 1000% 1000%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } modelbutton.flat:focus, .menuitem.button.flat:focus, spinbutton:not(.vertical) button:focus, spinbutton.vertical button:focus, notebook > header > tabs > arrow:focus, scrollbar button:focus, check:focus, -radio:focus, calendar.button:focus, button.sidebar-button:focus, infobar.info button:focus, infobar.question button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .lock-dialog button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, .lightdm-gtk-greeter button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, -.path-bar button:focus, popover.background.menu button:focus, -popover.background button.model:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, .nemo-window .toolbar button:focus, +radio:focus, calendar.button:focus, button.sidebar-button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, +.path-bar.linked:not(.vertical) > button:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), popover.background.menu button:focus, +popover.background button.model:focus, actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, infobar.info button:focus, infobar.question button:focus, .lock-dialog button:focus, .lightdm-gtk-greeter button:focus, .nemo-window .toolbar button:focus, button.flat:focus { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); color: rgba(0, 0, 0, 0.87); @@ -568,44 +574,50 @@ spinbutton:not(.vertical) button:drop(active), spinbutton.vertical button:hover, spinbutton.vertical button:drop(active), notebook > header > tabs > arrow:hover, scrollbar button:hover, scrollbar button:drop(active), check:hover, radio:hover, calendar.button:hover, button.sidebar-button:hover, -button.sidebar-button:drop(active), infobar.info button:hover, -infobar.info button:drop(active), infobar.question button:hover, -infobar.question button:drop(active), .gedit-search-slider .linked > button:hover, +button.sidebar-button:drop(active), .gedit-search-slider .linked > button:hover, .gedit-search-slider .linked > button:drop(active), popover.messagepopover .popover-action-area button:hover, popover.messagepopover .popover-action-area button:drop(active), #MatePanelPopupWindow button:hover, #MatePanelPopupWindow button:drop(active), #mate-menu button:hover, -#mate-menu button:drop(active), .lock-dialog button:hover, -.lock-dialog button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, +#mate-menu button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, .budgie-settings-window buttonbox.inline-toolbar button:drop(active), .drop-shadow button:hover, .drop-shadow button:drop(active), .budgie-session-dialog .linked.horizontal > button:hover, -.budgie-session-dialog .linked.horizontal > button:drop(active), .lightdm-gtk-greeter button:hover, -.lightdm-gtk-greeter button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), +.budgie-session-dialog .linked.horizontal > button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), combobox > .linked:not(.vertical) > button:not(:only-child):drop(active), .caja-pathbar button:hover, .caja-pathbar button:drop(active), -.path-bar button:hover, -.path-bar button:drop(active), popover.background.menu button:hover, -popover.background.menu button:drop(active), -popover.background button.model:hover, -popover.background button.model:drop(active), layouttabbar button:hover, +.path-bar.linked:not(.vertical) > button:hover, +.path-bar.linked:not(.vertical) > button:drop(active), layouttabbar button:hover, layouttabbar button:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven stackswitcher.linked > button:hover, .raven stackswitcher.linked > button:drop(active), .xfce4-panel.background button:hover, .xfce4-panel.background button:drop(active), toolbar button:hover, toolbar button:drop(active), .titlebar button:hover:not(.suggested-action):not(.destructive-action), -.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), +.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), popover.background.menu button:hover, +popover.background.menu button:drop(active), +popover.background button.model:hover, +popover.background button.model:drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):drop(active), .app-notification button:hover, .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:hover, messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:hover, -filechooser #pathbarbox > stack > box > button:drop(active), .nemo-window .toolbar button:hover, +filechooser #pathbarbox > stack > box > button:drop(active), infobar.info button:hover, +infobar.info button:drop(active), infobar.question button:hover, +infobar.question button:drop(active), .lock-dialog button:hover, +.lock-dialog button:drop(active), .lightdm-gtk-greeter button:hover, +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:hover, .nemo-window .toolbar button:drop(active), button.flat:hover, toolbar button:drop(active), .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), +popover.background.menu button:drop(active), +popover.background button.model:drop(active), actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:drop(active), +infobar.info button:drop(active), +infobar.question button:drop(active), +.lock-dialog button:drop(active), +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:drop(active), button.flat:drop(active) { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -614,9 +626,9 @@ button.flat:drop(active) { modelbutton.flat:active, .menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active, -radio:active, calendar.button:active, button.sidebar-button:active, infobar.info button:active, infobar.question button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .lock-dialog button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, -.path-bar button:active, popover.background.menu button:active, -popover.background button.model:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, +radio:active, calendar.button:active, button.sidebar-button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, +.path-bar.linked:not(.vertical) > button:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), popover.background.menu button:active, +popover.background button.model:active, actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, infobar.info button:active, infobar.question button:active, .lock-dialog button:active, .lightdm-gtk-greeter button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; @@ -628,9 +640,9 @@ button.flat:active { modelbutton.flat:disabled, .menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, -radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, infobar.info button:disabled, infobar.question button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .lock-dialog button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, -.path-bar button:disabled, popover.background.menu button:disabled, -popover.background button.model:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, .nemo-window .toolbar button:disabled, +radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, +.path-bar.linked:not(.vertical) > button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:disabled, +popover.background button.model:disabled, actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, infobar.info button:disabled, infobar.question button:disabled, .lock-dialog button:disabled, .lightdm-gtk-greeter button:disabled, .nemo-window .toolbar button:disabled, button.flat:disabled { box-shadow: none; background-color: transparent; @@ -638,16 +650,16 @@ button.flat:disabled { } combobox > .linked:not(.vertical) > button:checked:not(:only-child), .caja-pathbar button:checked, -.path-bar button:checked, popover.background.menu button:checked, -popover.background button.model:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background 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 button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, +.path-bar.linked:not(.vertical) > button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked, +popover.background button.model:checked, actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, infobar.info button:checked, infobar.question button:checked, .lock-dialog button:checked, .lightdm-gtk-greeter button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.87); } combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), .caja-pathbar button:checked:disabled, -.path-bar button:checked:disabled, popover.background.menu button:checked:disabled, -popover.background button.model:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .xfce4-panel.background 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 button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, +.path-bar.linked:not(.vertical) > 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, .xfce4-panel.background button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked:disabled, +popover.background button.model:checked:disabled, actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, infobar.info button:checked:disabled, infobar.question button:checked:disabled, .lock-dialog button:checked:disabled, .lightdm-gtk-greeter button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.38); @@ -660,7 +672,8 @@ button.text-button { padding-right: 16px; } -toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, .nemo-window .toolbar button.text-button, +toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), popover.background.menu button.text-button, +popover.background button.text-button.model, actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, infobar.info button.text-button, infobar.question button.text-button, .lock-dialog button.text-button, .lightdm-gtk-greeter button.text-button, .nemo-window .toolbar button.text-button, button.text-button.flat { min-width: 48px; padding-left: 8px; @@ -690,12 +703,12 @@ button.text-button.image-button label:last-child { margin-right: 12px; } -toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, +toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, popover.background.menu button.text-button.image-button label:first-child, popover.background button.text-button.image-button.model label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, infobar.info button.text-button.image-button label:first-child, infobar.question button.text-button.image-button label:first-child, .lock-dialog button.text-button.image-button label:first-child, .lightdm-gtk-greeter button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, button.text-button.image-button.flat label:first-child { margin-left: 8px; } -toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, +toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, popover.background.menu button.text-button.image-button label:last-child, popover.background button.text-button.image-button.model label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, infobar.info button.text-button.image-button label:last-child, infobar.question button.text-button.image-button label:last-child, .lock-dialog button.text-button.image-button label:last-child, .lightdm-gtk-greeter button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, button.text-button.image-button.flat label:last-child { margin-right: 8px; } @@ -705,13 +718,20 @@ button.text-button.image-button image:not(:only-child) { margin: 0 4px; } -toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), +toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child), +popover.background .linked:not(.vertical) > button.model:not(:only-child), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), infobar.info .linked:not(.vertical) > button:not(:only-child), infobar.question .linked:not(.vertical) > button:not(:only-child), .lock-dialog .linked:not(.vertical) > button:not(:only-child), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), toolbar .linked.vertical > button:not(:only-child), .titlebar .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child), +popover.background .linked.vertical > button.model:not(:only-child), actionbar > revealer > box .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > button:not(:only-child), messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child), filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child), +infobar.info .linked.vertical > button:not(:only-child), +infobar.question .linked.vertical > button:not(:only-child), +.lock-dialog .linked.vertical > button:not(:only-child), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child), .nemo-window .toolbar .linked.vertical > button:not(:only-child), .linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > @@ -719,39 +739,33 @@ button.flat:not(:only-child) { border-radius: 2px; } -toolbar .linked:not(.vertical) > button:not(:only-child).image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button, -toolbar .linked.vertical > button:not(:only-child).image-button, -.titlebar .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button, .linked:not(.vertical) > -button.flat:not(:only-child).image-button, +toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +popover.background .linked:not(.vertical) > button.model:not(:only-child).image-button:not(.text-button), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.info .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.question .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lock-dialog .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.titlebar .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child).image-button:not(.text-button), +popover.background .linked.vertical > button.model:not(:only-child).image-button:not(.text-button), +actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +.app-notification .linked.vertical > button:not(:only-child).image-button:not(.text-button), +messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button:not(.text-button), +filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.info .linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.question .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lock-dialog .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), .linked:not(.vertical) > +button.flat:not(:only-child).image-button:not(.text-button), .linked.vertical > -button.flat:not(:only-child).image-button { +button.flat:not(:only-child).image-button:not(.text-button) { border-radius: 9999px; } -toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).text-button.image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).text-button.image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).text-button.image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, -toolbar .linked.vertical > button:not(:only-child).text-button.image-button, -.titlebar .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).text-button.image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).text-button.image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).text-button.image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).text-button.image-button, .linked:not(.vertical) > -button.flat:not(:only-child).text-button.image-button, -.linked.vertical > -button.flat:not(:only-child).text-button.image-button { - border-radius: 2px; -} - infobar.error button.flat, .mate-panel-menu-bar button, .budgie-panel button, .raven-mpris button.image-button, .xfce4-panel.background button { color: rgba(255, 255, 255, 0.7); } -infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), +infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error popover.background.menu button:drop(active), popover.background.menu infobar.error button:drop(active), +infobar.error popover.background button.model:drop(active), popover.background infobar.error button.model:drop(active), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error infobar.info button:drop(active), infobar.info infobar.error button:drop(active), infobar.error infobar.question button:drop(active), infobar.question infobar.error button:drop(active), infobar.error .lock-dialog button:drop(active), .lock-dialog infobar.error button:drop(active), infobar.error .lightdm-gtk-greeter button:drop(active), .lightdm-gtk-greeter infobar.error button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), infobar.error button.flat:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven-mpris button.image-button:hover, @@ -785,7 +799,7 @@ button.osd:disabled { button.suggested-action { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -798,13 +812,13 @@ button.suggested-action:disabled { button.suggested-action:checked { - background-color: #7baaf7; + background-color: #5f9def; } button.suggested-action.flat { background-color: transparent; - color: #4285F4; + color: #1A73E8; } @@ -816,12 +830,12 @@ button.suggested-action.flat:disabled { button.suggested-action.flat:checked { - background-color: rgba(66, 133, 244, 0.3); + background-color: rgba(26, 115, 232, 0.3); } button.destructive-action { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -834,13 +848,13 @@ button.destructive-action:disabled { button.destructive-action:checked { - background-color: #f07b72; + background-color: #e46e66; } button.destructive-action.flat { background-color: transparent; - color: #EA4335; + color: #D93025; } @@ -852,7 +866,7 @@ button.destructive-action.flat:disabled { button.destructive-action.flat:checked { - background-color: rgba(234, 67, 53, 0.3); + background-color: rgba(217, 48, 37, 0.3); } .stack-switcher > @@ -882,7 +896,7 @@ button { button.image-button, .inline-toolbar button:not(.text-button), check, -radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked > button.disclosure-button:not(.suggested-action):not(.destructive-action), .nautilus-window headerbar revealer > button, .raven .expander-button, +radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked:not(.vertical) > button.disclosure-button:not(.suggested-action):not(.destructive-action):not(:only-child), .nautilus-window headerbar revealer > button, .raven .expander-button, button.close, button.circular { border-radius: 9999px; @@ -928,31 +942,31 @@ spinbutton:not(.vertical) button, notebook > header tab button.flat, button.side border-bottom-right-radius: 0; } -.linked:not(.vertical) > button.image-button:first-child { +.linked:not(.vertical) > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-bottom-left-radius: 2px; } -.linked:not(.vertical) > button.image-button:last-child { +.linked:not(.vertical) > button.image-button:last-child:not(.text-button) { border-top-right-radius: 2px; border-bottom-right-radius: 2px; } -.linked:not(.vertical) > button.image-button:only-child { +.linked:not(.vertical) > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } -.linked.vertical > button.image-button:first-child { +.linked.vertical > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-top-right-radius: 2px; } -.linked.vertical > button.image-button:last-child { +.linked.vertical > button.image-button:last-child:not(.text-button) { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } -.linked.vertical > button.image-button:only-child { +.linked.vertical > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } @@ -984,7 +998,7 @@ button.color { *********/ *:link, button.link:link, button.link:link:focus, button.link:link:hover, button.link:link:drop(active), button.link:link:active { - color: #4285F4; + color: #1A73E8; } *:visited, button.link:visited, button.link:visited:focus, button.link:visited:hover, @@ -1018,7 +1032,7 @@ spinbutton:not(.vertical) button { spinbutton:not(.vertical) button:focus:not(:hover):not(:active):not(:disabled) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) { @@ -1047,7 +1061,7 @@ spinbutton.vertical button { spinbutton.vertical button:focus:not(:hover):not(:active) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical button.up { @@ -1134,7 +1148,7 @@ button.combo:only-child { border-radius: 2px 2px 0 0; font-weight: normal; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -1150,7 +1164,7 @@ button.combo:only-child:drop(active) { } button.combo:only-child:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } button.combo:only-child:disabled { @@ -1176,12 +1190,12 @@ toolbar.osd, .app-notification, frame.documents-dropdown { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown { @@ -1259,8 +1273,8 @@ searchbar > revealer > box { .titlebar { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - 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.1); - background-color: #383838; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #353535; color: white; } @@ -1269,7 +1283,7 @@ searchbar > revealer > box { } .titlebar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1349,13 +1363,13 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar 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; background-color: transparent; color: white; } -.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 button:not(.suggested-action):not(.destructive-action):checked:disabled { +.path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; color: rgba(255, 255, 255, 0.5); } @@ -1373,11 +1387,11 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked { +.path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { +.path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1399,8 +1413,8 @@ searchbar > revealer > box { .titlebar.selection-mode { transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); animation: ripple-on-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; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.2); + background-color: #1A73E8; color: white; } @@ -1461,7 +1475,7 @@ searchbar > revealer > box { .titlebar .selection-mode { box-shadow: inset 0 1px rgba(255, 255, 255, 0.2); - background-color: #4285F4; + background-color: #1A73E8; } .tiled .titlebar, @@ -1472,7 +1486,7 @@ searchbar > revealer > box { .maximized .titlebar, .fullscreen .titlebar { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .titlebar.default-decoration { @@ -1500,7 +1514,7 @@ searchbar > revealer > box { .solid-csd .titlebar:dir(rtl), .solid-csd .titlebar:dir(ltr) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } headerbar { @@ -1540,41 +1554,41 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta * Pathbars * ************/ .caja-pathbar button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { padding-left: 4px; padding-right: 4px; - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 2px; } .caja-pathbar button:checked, -.path-bar button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; +.path-bar.linked:not(.vertical) > button:checked { + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } .caja-pathbar button:checked, .caja-pathbar button:checked:disabled, -.path-bar button:checked, -.path-bar button:checked:disabled { +.path-bar.linked:not(.vertical) > button:checked, +.path-bar.linked:not(.vertical) > button:checked:disabled { background-color: transparent; } .caja-pathbar button label:not(:only-child):first-child, -.path-bar button label:not(:only-child):first-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):first-child { margin-left: 0; } .caja-pathbar button label:not(:only-child):last-child, -.path-bar button label:not(:only-child):last-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):last-child { margin-right: 0; } .caja-pathbar button.text-button, -.path-bar button.text-button { +.path-bar.linked:not(.vertical) > button.text-button { min-width: 0; } .caja-pathbar button.slider-button, -.path-bar button.slider-button { +.path-bar.linked:not(.vertical) > button.slider-button { padding-left: 4px; padding-right: 4px; } @@ -1598,7 +1612,7 @@ treeview.view { treeview.view:selected { background-color: #FFFFFF; - background-image: image(rgba(66, 133, 244, 0.24)); + background-image: image(rgba(26, 115, 232, 0.24)); } treeview.view:hover, treeview.view:selected { @@ -1627,7 +1641,7 @@ treeview.view:drop(active).before { treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view.expander:dir(rtl) { @@ -1647,7 +1661,7 @@ treeview.view.expander:disabled { } treeview.view.progressbar { - border-bottom: 4px solid #4285F4; + border-bottom: 4px solid #1A73E8; box-shadow: none; background-color: transparent; background-image: none; @@ -1678,7 +1692,7 @@ treeview.view header button { } treeview.view header button:not(:focus):not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view header button, treeview.view header button:disabled { @@ -1699,11 +1713,11 @@ treeview.view header.button.dnd { box-shadow: none; background-color: #FFFFFF; background-clip: border-box; - color: #4285F4; + color: #1A73E8; } treeview.view acceleditor > label { - background-color: #4285F4; + background-color: #1A73E8; } /********* @@ -1713,13 +1727,13 @@ menubar, .menubar { -GtkWidget-window-dragging: true; padding: 0; - background-color: #383838; + background-color: #353535; color: white; } menubar:backdrop, .menubar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1835,7 +1849,7 @@ menu > arrow, min-width: 16px; padding: 4px; background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu > arrow.top, @@ -1879,7 +1893,7 @@ menu separator, } menuitem accelerator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menuitem:disabled accelerator { @@ -1892,12 +1906,12 @@ menuitem:disabled accelerator { popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } popover.background:backdrop { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); } popover.background, .csd popover.background { @@ -1953,7 +1967,7 @@ notebook.frame > header { } notebook:focus tab:checked { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.12); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.12); } notebook > header { @@ -1976,7 +1990,7 @@ notebook > header.top > tabs > tab { } notebook > header.top > tabs > tab:checked { - border-image-source: linear-gradient(to top, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to top, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.top > tabs > tab.reorderable-page { @@ -1996,7 +2010,7 @@ notebook > header.bottom > tabs > tab { } notebook > header.bottom > tabs > tab:checked { - border-image-source: linear-gradient(to bottom, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to bottom, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.bottom > tabs > tab.reorderable-page { @@ -2016,7 +2030,7 @@ notebook > header.left > tabs > tab { } notebook > header.left > tabs > tab:checked { - border-image-source: linear-gradient(to left, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to left, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.left > tabs > tab.reorderable-page { @@ -2036,7 +2050,7 @@ notebook > header.right > tabs > tab { } notebook > header.right > tabs > tab:checked { - border-image-source: linear-gradient(to right, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to right, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.right > tabs > tab.reorderable-page { @@ -2103,12 +2117,12 @@ notebook > header tab { border-width: 1px; border-color: transparent; outline: none; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; background-clip: border-box; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -2199,7 +2213,6 @@ notebook > stack:not(:only-child) { scrollbar { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); background-color: #FFFFFF; - background-clip: padding-box; } * { @@ -2234,7 +2247,7 @@ scrollbar slider { } scrollbar slider:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } scrollbar slider:active { @@ -2355,7 +2368,7 @@ switch { } switch:checked { - background-color: rgba(66, 133, 244, 0.5); + background-color: rgba(26, 115, 232, 0.5); } switch:disabled { @@ -2374,25 +2387,25 @@ switch slider { 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); + box-shadow: 0 0 0 10px transparent, 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; } switch:focus slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:focus:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:checked slider { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } /************************* @@ -2407,13 +2420,13 @@ switch:checked slider { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list):hover, .view.content-view.check:not(list):active, .content-view .tile check:not(list):hover, .content-view .tile check:not(list):active { - -gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + -gtk-icon-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 3px rgba(0, 0, 0, 0.14), 0 1px 6px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list), @@ -2452,7 +2465,7 @@ radio { check:checked, check:indeterminate, radio:checked, radio:indeterminate { - color: #4285F4; + color: #1A73E8; } check:checked:disabled, check:indeterminate:disabled, @@ -2475,7 +2488,7 @@ radio:disabled { popover modelbutton.flat check:not(:checked):not(:indeterminate):not(:disabled), popover modelbutton.flat radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover modelbutton.flat check.left:dir(rtl), popover modelbutton.flat @@ -2509,7 +2522,7 @@ radio:dir(rtl) { menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem @@ -2548,12 +2561,12 @@ radio:indeterminate { radio { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } radio:checked:not(:indeterminate) { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#1A73E8), to(transparent)); } @@ -2561,7 +2574,7 @@ radio:checked:not(:indeterminate):disabled { border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(0, 0, 0, 0.26)), to(transparent)); } -window.background:not(.csd) > widget > checkbutton > check, +#MozillaGtkWidget > widget > checkbutton > check, menu menuitem check { min-height: 16px; min-width: 16px; @@ -2569,17 +2582,17 @@ menu menuitem check { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:checked, +#MozillaGtkWidget > widget > checkbutton > check:checked, menu menuitem check:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:indeterminate, +#MozillaGtkWidget > widget > checkbutton > check:indeterminate, menu menuitem check:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio, +#MozillaGtkWidget > widget > radiobutton > radio, menu menuitem radio { min-height: 16px; min-width: 16px; @@ -2587,12 +2600,12 @@ menu menuitem radio { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:checked, +#MozillaGtkWidget > widget > radiobutton > radio:checked, menu menuitem radio:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:indeterminate, +#MozillaGtkWidget > widget > radiobutton > radio:indeterminate, menu menuitem radio:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")); } @@ -2611,7 +2624,7 @@ treeview.view radio:selected { treeview.view check, treeview.view radio { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view check:hover, treeview.view check:active, @@ -2628,7 +2641,7 @@ treeview.view radio:disabled { treeview.view check:checked, treeview.view check:indeterminate, treeview.view radio:checked, treeview.view radio:indeterminate { - color: #4285F4; + color: #1A73E8; } treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled, @@ -2692,7 +2705,7 @@ scale trough:disabled { scale highlight { transition: background-image 75ms cubic-bezier(0, 0, 0.2, 1); - background-image: image(#4285F4); + background-image: image(#1A73E8); } scale highlight:disabled { @@ -2715,7 +2728,7 @@ scale slider { background-position: center; background-size: auto, 1000% 1000%; border-radius: 50%; - color: #4285F4; + color: #1A73E8; } scale slider { @@ -2748,7 +2761,7 @@ scale slider:active { scale marks, scale value { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } scale indicator { @@ -2890,7 +2903,7 @@ scale.color.vertical:dir(rtl) slider { * Progress bars * *****************/ progressbar { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } @@ -2909,7 +2922,7 @@ progressbar trough { } progressbar progress { - background-color: #4285F4; + background-color: #1A73E8; } progressbar trough.empty progress { @@ -2944,15 +2957,15 @@ levelbar.vertical.discrete block:not(:last-child) { } levelbar block.low { - background-color: #FBBC05; + background-color: #F4B400; } levelbar block.high, levelbar block:not(.empty) { - background-color: #4285F4; + background-color: #1A73E8; } levelbar block.full { - background-color: #34A853; + background-color: #0F9D58; } levelbar block.empty { @@ -3007,7 +3020,7 @@ scrolledwindow viewport.frame { } overshoot.top { - background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center top; background-color: transparent; @@ -3016,7 +3029,7 @@ overshoot.top { } overshoot.bottom { - background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center bottom; background-color: transparent; @@ -3025,7 +3038,7 @@ overshoot.bottom { } overshoot.left { - background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: left center; background-color: transparent; @@ -3034,7 +3047,7 @@ overshoot.left { } overshoot.right { - background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: right center; background-color: transparent; @@ -3044,7 +3057,7 @@ overshoot.right { undershoot.top { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-top: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3054,7 +3067,7 @@ undershoot.top { undershoot.bottom { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-bottom: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3064,7 +3077,7 @@ undershoot.bottom { undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3074,7 +3087,7 @@ undershoot.left { undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3135,7 +3148,8 @@ row.activatable:focus, treeview.view header button:focus, .budgie-popover.budgie } row.activatable:hover, treeview.view header button:hover, -treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), +treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu popover.background.menu button:not(.image-button):drop(active), popover.background.menu .budgie-popover.budgie-menu button:not(.image-button):drop(active), +.budgie-popover.budgie-menu popover.background button.model:not(.image-button):drop(active), popover.background .budgie-popover.budgie-menu button.model:not(.image-button):drop(active), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.info button:not(.image-button):drop(active), infobar.info .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.question button:not(.image-button):drop(active), infobar.question .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lock-dialog button:not(.image-button):drop(active), .lock-dialog .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lightdm-gtk-greeter button:not(.image-button):drop(active), .lightdm-gtk-greeter .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu button.flat:not(.image-button):drop(active) { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 0ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -3150,7 +3164,7 @@ row.activatable.has-open-popup, treeview.view header button.has-open-popup, .bud } row:selected { - color: #4285F4; + color: #1A73E8; } row:selected image, @@ -3175,6 +3189,10 @@ row:selected:disabled label { margin: 8px; } +.app-notification button.text-button:not(:disabled) { + color: #1A73E8; +} + .app-notification.frame, .app-notification border { border-style: none; @@ -3189,7 +3207,7 @@ expander title > arrow { min-height: 16px; -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } expander title > arrow:dir(rtl) { @@ -3232,7 +3250,7 @@ calendar.header { } calendar.highlight { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -3257,7 +3275,7 @@ messagedialog .titlebar { messagedialog .titlebar:backdrop { background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } messagedialog.csd.background { @@ -3275,11 +3293,11 @@ messagedialog.csd .dialog-action-box button:not(:last-child) { } messagedialog.csd .dialog-action-box button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } messagedialog.csd .dialog-action-box button.destructive-action:not(:disabled) { - color: #EA4335; + color: #D93025; } filechooser .dialog-action-box { @@ -3330,6 +3348,7 @@ stacksidebar.sidebar row { stacksidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } @@ -3351,7 +3370,12 @@ separator.sidebar { * File chooser * ****************/ row image.sidebar-icon { - color: rgba(0, 0, 0, 0.54); + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); + color: rgba(0, 0, 0, 0.6); +} + +row image.sidebar-icon:disabled { + color: rgba(0, 0, 0, 0.26); } placessidebar.sidebar > viewport.frame { @@ -3375,9 +3399,14 @@ placessidebar.sidebar row > revealer { placessidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } +placessidebar.sidebar row:selected image.sidebar-icon { + color: #1A73E8; +} + placessidebar.sidebar row:disabled { color: rgba(0, 0, 0, 0.38); } @@ -3390,6 +3419,10 @@ placessidebar.sidebar row image.sidebar-icon:dir(rtl) { padding-left: 8px; } +placessidebar.sidebar row label.sidebar-label { + color: inherit; +} + placessidebar.sidebar row label.sidebar-label:dir(ltr) { padding-right: 2px; } @@ -3398,17 +3431,16 @@ placessidebar.sidebar row label.sidebar-label:dir(rtl) { padding-left: 2px; } -placessidebar.sidebar row:selected image.sidebar-icon, -placessidebar.sidebar row:selected label.sidebar-label { - color: inherit; -} - placessidebar.sidebar row.sidebar-placeholder-row { background-color: alpha(currentColor, 0.08); } placessidebar.sidebar row.sidebar-new-bookmark-row { - color: #4285F4; + color: #1A73E8; +} + +placessidebar.sidebar row.sidebar-new-bookmark-row image.sidebar-icon { + color: #1A73E8; } placesview .server-list-button > image { @@ -3495,17 +3527,12 @@ infobar.info, infobar.question { background-color: #FFFFFF; } -infobar.info button.text-button, infobar.question button.text-button { - padding-left: 8px; - padding-right: 8px; -} - infobar.info button.text-button:not(:disabled), infobar.question button.text-button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } infobar.warning { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -3514,7 +3541,7 @@ infobar.warning *:link, infobar.warning button.link:link { } infobar.error { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -3598,15 +3625,15 @@ colorswatch.light { colorswatch overlay { transition: box-shadow 75ms 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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } colorswatch overlay:hover { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch overlay:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch#add-color-button { @@ -3641,12 +3668,12 @@ colorswatch#editor-color-sample overlay { colorchooser .popover.osd { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } colorchooser .popover.osd:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } /******** @@ -3662,12 +3689,12 @@ colorchooser .popover.osd:backdrop { decoration { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; margin: 8px; } decoration:backdrop { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; } .maximized decoration, @@ -3690,7 +3717,7 @@ decoration:backdrop { .csd.popup decoration { border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } tooltip.csd decoration { @@ -3706,13 +3733,13 @@ messagedialog.csd decoration { margin: 0; border-radius: 0; box-shadow: none; - background-color: #383838; + background-color: #353535; } .view selection, .view:selected, flowbox flowboxchild:selected, label selection, spinbutton:not(.vertical) selection, entry selection, modelbutton.flat:selected, .menuitem.button.flat:selected, row:selected, calendar:selected, .nautilus-window flowboxchild:selected .icon-item-background, box.vertical > widget > widget:selected, .budgie-popover.budgie-menu button.flat:not(.image-button):checked, calendar.raven-calendar:selected, XfdesktopIconView.view:active, .nemo-window .nemo-window-pane widget.entry:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); } .monospace { @@ -3723,7 +3750,7 @@ entry selection, modelbutton.flat:selected, * Touch Copy & Paste * **********************/ cursor-handle { - color: #4285F4; + color: #1A73E8; -gtk-icon-source: -gtk-recolor(url("assets/scalable/cursor-handle-symbolic.svg")); } @@ -3760,7 +3787,7 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) } :not(decoration):not(window):drop(active) { - caret-color: #4285F4; + caret-color: #1A73E8; } stackswitcher button.text-button { @@ -3801,7 +3828,7 @@ button.emoji-section { } button.emoji-section:checked { - color: #4285F4; + color: #1A73E8; } button.emoji-section:not(:last-child) { @@ -3852,12 +3879,12 @@ popover.emoji-completion .emoji:hover { .nautilus-canvas-item.dim-label, .nautilus-list-dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-desktop.nautilus-canvas-item, .caja-desktop.caja-canvas-item, .nemo-desktop.nemo-canvas-item { color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } @keyframes nautilus-operations-button-needs-attention { @@ -3901,20 +3928,24 @@ popover.emoji-completion .emoji:hover { margin-right: 0; } -.path-bar-box .nautilus-path-bar button { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: 4px; padding-right: 4px; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 0; +} + +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):first-child { margin-left: 0; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):last-child { margin-right: 0; } -.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button.image-button image:not(:only-child) { margin: 0; } @@ -3926,7 +3957,6 @@ popover.emoji-completion .emoji:hover { border-color: rgba(0, 0, 0, 0.12); border-radius: 3px 3px 0 0; background-color: rgba(255, 255, 255, 0.9); - background-clip: padding-box; } .nautilus-window .floating-bar.bottom.left { @@ -3951,8 +3981,8 @@ popover.emoji-completion .emoji:hover { } .disk-space-display.used { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } .disk-space-display.free { @@ -3968,7 +3998,7 @@ popover.emoji-completion .emoji:hover { } .conflict-row:not(:selected) { - background-color: #feebb4; + background-color: #fce9b3; } .nautilus-window flowboxchild .icon-item-background { @@ -4023,23 +4053,23 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .nautilus-menu-sort-heading:disabled { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-window paned > separator { - background-color: #F2F2F2; + background-color: #FAFAFA; } /********* * gedit * *********/ .open-document-selector-path-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } .open-document-selector-match { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -4070,7 +4100,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: .gedit-search-slider .linked:not(.vertical) > entry .gedit-search-entry-occurrences-tag { all: unset; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .gedit-search-slider .linked:not(.vertical) > entry:dir(ltr) { @@ -4220,7 +4250,7 @@ layouttab { border-style: none solid; border-width: 1px; border-color: rgba(0, 0, 0, 0.12); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: #FFFFFF; } @@ -4240,12 +4270,12 @@ layout { } entry.search-missing { - background-color: #EA4335; + background-color: #D93025; color: white; } window.workbench treeview.image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.popover-selector list { @@ -4277,7 +4307,7 @@ omnibar.linked:not(.vertical) entry { } omnibar:not(:hover):not(:active) entry { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.omnibar list row:not(:last-child) { @@ -4370,11 +4400,11 @@ docktab { border-width: 1px; border-color: transparent; box-shadow: inset 0 -2px transparent; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -4385,7 +4415,7 @@ docktab:hover { docktab:checked { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 225ms cubic-bezier(0, 0, 0.2, 1), background-image 525ms cubic-bezier(0, 0, 0.2, 1); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-size: 1000% 1000%; @@ -4402,11 +4432,11 @@ dockoverlayedge docktabstrip { } dockoverlayedge.left-edge docktab:checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } dockoverlayedge.right-edge docktab:checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } pillbox { @@ -4490,7 +4520,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button { } ideeditorutilities > dzldockpaned > box > stackswitcher button:active { - background-image: radial-gradient(circle, rgba(66, 133, 244, 0.7) 10%, transparent 0%); + background-image: radial-gradient(circle, rgba(26, 115, 232, 0.7) 10%, transparent 0%); } ideeditorutilities > dzldockpaned > box > stackswitcher button:checked { @@ -4503,7 +4533,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { @@ -4511,7 +4541,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } ideeditorsidebar notebook header { @@ -4536,8 +4566,8 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: 9999px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #4285F4; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #1A73E8; color: white; font-weight: bold; } @@ -4566,13 +4596,13 @@ button.photos-filter-preview { } button.photos-filter-preview:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); 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); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { @@ -4605,11 +4635,11 @@ overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) { } .side-panel .view:selected { - background-image: image(#4285F4); + background-image: image(#1A73E8); } .side-panel .view:selected:hover { - background-image: image(#518ff5); + background-image: image(#2c7eea); } .songs-list:hover { @@ -4735,7 +4765,7 @@ list.categories { min-height: 24px; padding: 0 4px; border-radius: 2px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -4773,7 +4803,7 @@ button.title label { overlay > revealer.left > scrolledwindow.frame, overlay > revealer.right > scrolledwindow.frame { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } overlay > revealer.left > scrolledwindow.frame { @@ -4797,6 +4827,15 @@ button.image-button.session-new-button { min-width: 28px; } +notebook.tilix-background tab > box > stack { + margin: -6px; +} + +button.flat.tilix-small-button { + min-height: 16px; + min-width: 12px; +} + /************** * Terminator * **************/ @@ -4836,37 +4875,46 @@ window.background > box.vertical > scrolledwindow > widget toolbar button { * Chromium * ************/ window.background.chromium { - background-color: #F2F2F2; + background-color: #FFFFFF; } window.background.chromium entry, -window.background.chromium > button:not(.suggested-action):not(.destructive-action) { +window.background.chromium > button { border: 1px solid rgba(0, 0, 0, 0.26); } window.background.chromium > button { - box-shadow: none; - background-size: auto; + color: #1A73E8; } -window.background.chromium > button:hover, -window.background.chromium > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +window.background.chromium > button:disabled { + color: rgba(0, 0, 0, 0.26); } -window.background.chromium > button:active { - background-image: image(alpha(currentColor, 0.12)); +window.background.chromium menubar, +window.background.chromium headerbar { + color: rgba(255, 255, 255, 0.7); } window.background.chromium headerbar button:active { - background-size: 1000% 1000%; + background-color: alpha(currentColor, 0.12); } window.background.chromium spinner { - color: #4285F4; + color: #1A73E8; +} + +window.background.chromium textview.view { + background-color: transparent; +} + +window.background.chromium treeview.view.cell:selected:focus { + background-color: #1A73E8; + color: white; } -window.background.chromium textview { +window.background.chromium treeview.view button { + border: 1px solid rgba(0, 0, 0, 0.26); background-color: #FFFFFF; } @@ -4877,103 +4925,106 @@ tooltip.background.chromium { /*********** * Firefox * ***********/ -window.background:not(.csd) > widget > separator { - color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget text { + background-color: #FFFFFF; } -window.background:not(.csd) > widget > scrollbar { - background-clip: border-box; +#MozillaGtkWidget > widget text:selected { + background-color: #1A73E8; + color: white; +} + +#MozillaGtkWidget > widget > separator { + color: rgba(0, 0, 0, 0.12); } -window.background:not(.csd) > widget > scrollbar, -window.background:not(.csd) > widget > frame > border { +#MozillaGtkWidget > widget > frame > border { border-color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > entry, -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > entry, +#MozillaGtkWidget > widget > button > button { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 2px; box-shadow: none; } -window.background:not(.csd) > widget > entry { +#MozillaGtkWidget > widget > entry:disabled, +#MozillaGtkWidget > widget > button > button:disabled { + border-color: rgba(0, 0, 0, 0.12); +} + +#MozillaGtkWidget > widget > entry { min-height: 30px; background-color: #FFFFFF; } -window.background:not(.csd) > widget > entry:focus { - border-color: #4285F4; - box-shadow: inset 0 0 0 1px #4285F4; +#MozillaGtkWidget > widget > entry:focus { + border-color: #1A73E8; + box-shadow: inset 0 0 0 1px #1A73E8; } -window.background:not(.csd) > widget > entry:disabled { +#MozillaGtkWidget > widget > entry:disabled { background-color: #FAFAFA; } -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > button > button { padding: 4px 8px; background-size: auto; } -window.background:not(.csd) > widget > button > button:hover, -window.background:not(.csd) > widget > button > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +#MozillaGtkWidget > widget > button > button:hover, +#MozillaGtkWidget > widget > button > button:drop(active) { + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); } -window.background:not(.csd) > widget > button > button:active { +#MozillaGtkWidget > widget > button > button:active { background-image: image(alpha(currentColor, 0.12)); } -window.background:not(.csd) > widget > checkbutton > check:not(:checked), -window.background:not(.csd) > widget > radiobutton > radio:not(:checked) { +#MozillaGtkWidget > widget > checkbutton > check, +#MozillaGtkWidget > widget > radiobutton > radio { + margin: 0; + padding: 0; +} + +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate), +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate) { color: #757575; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):hover, #MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):active, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):hover, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):active { color: #212121; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):disabled, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):disabled { color: rgba(117, 117, 117, 0.5); } -window.background:not(.csd) > window > menu, -window.background:not(.csd) > menu > menu { +#MozillaGtkWidget menu { border: none; } -text:selected { - background-color: #4285F4; - color: white; -} - -window.background:not(.csd) > widget > menubar { +#MozillaGtkWidget > widget > menubar { color: rgba(255, 255, 255, 0.7); } -window.background:not(.csd) > widget > menubar:hover { +#MozillaGtkWidget > widget > menubar:hover { color: white; } -window.background:not(.csd) > widget > menubar:disabled { +#MozillaGtkWidget > widget > menubar:disabled { color: rgba(255, 255, 255, 0.3); } -window.background:not(.csd) > widget > frame { +#MozillaGtkWidget > widget > frame { color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > checkbutton > check, -window.background:not(.csd) > widget > radiobutton > radio { - margin: 0; - padding: 0; -} - -window.background:not(.csd) > window.background > menu > separator { +#MozillaGtkWidget menu > separator { color: rgba(0, 0, 0, 0.12); } @@ -5069,7 +5120,7 @@ UnityDecoration { -UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32); -UnityDecoration-inactive-shadow-radius: 6px; -UnityDecoration-glow-size: 8px; - -UnityDecoration-glow-color: #4285F4; + -UnityDecoration-glow-color: #1A73E8; -UnityDecoration-title-indent: 4px; -UnityDecoration-title-fade: 32px; -UnityDecoration-title-alignment: 0.0; @@ -5080,12 +5131,12 @@ UnityDecoration .top { border-style: none; border-radius: 2px 2px 0 0; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #383838; + background-color: #353535; color: white; } UnityDecoration .top:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -5101,7 +5152,7 @@ UnityDecoration .menuitem:hover { .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .background:not(.csd) headerbar:not(.titlebar).inline-toolbar { @@ -5110,7 +5161,7 @@ UnityDecoration .menuitem:hover { UnityPanelWidget, .unity-panel { - background-color: #d6d6d6; + background-color: #1F1F1F; color: white; } @@ -5134,7 +5185,7 @@ UnityPanelWidget:backdrop, .menu IdoPlaybackMenuItem.menuitem:active { -gtk-icon-source: -gtk-icontheme("process-working-symbolic"); animation: spin 1s linear infinite; - color: #4285F4; + color: #1A73E8; } /************** @@ -5146,7 +5197,7 @@ UnityPanelWidget:backdrop, } .mate-panel-menu-bar { - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -5256,7 +5307,7 @@ PanelApplet.wnck-applet .wnck-pager:active { } PanelApplet.wnck-applet .wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } .mate-panel-menu-bar.horizontal #clock-applet-button label { @@ -5352,7 +5403,7 @@ na-tray-applet { #mate-menu button image, #mate-menu button label + label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } #mate-menu entry { @@ -5400,7 +5451,7 @@ na-tray-applet { } .brisk-menu .categories-list button:checked { - color: #4285F4; + color: #1A73E8; } .brisk-menu .session-button { @@ -5441,6 +5492,10 @@ na-tray-applet { margin: 0 -1px 0 -2px; } +.caja-pathbar button.slider-button { + min-width: 24px; +} + .caja-pathbar button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -GtkArrow-arrow-scaling: 1; @@ -5461,6 +5516,35 @@ na-tray-applet { border-style: none; } +.caja-canvas-item { + border-radius: 2px; +} + +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.04); + background-image: none; + color: rgba(0, 0, 0, 0.87); +} + +.caja-desktop.view .entry:selected, +.caja-navigation-window .view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + +.caja-desktop.view .entry { + background-color: rgba(0, 0, 0, 0.3); + color: white; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); + caret-color: currentColor; +} + +.caja-desktop.view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + .caja-navigation-window statusbar { margin: 0 -10px; padding: 0 4px; @@ -5539,7 +5623,7 @@ na-tray-applet { .lock-dialog { border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 3px; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -5547,6 +5631,10 @@ na-tray-applet { border-style: none; } +.lock-dialog button:not(:disabled) { + color: #1A73E8; +} + /* multimedia OSD */ MsdOsdWindow.background.osd { border-radius: 2px; @@ -5561,7 +5649,7 @@ MsdOsdWindow.background.osd .trough { MsdOsdWindow.background.osd .progressbar { border-radius: 0; - background-color: #4285F4; + background-color: #1A73E8; } /****************** @@ -5584,7 +5672,7 @@ MsdOsdWindow.background.osd .progressbar { border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: 3px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } @@ -5780,13 +5868,13 @@ MsdOsdWindow.background.osd .progressbar { .budgie-panel { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } .budgie-panel.transparent { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .budgie-panel button { @@ -5809,7 +5897,7 @@ MsdOsdWindow.background.osd .progressbar { } .budgie-panel .alert { - color: #EA4335; + color: #D93025; } .budgie-panel .titlebar:not(headerbar) { @@ -5845,7 +5933,8 @@ MsdOsdWindow.background.osd .progressbar { color: rgba(255, 255, 255, 0.5); } -.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel popover.background.menu button.launcher:not(:checked):drop(active), popover.background.menu .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel popover.background button.launcher.model:not(:checked):drop(active), popover.background .budgie-panel button.launcher.model:not(:checked):drop(active), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel infobar.info button.launcher:not(:checked):drop(active), infobar.info .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel infobar.question button.launcher:not(:checked):drop(active), infobar.question .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lock-dialog button.launcher:not(:checked):drop(active), .lock-dialog .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lightdm-gtk-greeter button.launcher:not(:checked):drop(active), .lightdm-gtk-greeter .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):active { color: rgba(255, 255, 255, 0.7); } @@ -5892,7 +5981,7 @@ MsdOsdWindow.background.osd .progressbar { frame.raven-frame > border { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } .top frame.raven-frame > border { @@ -5920,12 +6009,12 @@ frame.raven-frame > border { } .raven stackswitcher.linked > button { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 0; } .raven stackswitcher.linked > button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; background-color: transparent; } @@ -5991,7 +6080,7 @@ calendar.raven-calendar:selected { } .raven-mpris { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -6012,7 +6101,7 @@ calendar.raven-calendar:selected { } .budgie-notification .notification-body, .budgie-switcher .notification-body { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-osd .budgie-osd-text { @@ -6023,7 +6112,7 @@ calendar.raven-calendar:selected { margin: 5px 9px; padding: 3px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6061,11 +6150,11 @@ calendar.raven-calendar:selected { } .budgie-polkit-dialog .message { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-polkit-dialog .failure { - color: #EA4335; + color: #D93025; } .budgie-run-dialog { @@ -6100,7 +6189,7 @@ calendar.raven-calendar:selected { ***************/ .xfce4-panel.background { border: none; - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -6133,14 +6222,14 @@ wnck-pager:active { } wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } XfdesktopIconView.view { border-radius: 2px; background-color: transparent; color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } XfdesktopIconView.view:active { @@ -6191,7 +6280,7 @@ XfdesktopIconView.view .rubberband { * LightDM GTK+ Greeter * ************************/ #panel_window { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; } @@ -6225,7 +6314,7 @@ XfdesktopIconView.view .rubberband { #restart_dialog { margin: 8px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6233,6 +6322,10 @@ XfdesktopIconView.view .rubberband { padding-bottom: 16px; } +.lightdm-gtk-greeter button:not(:disabled) { + color: #1A73E8; +} + #buttonbox_frame { padding-top: 24px; } @@ -6286,7 +6379,7 @@ XfdesktopIconView.view .rubberband { .places-treeview { -NemoPlacesTreeView-disk-full-bg-color: rgba(182, 182, 182, 0.961); - -NemoPlacesTreeView-disk-full-fg-color: #4285F4; + -NemoPlacesTreeView-disk-full-fg-color: #1A73E8; -NemoPlacesTreeView-disk-full-bar-width: 2px; -NemoPlacesTreeView-disk-full-bar-radius: 0; -NemoPlacesTreeView-disk-full-bottom-padding: 1px; @@ -6310,7 +6403,7 @@ text widgets and the like base background color */ @define-color theme_base_color #FFFFFF; /* base background color of selections */ -@define-color theme_selected_bg_color #4285F4; +@define-color theme_selected_bg_color #1A73E8; /* text/foreground color of selections */ @define-color theme_selected_fg_color white; @@ -6337,7 +6430,7 @@ text widgets and the like base background color on backdrop windows */ @define-color theme_unfocused_base_color #FFFFFF; /* base background color of selections on backdrop windows */ -@define-color theme_unfocused_selected_bg_color #4285F4; +@define-color theme_unfocused_selected_bg_color #1A73E8; /* text/foreground color of selections on backdrop windows */ @define-color theme_unfocused_selected_fg_color white; @@ -6352,18 +6445,18 @@ widgets main borders color on backdrop windows */ @define-color unfocused_borders rgba(0, 0, 0, 0.12); /* these are pretty self explicative */ -@define-color warning_color #FBBC05; -@define-color error_color #EA4335; -@define-color success_color #34A853; +@define-color warning_color #F4B400; +@define-color error_color #D93025; +@define-color success_color #0F9D58; /* these colors are exported for the window manager and shouldn't be used in applications, read if you used those and something break with a version upgrade you're on your own... */ @define-color wm_title white; @define-color wm_unfocused_title rgba(255, 255, 255, 0.7); @define-color wm_highlight rgba(255, 255, 255, 0.1); -@define-color wm_bg #383838; -@define-color wm_unfocused_bg #303030; +@define-color wm_bg #353535; +@define-color wm_unfocused_bg #2C2C2C; /* FIXME this is really an API */ @define-color content_view_bg #FFFFFF; -@define-color placeholder_text_color #757575; +@define-color placeholder_text_color #666666; diff --git a/src/gtk/3.0/gtk-dark-compact.css b/src/gtk/3.0/gtk-dark-compact.css index 002d0235f..d7df7cd73 100644 --- a/src/gtk/3.0/gtk-dark-compact.css +++ b/src/gtk/3.0/gtk-dark-compact.css @@ -22,7 +22,7 @@ * { background-clip: padding-box; -GtkToolButton-icon-spacing: 0; - -GtkTextView-error-underline-color: #EA4335; + -GtkTextView-error-underline-color: #F28B82; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 24; @@ -45,7 +45,7 @@ * Base States * ***************/ .background { - background-color: #282828; + background-color: #212121; color: white; } @@ -60,22 +60,22 @@ } .gtkstyle-fallback { - background-color: #282828; + background-color: #212121; color: white; } .gtkstyle-fallback:hover { - background-color: #1b1b1b; + background-color: #141414; color: white; } .gtkstyle-fallback:active { - background-color: #0f0e0e; + background-color: #080707; color: white; } .gtkstyle-fallback:disabled { - background-color: #282828; + background-color: #212121; color: rgba(255, 255, 255, 0.5); } @@ -85,7 +85,7 @@ } .view { - background-color: #303030; + background-color: #2C2C2C; color: white; } @@ -106,7 +106,7 @@ } textview text { - background-color: #303030; + background-color: #2C2C2C; } textview border { @@ -152,6 +152,12 @@ button label:disabled { color: inherit; } +label.osd { + border-radius: 2px; + background-color: rgba(97, 97, 97, 0.9); + color: white; +} + .dim-label { color: rgba(255, 255, 255, 0.7); } @@ -267,7 +273,7 @@ entry image.right { spinbutton:not(.vertical) undershoot.left, entry undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -278,7 +284,7 @@ entry undershoot.left { spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -289,15 +295,15 @@ entry undershoot.right { spinbutton.error:not(.vertical), entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #EA4335; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F28B82 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #F28B82; background-color: rgba(255, 255, 255, 0.04); color: white; } spinbutton.error:focus:not(.vertical), entry.error:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F28B82 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.error:disabled:not(.vertical), @@ -310,15 +316,15 @@ entry.error:disabled { spinbutton.warning:not(.vertical), entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FBBC05; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FDD633 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FDD633; background-color: rgba(255, 255, 255, 0.04); color: white; } spinbutton.warning:focus:not(.vertical), entry.warning:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FDD633 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.warning:disabled:not(.vertical), @@ -339,22 +345,22 @@ spinbutton.vertical entry, .gedit-search-slider .linked:not(.vertical) > entry { border-radius: 2px; transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #303030; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #3C3C3C; color: white; } spinbutton.vertical entry:focus, .gedit-search-slider .linked:not(.vertical) > entry:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:drop(active), .gedit-search-slider .linked:not(.vertical) > entry:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) > entry:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #2C2C2C; color: rgba(255, 255, 255, 0.5); } @@ -362,55 +368,55 @@ spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) spinbutton.vertical entry.error, .gedit-search-slider .linked:not(.vertical) > entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #EA4335; - color: white; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.error:focus, .gedit-search-slider .linked:not(.vertical) > entry.error:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.error:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #2C2C2C; color: rgba(255, 255, 255, 0.5); } spinbutton.vertical entry.error image, .gedit-search-slider .linked:not(.vertical) > entry.error image { - color: rgba(255, 255, 255, 0.7); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.error image:hover, .gedit-search-slider .linked:not(.vertical) > entry.error image:hover, spinbutton.vertical entry.error image:active, .gedit-search-slider .linked:not(.vertical) > entry.error image:active { - color: white; + color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.error image:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error image:disabled { - color: rgba(255, 255, 255, 0.5); + color: rgba(0, 0, 0, 0.38); } spinbutton.vertical entry.warning, .gedit-search-slider .linked:not(.vertical) > entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #FBBC05; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #FDD633; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.warning:focus, .gedit-search-slider .linked:not(.vertical) > entry.warning:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.warning:disabled, .gedit-search-slider .linked:not(.vertical) > entry.warning:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #2C2C2C; color: rgba(255, 255, 255, 0.5); } spinbutton.vertical entry.warning image, .gedit-search-slider .linked:not(.vertical) > entry.warning image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.warning image:hover, .gedit-search-slider .linked:not(.vertical) > entry.warning image:hover, spinbutton.vertical entry.warning image:active, .gedit-search-slider .linked:not(.vertical) > entry.warning image:active { @@ -422,7 +428,7 @@ spinbutton.vertical entry.warning image:disabled, .gedit-search-slider .linked:n } treeview entry.flat, treeview entry { - background-color: #303030; + background-color: #2C2C2C; } treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus { @@ -486,8 +492,8 @@ button { font-weight: 500; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; - box-shadow: inset 0 0 0 9999px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #424242; + box-shadow: inset 0 0 0 9999px transparent, 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); + background-color: #3C3C3C; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; background-position: center; @@ -497,20 +503,20 @@ button { button:focus { - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:hover, button:drop(active) { - box-shadow: inset 0 0 0 9999px transparent, 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px transparent, 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 5px 3px -3px rgba(0, 0, 0, 0.2), 0 8px 6px 1px rgba(0, 0, 0, 0.14), 0 3px 8.4px 2px rgba(0, 0, 0, 0.12); background-image: radial-gradient(circle, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; } @@ -537,9 +543,9 @@ button:checked:disabled { modelbutton.flat, .menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, notebook > header > tabs > arrow, scrollbar button, check, -radio, calendar.button, button.sidebar-button, infobar.info button, infobar.question button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .lock-dialog button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, -.path-bar button, popover.background.menu button, -popover.background button.model, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, .nemo-window .toolbar button, +radio, calendar.button, button.sidebar-button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, +.path-bar.linked:not(.vertical) > button, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), popover.background.menu button, +popover.background button.model, actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, infobar.info button, infobar.question button, .lock-dialog button, .lightdm-gtk-greeter button, .nemo-window .toolbar button, button.flat { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; @@ -554,9 +560,9 @@ button.flat { modelbutton.flat:focus, .menuitem.button.flat:focus, spinbutton:not(.vertical) button:focus, spinbutton.vertical button:focus, notebook > header > tabs > arrow:focus, scrollbar button:focus, check:focus, -radio:focus, calendar.button:focus, button.sidebar-button:focus, infobar.info button:focus, infobar.question button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .lock-dialog button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, .lightdm-gtk-greeter button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, -.path-bar button:focus, popover.background.menu button:focus, -popover.background button.model:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, .nemo-window .toolbar button:focus, +radio:focus, calendar.button:focus, button.sidebar-button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, +.path-bar.linked:not(.vertical) > button:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), popover.background.menu button:focus, +popover.background button.model:focus, actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, infobar.info button:focus, infobar.question button:focus, .lock-dialog button:focus, .lightdm-gtk-greeter button:focus, .nemo-window .toolbar button:focus, button.flat:focus { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); color: white; @@ -568,44 +574,50 @@ spinbutton:not(.vertical) button:drop(active), spinbutton.vertical button:hover, spinbutton.vertical button:drop(active), notebook > header > tabs > arrow:hover, scrollbar button:hover, scrollbar button:drop(active), check:hover, radio:hover, calendar.button:hover, button.sidebar-button:hover, -button.sidebar-button:drop(active), infobar.info button:hover, -infobar.info button:drop(active), infobar.question button:hover, -infobar.question button:drop(active), .gedit-search-slider .linked > button:hover, +button.sidebar-button:drop(active), .gedit-search-slider .linked > button:hover, .gedit-search-slider .linked > button:drop(active), popover.messagepopover .popover-action-area button:hover, popover.messagepopover .popover-action-area button:drop(active), #MatePanelPopupWindow button:hover, #MatePanelPopupWindow button:drop(active), #mate-menu button:hover, -#mate-menu button:drop(active), .lock-dialog button:hover, -.lock-dialog button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, +#mate-menu button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, .budgie-settings-window buttonbox.inline-toolbar button:drop(active), .drop-shadow button:hover, .drop-shadow button:drop(active), .budgie-session-dialog .linked.horizontal > button:hover, -.budgie-session-dialog .linked.horizontal > button:drop(active), .lightdm-gtk-greeter button:hover, -.lightdm-gtk-greeter button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), +.budgie-session-dialog .linked.horizontal > button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), combobox > .linked:not(.vertical) > button:not(:only-child):drop(active), .caja-pathbar button:hover, .caja-pathbar button:drop(active), -.path-bar button:hover, -.path-bar button:drop(active), popover.background.menu button:hover, -popover.background.menu button:drop(active), -popover.background button.model:hover, -popover.background button.model:drop(active), layouttabbar button:hover, +.path-bar.linked:not(.vertical) > button:hover, +.path-bar.linked:not(.vertical) > button:drop(active), layouttabbar button:hover, layouttabbar button:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven stackswitcher.linked > button:hover, .raven stackswitcher.linked > button:drop(active), .xfce4-panel.background button:hover, .xfce4-panel.background button:drop(active), toolbar button:hover, toolbar button:drop(active), .titlebar button:hover:not(.suggested-action):not(.destructive-action), -.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), +.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), popover.background.menu button:hover, +popover.background.menu button:drop(active), +popover.background button.model:hover, +popover.background button.model:drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):drop(active), .app-notification button:hover, .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:hover, messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:hover, -filechooser #pathbarbox > stack > box > button:drop(active), .nemo-window .toolbar button:hover, +filechooser #pathbarbox > stack > box > button:drop(active), infobar.info button:hover, +infobar.info button:drop(active), infobar.question button:hover, +infobar.question button:drop(active), .lock-dialog button:hover, +.lock-dialog button:drop(active), .lightdm-gtk-greeter button:hover, +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:hover, .nemo-window .toolbar button:drop(active), button.flat:hover, toolbar button:drop(active), .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), +popover.background.menu button:drop(active), +popover.background button.model:drop(active), actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:drop(active), +infobar.info button:drop(active), +infobar.question button:drop(active), +.lock-dialog button:drop(active), +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:drop(active), button.flat:drop(active) { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -614,9 +626,9 @@ button.flat:drop(active) { modelbutton.flat:active, .menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active, -radio:active, calendar.button:active, button.sidebar-button:active, infobar.info button:active, infobar.question button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .lock-dialog button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, -.path-bar button:active, popover.background.menu button:active, -popover.background button.model:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, +radio:active, calendar.button:active, button.sidebar-button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, +.path-bar.linked:not(.vertical) > button:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), popover.background.menu button:active, +popover.background button.model:active, actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, infobar.info button:active, infobar.question button:active, .lock-dialog button:active, .lightdm-gtk-greeter button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; @@ -628,9 +640,9 @@ button.flat:active { modelbutton.flat:disabled, .menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, -radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, infobar.info button:disabled, infobar.question button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .lock-dialog button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, -.path-bar button:disabled, popover.background.menu button:disabled, -popover.background button.model:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, .nemo-window .toolbar button:disabled, +radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, +.path-bar.linked:not(.vertical) > button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:disabled, +popover.background button.model:disabled, actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, infobar.info button:disabled, infobar.question button:disabled, .lock-dialog button:disabled, .lightdm-gtk-greeter button:disabled, .nemo-window .toolbar button:disabled, button.flat:disabled { box-shadow: none; background-color: transparent; @@ -638,16 +650,16 @@ button.flat:disabled { } combobox > .linked:not(.vertical) > button:checked:not(:only-child), .caja-pathbar button:checked, -.path-bar button:checked, popover.background.menu button:checked, -popover.background button.model:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background 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 button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, +.path-bar.linked:not(.vertical) > button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked, +popover.background button.model:checked, actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, infobar.info button:checked, infobar.question button:checked, .lock-dialog button:checked, .lightdm-gtk-greeter button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.12); color: white; } combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), .caja-pathbar button:checked:disabled, -.path-bar button:checked:disabled, popover.background.menu button:checked:disabled, -popover.background button.model:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .xfce4-panel.background 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 button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, +.path-bar.linked:not(.vertical) > 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, .xfce4-panel.background button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked:disabled, +popover.background button.model:checked:disabled, actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, infobar.info button:checked:disabled, infobar.question button:checked:disabled, .lock-dialog button:checked:disabled, .lightdm-gtk-greeter button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: alpha(currentColor, 0.12); color: rgba(255, 255, 255, 0.5); @@ -660,7 +672,8 @@ button.text-button { padding-right: 16px; } -toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, .nemo-window .toolbar button.text-button, +toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), popover.background.menu button.text-button, +popover.background button.text-button.model, actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, infobar.info button.text-button, infobar.question button.text-button, .lock-dialog button.text-button, .lightdm-gtk-greeter button.text-button, .nemo-window .toolbar button.text-button, button.text-button.flat { min-width: 48px; padding-left: 8px; @@ -690,12 +703,12 @@ button.text-button.image-button label:last-child { margin-right: 12px; } -toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, +toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, popover.background.menu button.text-button.image-button label:first-child, popover.background button.text-button.image-button.model label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, infobar.info button.text-button.image-button label:first-child, infobar.question button.text-button.image-button label:first-child, .lock-dialog button.text-button.image-button label:first-child, .lightdm-gtk-greeter button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, button.text-button.image-button.flat label:first-child { margin-left: 8px; } -toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, +toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, popover.background.menu button.text-button.image-button label:last-child, popover.background button.text-button.image-button.model label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, infobar.info button.text-button.image-button label:last-child, infobar.question button.text-button.image-button label:last-child, .lock-dialog button.text-button.image-button label:last-child, .lightdm-gtk-greeter button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, button.text-button.image-button.flat label:last-child { margin-right: 8px; } @@ -705,13 +718,20 @@ button.text-button.image-button image:not(:only-child) { margin: 0 4px; } -toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), +toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child), +popover.background .linked:not(.vertical) > button.model:not(:only-child), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), infobar.info .linked:not(.vertical) > button:not(:only-child), infobar.question .linked:not(.vertical) > button:not(:only-child), .lock-dialog .linked:not(.vertical) > button:not(:only-child), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), toolbar .linked.vertical > button:not(:only-child), .titlebar .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child), +popover.background .linked.vertical > button.model:not(:only-child), actionbar > revealer > box .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > button:not(:only-child), messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child), filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child), +infobar.info .linked.vertical > button:not(:only-child), +infobar.question .linked.vertical > button:not(:only-child), +.lock-dialog .linked.vertical > button:not(:only-child), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child), .nemo-window .toolbar .linked.vertical > button:not(:only-child), .linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > @@ -719,39 +739,33 @@ button.flat:not(:only-child) { border-radius: 2px; } -toolbar .linked:not(.vertical) > button:not(:only-child).image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button, -toolbar .linked.vertical > button:not(:only-child).image-button, -.titlebar .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button, .linked:not(.vertical) > -button.flat:not(:only-child).image-button, +toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +popover.background .linked:not(.vertical) > button.model:not(:only-child).image-button:not(.text-button), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.info .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.question .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lock-dialog .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.titlebar .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child).image-button:not(.text-button), +popover.background .linked.vertical > button.model:not(:only-child).image-button:not(.text-button), +actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +.app-notification .linked.vertical > button:not(:only-child).image-button:not(.text-button), +messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button:not(.text-button), +filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.info .linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.question .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lock-dialog .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), .linked:not(.vertical) > +button.flat:not(:only-child).image-button:not(.text-button), .linked.vertical > -button.flat:not(:only-child).image-button { +button.flat:not(:only-child).image-button:not(.text-button) { border-radius: 9999px; } -toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).text-button.image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).text-button.image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).text-button.image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, -toolbar .linked.vertical > button:not(:only-child).text-button.image-button, -.titlebar .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).text-button.image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).text-button.image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).text-button.image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).text-button.image-button, .linked:not(.vertical) > -button.flat:not(:only-child).text-button.image-button, -.linked.vertical > -button.flat:not(:only-child).text-button.image-button { - border-radius: 2px; -} - infobar.error button.flat, .mate-panel-menu-bar button, .budgie-panel button, .raven-mpris button.image-button, .xfce4-panel.background button { color: rgba(255, 255, 255, 0.7); } -infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), +infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error popover.background.menu button:drop(active), popover.background.menu infobar.error button:drop(active), +infobar.error popover.background button.model:drop(active), popover.background infobar.error button.model:drop(active), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error infobar.info button:drop(active), infobar.info infobar.error button:drop(active), infobar.error infobar.question button:drop(active), infobar.question infobar.error button:drop(active), infobar.error .lock-dialog button:drop(active), .lock-dialog infobar.error button:drop(active), infobar.error .lightdm-gtk-greeter button:drop(active), .lightdm-gtk-greeter infobar.error button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), infobar.error button.flat:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven-mpris button.image-button:hover, @@ -821,8 +835,8 @@ button.suggested-action.flat:checked { button.destructive-action { - background-color: #EA4335; - color: white; + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } @@ -834,13 +848,13 @@ button.destructive-action:disabled { button.destructive-action:checked { - background-color: #f07b72; + background-color: rgba(182, 105, 98, 0.961); } button.destructive-action.flat { background-color: transparent; - color: #EA4335; + color: #F28B82; } @@ -852,7 +866,7 @@ button.destructive-action.flat:disabled { button.destructive-action.flat:checked { - background-color: rgba(234, 67, 53, 0.3); + background-color: rgba(242, 139, 130, 0.3); } .stack-switcher > @@ -882,7 +896,7 @@ button { button.image-button, .inline-toolbar button:not(.text-button), check, -radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked > button.disclosure-button:not(.suggested-action):not(.destructive-action), .nautilus-window headerbar revealer > button, .raven .expander-button, +radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked:not(.vertical) > button.disclosure-button:not(.suggested-action):not(.destructive-action):not(:only-child), .nautilus-window headerbar revealer > button, .raven .expander-button, button.close, button.circular { border-radius: 9999px; @@ -928,31 +942,31 @@ spinbutton:not(.vertical) button, notebook > header tab button.flat, button.side border-bottom-right-radius: 0; } -.linked:not(.vertical) > button.image-button:first-child { +.linked:not(.vertical) > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-bottom-left-radius: 2px; } -.linked:not(.vertical) > button.image-button:last-child { +.linked:not(.vertical) > button.image-button:last-child:not(.text-button) { border-top-right-radius: 2px; border-bottom-right-radius: 2px; } -.linked:not(.vertical) > button.image-button:only-child { +.linked:not(.vertical) > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } -.linked.vertical > button.image-button:first-child { +.linked.vertical > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-top-right-radius: 2px; } -.linked.vertical > button.image-button:last-child { +.linked.vertical > button.image-button:last-child:not(.text-button) { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } -.linked.vertical > button.image-button:only-child { +.linked.vertical > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } @@ -1165,7 +1179,7 @@ button.combo:only-child:disabled { toolbar { -GtkWidget-window-dragging: true; padding: 2px; - background-color: #282828; + background-color: #212121; } .osd toolbar { @@ -1176,12 +1190,12 @@ toolbar.osd, .app-notification, frame.documents-dropdown { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop { - 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.1); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); } toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown { @@ -1244,7 +1258,7 @@ searchbar > revealer > box, border-style: solid; border-width: 0 0 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; background-clip: border-box; } @@ -1259,8 +1273,8 @@ searchbar > revealer > box { .titlebar { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - 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.1); - background-color: #383838; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #353535; color: white; } @@ -1269,7 +1283,7 @@ searchbar > revealer > box { } .titlebar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1349,13 +1363,13 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar 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; background-color: transparent; color: white; } -.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 button:not(.suggested-action):not(.destructive-action):checked:disabled { +.path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; color: rgba(255, 255, 255, 0.5); } @@ -1373,11 +1387,11 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked { +.path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { +.path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1399,13 +1413,13 @@ searchbar > revealer > box { .titlebar.selection-mode { transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); animation: ripple-on-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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #8AB4F8; color: rgba(0, 0, 0, 0.87); } .titlebar.selection-mode:backdrop { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar.selection-mode .subtitle:link { @@ -1431,7 +1445,7 @@ searchbar > revealer > box { } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:disabled { @@ -1439,7 +1453,7 @@ searchbar > revealer > box { } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { @@ -1472,7 +1486,7 @@ searchbar > revealer > box { .maximized .titlebar, .fullscreen .titlebar { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .titlebar.default-decoration { @@ -1500,7 +1514,7 @@ searchbar > revealer > box { .solid-csd .titlebar:dir(rtl), .solid-csd .titlebar:dir(ltr) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } headerbar { @@ -1540,7 +1554,7 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta * Pathbars * ************/ .caja-pathbar button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { padding-left: 4px; padding-right: 4px; border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #8AB4F8 0%, transparent 0%) 0 0 0/0 0 0px; @@ -1548,33 +1562,33 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta } .caja-pathbar button:checked, -.path-bar button:checked { +.path-bar.linked:not(.vertical) > button:checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #8AB4F8 100%, transparent 0%) 0 0 2/0 0 2px; } .caja-pathbar button:checked, .caja-pathbar button:checked:disabled, -.path-bar button:checked, -.path-bar button:checked:disabled { +.path-bar.linked:not(.vertical) > button:checked, +.path-bar.linked:not(.vertical) > button:checked:disabled { background-color: transparent; } .caja-pathbar button label:not(:only-child):first-child, -.path-bar button label:not(:only-child):first-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):first-child { margin-left: 0; } .caja-pathbar button label:not(:only-child):last-child, -.path-bar button label:not(:only-child):last-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):last-child { margin-right: 0; } .caja-pathbar button.text-button, -.path-bar button.text-button { +.path-bar.linked:not(.vertical) > button.text-button { min-width: 0; } .caja-pathbar button.slider-button, -.path-bar button.slider-button { +.path-bar.linked:not(.vertical) > button.slider-button { padding-left: 4px; padding-right: 4px; } @@ -1597,7 +1611,7 @@ treeview.view { } treeview.view:selected { - background-color: #303030; + background-color: #2C2C2C; background-image: image(rgba(138, 180, 248, 0.24)); } @@ -1682,7 +1696,7 @@ treeview.view header button:not(:focus):not(:hover):not(:active) { } treeview.view header button, treeview.view header button:disabled { - background-color: #303030; + background-color: #2C2C2C; } treeview.view header button:last-child { @@ -1697,7 +1711,7 @@ treeview.view header.button.dnd { border-color: rgba(255, 255, 255, 0.12); border-radius: 0; box-shadow: none; - background-color: #303030; + background-color: #2C2C2C; background-clip: border-box; color: #8AB4F8; } @@ -1713,13 +1727,13 @@ menubar, .menubar { -GtkWidget-window-dragging: true; padding: 0; - background-color: #383838; + background-color: #353535; color: white; } menubar:backdrop, .menubar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1763,7 +1777,7 @@ menu, margin: 4px 0; padding: 4px 0; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; border: 1px solid rgba(0, 0, 0, 0.26); } @@ -1834,7 +1848,7 @@ menu > arrow, min-height: 16px; min-width: 16px; padding: 4px; - background-color: #424242; + background-color: #3C3C3C; color: rgba(255, 255, 255, 0.7); } @@ -1892,12 +1906,12 @@ menuitem:disabled accelerator { popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #3C3C3C; } popover.background:backdrop { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); } popover.background, .csd popover.background { @@ -1926,7 +1940,7 @@ popover.background > toolbar { popover.background list, popover.background .view:not(:selected), popover.background toolbar { - background-color: #424242; + background-color: #3C3C3C; } popover.background.menu button, @@ -1959,7 +1973,7 @@ notebook:focus tab:checked { notebook > header { border-width: 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; background-clip: border-box; } @@ -2136,7 +2150,7 @@ notebook > header tab:checked:disabled { notebook > header tab:checked.reorderable-page { border-color: rgba(0, 0, 0, 0.26); - background-color: #303030; + background-color: #2C2C2C; } notebook > header tab > box { @@ -2190,7 +2204,7 @@ notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs t } notebook > stack:not(:only-child) { - background-color: #303030; + background-color: #2C2C2C; } /************** @@ -2198,8 +2212,7 @@ notebook > stack:not(:only-child) { **************/ scrollbar { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; - background-clip: border-box; + background-color: #2C2C2C; } * { @@ -2271,14 +2284,14 @@ scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { min-width: 4px; min-height: 4px; margin: 3px; - border: 1px solid rgba(48, 48, 48, 0.3); + border: 1px solid rgba(44, 44, 44, 0.3); } scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { min-width: 4px; min-height: 4px; margin: 3px; - border: 1px solid rgba(48, 48, 48, 0.3); + border: 1px solid rgba(44, 44, 44, 0.3); border-radius: 9999px; background-color: rgba(255, 255, 255, 0.5); background-clip: padding-box; @@ -2306,7 +2319,7 @@ scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button { } scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { - background-color: rgba(48, 48, 48, 0.9); + background-color: rgba(60, 60, 60, 0.9); } scrollbar.horizontal slider { @@ -2374,20 +2387,20 @@ switch slider { 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; + box-shadow: 0 0 0 10px transparent, 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #3C3C3C; } switch:focus slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:focus:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:checked slider { @@ -2407,13 +2420,13 @@ switch:checked slider { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list):hover, .view.content-view.check:not(list):active, .content-view .tile check:not(list):hover, .content-view .tile check:not(list):active { - -gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + -gtk-icon-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 3px rgba(0, 0, 0, 0.14), 0 1px 6px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list), @@ -2561,7 +2574,7 @@ radio:checked:not(:indeterminate):disabled { border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(255, 255, 255, 0.3)), to(transparent)); } -window.background:not(.csd) > widget > checkbutton > check, +#MozillaGtkWidget > widget > checkbutton > check, menu menuitem check { min-height: 16px; min-width: 16px; @@ -2569,17 +2582,17 @@ menu menuitem check { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:checked, +#MozillaGtkWidget > widget > checkbutton > check:checked, menu menuitem check:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:indeterminate, +#MozillaGtkWidget > widget > checkbutton > check:indeterminate, menu menuitem check:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio, +#MozillaGtkWidget > widget > radiobutton > radio, menu menuitem radio { min-height: 16px; min-width: 16px; @@ -2587,12 +2600,12 @@ menu menuitem radio { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:checked, +#MozillaGtkWidget > widget > radiobutton > radio:checked, menu menuitem radio:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:indeterminate, +#MozillaGtkWidget > widget > radiobutton > radio:indeterminate, menu menuitem radio:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")); } @@ -2696,7 +2709,7 @@ scale highlight { } scale highlight:disabled { - background-color: #282828; + background-color: #212121; background-image: image(rgba(255, 255, 255, 0.3)); } @@ -2944,7 +2957,7 @@ levelbar.vertical.discrete block:not(:last-child) { } levelbar block.low { - background-color: #FBBC05; + background-color: #FDD633; } levelbar block.high, levelbar block:not(.empty) { @@ -2952,7 +2965,7 @@ levelbar block.high, levelbar block:not(.empty) { } levelbar block.full { - background-color: #34A853; + background-color: #81C995; } levelbar block.empty { @@ -2965,7 +2978,7 @@ levelbar block.empty { printdialog paper { padding: 0; border: 1px solid rgba(0, 0, 0, 0.26); - background-color: #303030; + background-color: #2C2C2C; color: white; } @@ -2994,7 +3007,7 @@ frame.flat > border { actionbar > revealer > box { padding: 4px; border-top: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; background-clip: border-box; } @@ -3044,7 +3057,7 @@ overshoot.right { undershoot.top { background-color: transparent; - background-image: linear-gradient(to left, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-top: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3054,7 +3067,7 @@ undershoot.top { undershoot.bottom { background-color: transparent; - background-image: linear-gradient(to left, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-bottom: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3064,7 +3077,7 @@ undershoot.bottom { undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3074,7 +3087,7 @@ undershoot.left { undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3086,7 +3099,7 @@ junction { border-style: solid none none solid; border-width: 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; } junction:dir(rtl) { @@ -3113,7 +3126,7 @@ stacksidebar.sidebar separator.horizontal, .tweak-categories separator, preferen *********/ list { border-color: rgba(0, 0, 0, 0.26); - background-color: #303030; + background-color: #2C2C2C; } list row { @@ -3135,7 +3148,8 @@ row.activatable:focus, treeview.view header button:focus, .budgie-popover.budgie } row.activatable:hover, treeview.view header button:hover, -treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), +treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu popover.background.menu button:not(.image-button):drop(active), popover.background.menu .budgie-popover.budgie-menu button:not(.image-button):drop(active), +.budgie-popover.budgie-menu popover.background button.model:not(.image-button):drop(active), popover.background .budgie-popover.budgie-menu button.model:not(.image-button):drop(active), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.info button:not(.image-button):drop(active), infobar.info .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.question button:not(.image-button):drop(active), infobar.question .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lock-dialog button:not(.image-button):drop(active), .lock-dialog .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lightdm-gtk-greeter button:not(.image-button):drop(active), .lightdm-gtk-greeter .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu button.flat:not(.image-button):drop(active) { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 0ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -3175,6 +3189,10 @@ row:selected:disabled label { margin: 8px; } +.app-notification button.text-button:not(:disabled) { + color: #8AB4F8; +} + .app-notification.frame, .app-notification border { border-style: none; @@ -3244,19 +3262,19 @@ calendar:indeterminate { * Dialogs * ***********/ messagedialog.background { - background-color: #424242; + background-color: #3C3C3C; } messagedialog .titlebar { min-height: 20px; border-style: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; color: white; } messagedialog .titlebar:backdrop { - background-color: #424242; + background-color: #3C3C3C; color: rgba(255, 255, 255, 0.7); } @@ -3279,7 +3297,7 @@ messagedialog.csd .dialog-action-box button:not(:disabled) { } messagedialog.csd .dialog-action-box button.destructive-action:not(:disabled) { - color: #EA4335; + color: #F28B82; } filechooser .dialog-action-box { @@ -3288,7 +3306,7 @@ filechooser .dialog-action-box { filechooser #pathbarbox { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } /*********** @@ -3330,6 +3348,7 @@ stacksidebar.sidebar row { stacksidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #8AB4F8; font-weight: 500; } @@ -3351,9 +3370,14 @@ separator.sidebar { * File chooser * ****************/ row image.sidebar-icon { + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); color: rgba(255, 255, 255, 0.7); } +row image.sidebar-icon:disabled { + color: rgba(255, 255, 255, 0.3); +} + placessidebar.sidebar > viewport.frame { border-style: none; } @@ -3375,9 +3399,14 @@ placessidebar.sidebar row > revealer { placessidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #8AB4F8; font-weight: 500; } +placessidebar.sidebar row:selected image.sidebar-icon { + color: #8AB4F8; +} + placessidebar.sidebar row:disabled { color: rgba(255, 255, 255, 0.5); } @@ -3390,6 +3419,10 @@ placessidebar.sidebar row image.sidebar-icon:dir(rtl) { padding-left: 8px; } +placessidebar.sidebar row label.sidebar-label { + color: inherit; +} + placessidebar.sidebar row label.sidebar-label:dir(ltr) { padding-right: 2px; } @@ -3398,11 +3431,6 @@ placessidebar.sidebar row label.sidebar-label:dir(rtl) { padding-left: 2px; } -placessidebar.sidebar row:selected image.sidebar-icon, -placessidebar.sidebar row:selected label.sidebar-label { - color: inherit; -} - placessidebar.sidebar row.sidebar-placeholder-row { background-color: alpha(currentColor, 0.08); } @@ -3411,6 +3439,10 @@ placessidebar.sidebar row.sidebar-new-bookmark-row { color: #8AB4F8; } +placessidebar.sidebar row.sidebar-new-bookmark-row image.sidebar-icon { + color: #8AB4F8; +} + placesview .server-list-button > image { -gtk-icon-transform: rotate(0turn); } @@ -3441,7 +3473,7 @@ paned > separator { paned > separator.wide { min-width: 6px; min-height: 6px; - background-color: #282828; + background-color: #212121; background-image: image(rgba(255, 255, 255, 0.12)), image(rgba(255, 255, 255, 0.12)); background-size: 1px 1px, 1px 1px; } @@ -3492,12 +3524,7 @@ infobar { infobar.info, infobar.question { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; -} - -infobar.info button.text-button, infobar.question button.text-button { - padding-left: 8px; - padding-right: 8px; + background-color: #2C2C2C; } infobar.info button.text-button:not(:disabled), infobar.question button.text-button:not(:disabled) { @@ -3505,7 +3532,7 @@ infobar.info button.text-button:not(:disabled), infobar.question button.text-but } infobar.warning { - background-color: #FBBC05; + background-color: #FDD633; color: rgba(0, 0, 0, 0.87); } @@ -3514,12 +3541,12 @@ infobar.warning *:link, infobar.warning button.link:link { } infobar.error { - background-color: #EA4335; - color: white; + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } infobar.error *:link, infobar.error button.link:link { - color: white; + color: rgba(0, 0, 0, 0.87); } /************ @@ -3598,15 +3625,15 @@ colorswatch.light { colorswatch overlay { transition: box-shadow 75ms 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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } colorswatch overlay:hover { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch overlay:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch#add-color-button { @@ -3619,7 +3646,7 @@ colorswatch#add-color-button:only-child { } colorswatch#add-color-button overlay { - background-color: #424242; + background-color: #3C3C3C; } colorswatch:disabled { @@ -3641,19 +3668,19 @@ colorswatch#editor-color-sample overlay { colorchooser .popover.osd { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } colorchooser .popover.osd:backdrop { - 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.1); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); } /******** * Misc * ********/ .content-view { - background-color: #282828; + background-color: #212121; } /********************** @@ -3662,12 +3689,12 @@ colorchooser .popover.osd:backdrop { decoration { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; margin: 8px; } decoration:backdrop { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; } .maximized decoration, @@ -3690,7 +3717,7 @@ decoration:backdrop { .csd.popup decoration { border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } tooltip.csd decoration { @@ -3706,7 +3733,7 @@ messagedialog.csd decoration { margin: 0; border-radius: 0; box-shadow: none; - background-color: #383838; + background-color: #353535; } .view selection, .view:selected, flowbox flowboxchild:selected, label selection, spinbutton:not(.vertical) selection, @@ -3754,7 +3781,7 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) border: solid 1px rgba(0, 0, 0, 0.26); border-radius: 3px; box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26); - background-color: #424242; + background-color: #3C3C3C; color: white; font-size: smaller; } @@ -3847,7 +3874,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window, .nautilus-window notebook, .nautilus-window notebook > stack { - background-color: #303030; + background-color: #2C2C2C; } .nautilus-canvas-item.dim-label, @@ -3857,7 +3884,7 @@ popover.emoji-completion .emoji:hover { .nautilus-desktop.nautilus-canvas-item, .caja-desktop.caja-canvas-item, .nemo-desktop.nemo-canvas-item { color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } @keyframes nautilus-operations-button-needs-attention { @@ -3901,20 +3928,24 @@ popover.emoji-completion .emoji:hover { margin-right: 0; } -.path-bar-box .nautilus-path-bar button { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: 4px; padding-right: 4px; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 0; +} + +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):first-child { margin-left: 0; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):last-child { margin-right: 0; } -.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button.image-button image:not(:only-child) { margin: 0; } @@ -3925,8 +3956,7 @@ popover.emoji-completion .emoji:hover { border-width: 1px; border-color: rgba(255, 255, 255, 0.12); border-radius: 3px 3px 0 0; - background-color: rgba(48, 48, 48, 0.9); - background-clip: border-box; + background-color: rgba(60, 60, 60, 0.9); } .nautilus-window .floating-bar.bottom.left { @@ -3963,12 +3993,12 @@ popover.emoji-completion .emoji:hover { .search-information { padding: 2px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; color: white; } .conflict-row:not(:selected) { - background-color: #6d5a23; + background-color: #6b5f2e; } .nautilus-window flowboxchild .icon-item-background { @@ -4027,7 +4057,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .nautilus-window paned > separator { - background-color: #282828; + background-color: #2C2C2C; } /********* @@ -4039,7 +4069,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .open-document-selector-match { - background-color: #FBBC05; + background-color: #FDD633; color: rgba(0, 0, 0, 0.87); } @@ -4100,20 +4130,20 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .gedit-search-slider .linked:not(.vertical) > entry:not(.error) { - background-color: #424242; + background-color: #3C3C3C; } .gedit-search-slider .linked:not(.vertical) > entry.error ~ button { - color: rgba(255, 255, 255, 0.7); + color: rgba(0, 0, 0, 0.6); } .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:hover, .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:drop(active), .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:active { - color: white; + color: rgba(0, 0, 0, 0.87); } .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:disabled { - color: rgba(255, 255, 255, 0.3); + color: rgba(0, 0, 0, 0.26); } .gedit-search-slider .linked > button { @@ -4155,16 +4185,16 @@ frame.gedit-map-frame > border:dir(rtl) { .tweak-group-white, .tweak-white, .tweak-white:hover { - background-image: image(#303030); + background-image: image(#2C2C2C); } .tweak-startup, .tweak-startup:hover { - background-image: image(#303030); + background-image: image(#2C2C2C); } .tweak-group-startup { - background-image: image(#303030); + background-image: image(#2C2C2C); border: 1px solid rgba(0, 0, 0, 0.26); } @@ -4208,7 +4238,7 @@ row#workspaces-only-on-primary { ***********/ layouttabbar { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } layouttabbar > box > button { @@ -4221,7 +4251,7 @@ layouttab { border-width: 1px; border-color: rgba(0, 0, 0, 0.26); box-shadow: inset 0 -2px #8AB4F8; - background-color: #303030; + background-color: #2C2C2C; } layouttab separator.vertical { @@ -4240,8 +4270,8 @@ layout { } entry.search-missing { - background-color: #EA4335; - color: white; + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } window.workbench treeview.image { @@ -4287,7 +4317,7 @@ popover.omnibar list row:not(:last-child) { entry.preferences-search { border-bottom: 1px solid rgba(255, 255, 255, 0.12); box-shadow: none; - background-color: #303030; + background-color: #2C2C2C; } preferences stacksidebar.sidebar list { @@ -4352,13 +4382,13 @@ dockpaned { eggsearchbar box.search-bar { padding: 0 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } docktabstrip { padding: 0 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } docktab { @@ -4393,7 +4423,7 @@ docktab:checked { } dockoverlayedge { - background-color: #282828; + background-color: #212121; } dockoverlayedge docktabstrip { @@ -4410,14 +4440,14 @@ dockoverlayedge.right-edge docktab:checked { } pillbox { - background-color: #282828; + background-color: #212121; border-radius: 2px; } layoutpane entry.search { border-bottom: 1px solid rgba(255, 255, 255, 0.12); box-shadow: none; - background-color: #303030; + background-color: #2C2C2C; } editortweak entry.search { @@ -4472,7 +4502,7 @@ idelayoutstackheader button:checked { ideeditorutilities > dzldockpaned > box > stackswitcher { padding: 8px 0; - background-color: #282828; + background-color: #212121; } ideeditorutilities > dzldockpaned > box > stackswitcher:dir(ltr) { @@ -4536,7 +4566,7 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: 9999px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #8AB4F8; color: rgba(0, 0, 0, 0.87); font-weight: bold; @@ -4572,7 +4602,7 @@ button.photos-filter-preview:checked { 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); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { @@ -4735,7 +4765,7 @@ list.categories { min-height: 24px; padding: 0 4px; border-radius: 2px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -4773,7 +4803,7 @@ button.title label { overlay > revealer.left > scrolledwindow.frame, overlay > revealer.right > scrolledwindow.frame { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } overlay > revealer.left > scrolledwindow.frame { @@ -4786,7 +4816,7 @@ overlay > revealer.right > scrolledwindow.frame { .terminix-session-sidebar, .tilix-session-sidebar { - background-image: image(#424242); + background-image: image(#3C3C3C); } .terminal-titlebar button { @@ -4797,11 +4827,20 @@ button.image-button.session-new-button { min-width: 28px; } +notebook.tilix-background tab > box > stack { + margin: -6px; +} + +button.flat.tilix-small-button { + min-height: 16px; + min-width: 12px; +} + /************** * Terminator * **************/ .terminator-terminal-window paned > separator { - background-color: #282828; + background-color: #212121; } .terminator-terminal-window notebook.frame { @@ -4836,38 +4875,47 @@ window.background > box.vertical > scrolledwindow > widget toolbar button { * Chromium * ************/ window.background.chromium { - background-color: #424242; + background-color: #3C3C3C; } window.background.chromium entry, -window.background.chromium > button:not(.suggested-action):not(.destructive-action) { - border: 1px solid rgba(0, 0, 0, 0.26); +window.background.chromium > button { + border: 1px solid rgba(255, 255, 255, 0.3); } window.background.chromium > button { - box-shadow: none; - background-size: auto; + color: #8AB4F8; } -window.background.chromium > button:hover, -window.background.chromium > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +window.background.chromium > button:disabled { + color: rgba(255, 255, 255, 0.3); } -window.background.chromium > button:active { - background-image: image(alpha(currentColor, 0.12)); +window.background.chromium menubar, +window.background.chromium headerbar { + color: rgba(255, 255, 255, 0.7); } window.background.chromium headerbar button:active { - background-size: 1000% 1000%; + background-color: alpha(currentColor, 0.12); } window.background.chromium spinner { color: #8AB4F8; } -window.background.chromium textview { - background-color: #424242; +window.background.chromium textview.view { + background-color: transparent; +} + +window.background.chromium treeview.view.cell:selected:focus { + background-color: #8AB4F8; + color: rgba(0, 0, 0, 0.87); +} + +window.background.chromium treeview.view button { + border: 1px solid rgba(255, 255, 255, 0.3); + background-color: #2C2C2C; } tooltip.background.chromium { @@ -4877,103 +4925,106 @@ tooltip.background.chromium { /*********** * Firefox * ***********/ -window.background:not(.csd) > widget > separator { - color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget text { + background-color: #3C3C3C; } -window.background:not(.csd) > widget > scrollbar { - background-clip: border-box; +#MozillaGtkWidget > widget text:selected { + background-color: #8AB4F8; + color: rgba(0, 0, 0, 0.87); } -window.background:not(.csd) > widget > scrollbar, -window.background:not(.csd) > widget > frame > border { - border-color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget > separator { + color: rgba(255, 255, 255, 0.12); } -window.background:not(.csd) > widget > entry, -window.background:not(.csd) > widget > button > button { - border: 1px solid rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget > frame > border { + border-color: rgba(255, 255, 255, 0.3); +} + +#MozillaGtkWidget > widget > entry, +#MozillaGtkWidget > widget > button > button { + border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 2px; box-shadow: none; } -window.background:not(.csd) > widget > entry { +#MozillaGtkWidget > widget > entry:disabled, +#MozillaGtkWidget > widget > button > button:disabled { + border-color: rgba(255, 255, 255, 0.12); +} + +#MozillaGtkWidget > widget > entry { min-height: 30px; - background-color: #303030; + background-color: #2C2C2C; } -window.background:not(.csd) > widget > entry:focus { +#MozillaGtkWidget > widget > entry:focus { border-color: #8AB4F8; box-shadow: inset 0 0 0 1px #8AB4F8; } -window.background:not(.csd) > widget > entry:disabled { +#MozillaGtkWidget > widget > entry:disabled { background-color: #2C2C2C; } -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > button > button { padding: 4px 8px; background-size: auto; } -window.background:not(.csd) > widget > button > button:hover, -window.background:not(.csd) > widget > button > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +#MozillaGtkWidget > widget > button > button:hover, +#MozillaGtkWidget > widget > button > button:drop(active) { + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); } -window.background:not(.csd) > widget > button > button:active { +#MozillaGtkWidget > widget > button > button:active { background-image: image(alpha(currentColor, 0.12)); } -window.background:not(.csd) > widget > checkbutton > check:not(:checked), -window.background:not(.csd) > widget > radiobutton > radio:not(:checked) { +#MozillaGtkWidget > widget > checkbutton > check, +#MozillaGtkWidget > widget > radiobutton > radio { + margin: 0; + padding: 0; +} + +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate), +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate) { color: #757575; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):hover, #MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):active, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):hover, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):active { color: #212121; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):disabled, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):disabled { color: rgba(117, 117, 117, 0.5); } -window.background:not(.csd) > window > menu, -window.background:not(.csd) > menu > menu { +#MozillaGtkWidget menu { border: none; } -text:selected { - background-color: #8AB4F8; - color: rgba(0, 0, 0, 0.87); -} - -window.background:not(.csd) > widget > menubar { +#MozillaGtkWidget > widget > menubar { color: rgba(255, 255, 255, 0.7); } -window.background:not(.csd) > widget > menubar:hover { +#MozillaGtkWidget > widget > menubar:hover { color: white; } -window.background:not(.csd) > widget > menubar:disabled { +#MozillaGtkWidget > widget > menubar:disabled { color: rgba(255, 255, 255, 0.3); } -window.background:not(.csd) > widget > frame { - color: rgba(0, 0, 0, 0.26); -} - -window.background:not(.csd) > widget > checkbutton > check, -window.background:not(.csd) > widget > radiobutton > radio { - margin: 0; - padding: 0; +#MozillaGtkWidget > widget > frame { + color: rgba(255, 255, 255, 0.3); } -window.background:not(.csd) > window.background > menu > separator { +#MozillaGtkWidget menu > separator { color: rgba(255, 255, 255, 0.12); } @@ -5080,12 +5131,12 @@ UnityDecoration .top { border-style: none; border-radius: 2px 2px 0 0; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #383838; + background-color: #353535; color: white; } UnityDecoration .top:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -5101,7 +5152,7 @@ UnityDecoration .menuitem:hover { .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .background:not(.csd) headerbar:not(.titlebar).inline-toolbar { @@ -5110,7 +5161,7 @@ UnityDecoration .menuitem:hover { UnityPanelWidget, .unity-panel { - background-color: #d6d6d6; + background-color: #1F1F1F; color: white; } @@ -5146,7 +5197,7 @@ UnityPanelWidget:backdrop, } .mate-panel-menu-bar { - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -5271,7 +5322,7 @@ PanelApplet.wnck-applet .wnck-pager:selected { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 3px; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } #MatePanelPopupWindow frame > border { @@ -5317,7 +5368,7 @@ na-tray-applet { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 3px; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } .mate-panel-applet-slider frame > border { @@ -5335,7 +5386,7 @@ na-tray-applet { #mate-menu { border: 1px solid rgba(0, 0, 0, 0.26); - background-color: #424242; + background-color: #3C3C3C; } #mate-menu button { @@ -5370,7 +5421,7 @@ na-tray-applet { .brisk-menu { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } .brisk-menu entry { @@ -5441,6 +5492,10 @@ na-tray-applet { margin: 0 -1px 0 -2px; } +.caja-pathbar button.slider-button { + min-width: 24px; +} + .caja-pathbar button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -GtkArrow-arrow-scaling: 1; @@ -5448,7 +5503,7 @@ na-tray-applet { .caja-side-pane notebook viewport.frame, .caja-side-pane notebook widget .vertical { - background-color: #303030; + background-color: #2C2C2C; } .caja-side-pane notebook, @@ -5461,6 +5516,35 @@ na-tray-applet { border-style: none; } +.caja-canvas-item { + border-radius: 2px; +} + +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: 2px; + background-color: rgba(255, 255, 255, 0.04); + background-image: none; + color: white; +} + +.caja-desktop.view .entry:selected, +.caja-navigation-window .view .entry:selected { + background-color: rgba(138, 180, 248, 0.24); +} + +.caja-desktop.view .entry { + background-color: rgba(0, 0, 0, 0.3); + color: white; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); + caret-color: currentColor; +} + +.caja-desktop.view .entry:selected { + background-color: rgba(138, 180, 248, 0.24); +} + .caja-navigation-window statusbar { margin: 0 -10px; padding: 0 4px; @@ -5473,7 +5557,7 @@ na-tray-applet { #caja-extra-view-widget { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; } #caja-extra-view-widget > box > box > label { @@ -5539,14 +5623,18 @@ na-tray-applet { .lock-dialog { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 3px; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } .lock-dialog frame > border { border-style: none; } +.lock-dialog button:not(:disabled) { + color: #8AB4F8; +} + /* multimedia OSD */ MsdOsdWindow.background.osd { border-radius: 2px; @@ -5584,8 +5672,8 @@ MsdOsdWindow.background.osd .progressbar { border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: 3px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #3C3C3C; } .budgie-popover .container { @@ -5780,13 +5868,13 @@ MsdOsdWindow.background.osd .progressbar { .budgie-panel { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } .budgie-panel.transparent { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .budgie-panel button { @@ -5809,7 +5897,7 @@ MsdOsdWindow.background.osd .progressbar { } .budgie-panel .alert { - color: #EA4335; + color: #F28B82; } .budgie-panel .titlebar:not(headerbar) { @@ -5845,7 +5933,8 @@ MsdOsdWindow.background.osd .progressbar { color: rgba(255, 255, 255, 0.5); } -.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel popover.background.menu button.launcher:not(:checked):drop(active), popover.background.menu .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel popover.background button.launcher.model:not(:checked):drop(active), popover.background .budgie-panel button.launcher.model:not(:checked):drop(active), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel infobar.info button.launcher:not(:checked):drop(active), infobar.info .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel infobar.question button.launcher:not(:checked):drop(active), infobar.question .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lock-dialog button.launcher:not(:checked):drop(active), .lock-dialog .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lightdm-gtk-greeter button.launcher:not(:checked):drop(active), .lightdm-gtk-greeter .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):active { color: rgba(255, 255, 255, 0.7); } @@ -5892,7 +5981,7 @@ MsdOsdWindow.background.osd .progressbar { frame.raven-frame > border { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } .top frame.raven-frame > border { @@ -5912,7 +6001,7 @@ frame.raven-frame > border { } .raven { - background-color: #424242; + background-color: #3C3C3C; } .raven > box { @@ -5961,7 +6050,7 @@ frame.raven-frame > border { border-style: solid none; border-width: 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; } .raven .raven-background > overlay > widget > image { @@ -5991,7 +6080,7 @@ calendar.raven-calendar:selected { } .raven-mpris { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -6023,8 +6112,8 @@ calendar.raven-calendar:selected { margin: 5px 9px; padding: 3px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } .drop-shadow .linked > button { @@ -6034,7 +6123,7 @@ calendar.raven-calendar:selected { .budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog { border-radius: 2px; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } .budgie-session-dialog decoration, .budgie-polkit-dialog decoration, .budgie-run-dialog decoration { @@ -6065,11 +6154,11 @@ calendar.raven-calendar:selected { } .budgie-polkit-dialog .failure { - color: #EA4335; + color: #F28B82; } .budgie-run-dialog { - background-color: #303030; + background-color: #2C2C2C; } .budgie-run-dialog entry.search { @@ -6092,7 +6181,7 @@ calendar.raven-calendar:selected { * Xfce4 Apps * **************/ .XfceHeading { - background-color: #303030; + background-color: #2C2C2C; } /*************** @@ -6100,7 +6189,7 @@ calendar.raven-calendar:selected { ***************/ .xfce4-panel.background { border: none; - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -6140,7 +6229,7 @@ XfdesktopIconView.view { border-radius: 2px; background-color: transparent; color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } XfdesktopIconView.view:active { @@ -6191,7 +6280,7 @@ XfdesktopIconView.view .rubberband { * LightDM GTK+ Greeter * ************************/ #panel_window { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; } @@ -6225,14 +6314,18 @@ XfdesktopIconView.view .rubberband { #restart_dialog { margin: 8px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } #content_frame { padding-bottom: 16px; } +.lightdm-gtk-greeter button:not(:disabled) { + color: #8AB4F8; +} + #buttonbox_frame { padding-top: 24px; } @@ -6285,7 +6378,7 @@ XfdesktopIconView.view .rubberband { } .places-treeview { - -NemoPlacesTreeView-disk-full-bg-color: dimgray; + -NemoPlacesTreeView-disk-full-bg-color: #646464; -NemoPlacesTreeView-disk-full-fg-color: #8AB4F8; -NemoPlacesTreeView-disk-full-bar-width: 2px; -NemoPlacesTreeView-disk-full-bar-radius: 0; @@ -6304,10 +6397,10 @@ text color for entries, views and content in general */ @define-color theme_text_color white; /* widget base background color */ -@define-color theme_bg_color #282828; +@define-color theme_bg_color #212121; /* text widgets and the like base background color */ -@define-color theme_base_color #303030; +@define-color theme_base_color #2C2C2C; /* base background color of selections */ @define-color theme_selected_bg_color #8AB4F8; @@ -6316,7 +6409,7 @@ text/foreground color of selections */ @define-color theme_selected_fg_color rgba(0, 0, 0, 0.87); /* base background color of insensitive widgets */ -@define-color insensitive_bg_color #282828; +@define-color insensitive_bg_color #212121; /* text foreground color of insensitive widgets */ @define-color insensitive_fg_color rgba(255, 255, 255, 0.5); @@ -6331,10 +6424,10 @@ text color for entries, views and content in general on backdrop windows */ @define-color theme_unfocused_text_color white; /* widget base background color on backdrop windows */ -@define-color theme_unfocused_bg_color #282828; +@define-color theme_unfocused_bg_color #212121; /* text widgets and the like base background color on backdrop windows */ -@define-color theme_unfocused_base_color #303030; +@define-color theme_unfocused_base_color #2C2C2C; /* base background color of selections on backdrop windows */ @define-color theme_unfocused_selected_bg_color #8AB4F8; @@ -6352,18 +6445,18 @@ widgets main borders color on backdrop windows */ @define-color unfocused_borders rgba(255, 255, 255, 0.12); /* these are pretty self explicative */ -@define-color warning_color #FBBC05; -@define-color error_color #EA4335; -@define-color success_color #34A853; +@define-color warning_color #FDD633; +@define-color error_color #F28B82; +@define-color success_color #81C995; /* these colors are exported for the window manager and shouldn't be used in applications, read if you used those and something break with a version upgrade you're on your own... */ @define-color wm_title white; @define-color wm_unfocused_title rgba(255, 255, 255, 0.7); @define-color wm_highlight rgba(255, 255, 255, 0.1); -@define-color wm_bg #383838; -@define-color wm_unfocused_bg #303030; +@define-color wm_bg #353535; +@define-color wm_unfocused_bg #2C2C2C; /* FIXME this is really an API */ -@define-color content_view_bg #303030; -@define-color placeholder_text_color #c1c1c1; +@define-color content_view_bg #2C2C2C; +@define-color placeholder_text_color silver; diff --git a/src/gtk/3.0/gtk-dark.css b/src/gtk/3.0/gtk-dark.css index aa69a4944..976b62f1b 100644 --- a/src/gtk/3.0/gtk-dark.css +++ b/src/gtk/3.0/gtk-dark.css @@ -22,7 +22,7 @@ * { background-clip: padding-box; -GtkToolButton-icon-spacing: 0; - -GtkTextView-error-underline-color: #EA4335; + -GtkTextView-error-underline-color: #F28B82; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 24; @@ -45,7 +45,7 @@ * Base States * ***************/ .background { - background-color: #282828; + background-color: #212121; color: white; } @@ -60,22 +60,22 @@ } .gtkstyle-fallback { - background-color: #282828; + background-color: #212121; color: white; } .gtkstyle-fallback:hover { - background-color: #1b1b1b; + background-color: #141414; color: white; } .gtkstyle-fallback:active { - background-color: #0f0e0e; + background-color: #080707; color: white; } .gtkstyle-fallback:disabled { - background-color: #282828; + background-color: #212121; color: rgba(255, 255, 255, 0.5); } @@ -85,7 +85,7 @@ } .view { - background-color: #303030; + background-color: #2C2C2C; color: white; } @@ -106,7 +106,7 @@ } textview text { - background-color: #303030; + background-color: #2C2C2C; } textview border { @@ -152,6 +152,12 @@ button label:disabled { color: inherit; } +label.osd { + border-radius: 2px; + background-color: rgba(97, 97, 97, 0.9); + color: white; +} + .dim-label { color: rgba(255, 255, 255, 0.7); } @@ -267,7 +273,7 @@ entry image.right { spinbutton:not(.vertical) undershoot.left, entry undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -278,7 +284,7 @@ entry undershoot.left { spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -289,15 +295,15 @@ entry undershoot.right { spinbutton.error:not(.vertical), entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #EA4335; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F28B82 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #F28B82; background-color: rgba(255, 255, 255, 0.04); color: white; } spinbutton.error:focus:not(.vertical), entry.error:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F28B82 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.error:disabled:not(.vertical), @@ -310,15 +316,15 @@ entry.error:disabled { spinbutton.warning:not(.vertical), entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FBBC05; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FDD633 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FDD633; background-color: rgba(255, 255, 255, 0.04); color: white; } spinbutton.warning:focus:not(.vertical), entry.warning:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FDD633 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.warning:disabled:not(.vertical), @@ -339,22 +345,22 @@ spinbutton.vertical entry, .gedit-search-slider .linked:not(.vertical) > entry { border-radius: 2px; transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #303030; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #3C3C3C; color: white; } spinbutton.vertical entry:focus, .gedit-search-slider .linked:not(.vertical) > entry:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:drop(active), .gedit-search-slider .linked:not(.vertical) > entry:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) > entry:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #2C2C2C; color: rgba(255, 255, 255, 0.5); } @@ -362,55 +368,55 @@ spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) spinbutton.vertical entry.error, .gedit-search-slider .linked:not(.vertical) > entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #EA4335; - color: white; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.error:focus, .gedit-search-slider .linked:not(.vertical) > entry.error:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.error:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #2C2C2C; color: rgba(255, 255, 255, 0.5); } spinbutton.vertical entry.error image, .gedit-search-slider .linked:not(.vertical) > entry.error image { - color: rgba(255, 255, 255, 0.7); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.error image:hover, .gedit-search-slider .linked:not(.vertical) > entry.error image:hover, spinbutton.vertical entry.error image:active, .gedit-search-slider .linked:not(.vertical) > entry.error image:active { - color: white; + color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.error image:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error image:disabled { - color: rgba(255, 255, 255, 0.5); + color: rgba(0, 0, 0, 0.38); } spinbutton.vertical entry.warning, .gedit-search-slider .linked:not(.vertical) > entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #FBBC05; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #FDD633; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.warning:focus, .gedit-search-slider .linked:not(.vertical) > entry.warning:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.warning:disabled, .gedit-search-slider .linked:not(.vertical) > entry.warning:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #2C2C2C; color: rgba(255, 255, 255, 0.5); } spinbutton.vertical entry.warning image, .gedit-search-slider .linked:not(.vertical) > entry.warning image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.warning image:hover, .gedit-search-slider .linked:not(.vertical) > entry.warning image:hover, spinbutton.vertical entry.warning image:active, .gedit-search-slider .linked:not(.vertical) > entry.warning image:active { @@ -422,7 +428,7 @@ spinbutton.vertical entry.warning image:disabled, .gedit-search-slider .linked:n } treeview entry.flat, treeview entry { - background-color: #303030; + background-color: #2C2C2C; } treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus { @@ -486,8 +492,8 @@ button { font-weight: 500; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; - box-shadow: inset 0 0 0 9999px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #424242; + box-shadow: inset 0 0 0 9999px transparent, 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); + background-color: #3C3C3C; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; background-position: center; @@ -497,20 +503,20 @@ button { button:focus { - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:hover, button:drop(active) { - box-shadow: inset 0 0 0 9999px transparent, 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px transparent, 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 5px 3px -3px rgba(0, 0, 0, 0.2), 0 8px 6px 1px rgba(0, 0, 0, 0.14), 0 3px 8.4px 2px rgba(0, 0, 0, 0.12); background-image: radial-gradient(circle, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; } @@ -537,9 +543,9 @@ button:checked:disabled { modelbutton.flat, .menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, notebook > header > tabs > arrow, scrollbar button, check, -radio, calendar.button, button.sidebar-button, infobar.info button, infobar.question button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .lock-dialog button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, -.path-bar button, popover.background.menu button, -popover.background button.model, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, .nemo-window .toolbar button, +radio, calendar.button, button.sidebar-button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, +.path-bar.linked:not(.vertical) > button, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), popover.background.menu button, +popover.background button.model, actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, infobar.info button, infobar.question button, .lock-dialog button, .lightdm-gtk-greeter button, .nemo-window .toolbar button, button.flat { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; @@ -554,9 +560,9 @@ button.flat { modelbutton.flat:focus, .menuitem.button.flat:focus, spinbutton:not(.vertical) button:focus, spinbutton.vertical button:focus, notebook > header > tabs > arrow:focus, scrollbar button:focus, check:focus, -radio:focus, calendar.button:focus, button.sidebar-button:focus, infobar.info button:focus, infobar.question button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .lock-dialog button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, .lightdm-gtk-greeter button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, -.path-bar button:focus, popover.background.menu button:focus, -popover.background button.model:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, .nemo-window .toolbar button:focus, +radio:focus, calendar.button:focus, button.sidebar-button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, +.path-bar.linked:not(.vertical) > button:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), popover.background.menu button:focus, +popover.background button.model:focus, actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, infobar.info button:focus, infobar.question button:focus, .lock-dialog button:focus, .lightdm-gtk-greeter button:focus, .nemo-window .toolbar button:focus, button.flat:focus { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); color: white; @@ -568,44 +574,50 @@ spinbutton:not(.vertical) button:drop(active), spinbutton.vertical button:hover, spinbutton.vertical button:drop(active), notebook > header > tabs > arrow:hover, scrollbar button:hover, scrollbar button:drop(active), check:hover, radio:hover, calendar.button:hover, button.sidebar-button:hover, -button.sidebar-button:drop(active), infobar.info button:hover, -infobar.info button:drop(active), infobar.question button:hover, -infobar.question button:drop(active), .gedit-search-slider .linked > button:hover, +button.sidebar-button:drop(active), .gedit-search-slider .linked > button:hover, .gedit-search-slider .linked > button:drop(active), popover.messagepopover .popover-action-area button:hover, popover.messagepopover .popover-action-area button:drop(active), #MatePanelPopupWindow button:hover, #MatePanelPopupWindow button:drop(active), #mate-menu button:hover, -#mate-menu button:drop(active), .lock-dialog button:hover, -.lock-dialog button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, +#mate-menu button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, .budgie-settings-window buttonbox.inline-toolbar button:drop(active), .drop-shadow button:hover, .drop-shadow button:drop(active), .budgie-session-dialog .linked.horizontal > button:hover, -.budgie-session-dialog .linked.horizontal > button:drop(active), .lightdm-gtk-greeter button:hover, -.lightdm-gtk-greeter button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), +.budgie-session-dialog .linked.horizontal > button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), combobox > .linked:not(.vertical) > button:not(:only-child):drop(active), .caja-pathbar button:hover, .caja-pathbar button:drop(active), -.path-bar button:hover, -.path-bar button:drop(active), popover.background.menu button:hover, -popover.background.menu button:drop(active), -popover.background button.model:hover, -popover.background button.model:drop(active), layouttabbar button:hover, +.path-bar.linked:not(.vertical) > button:hover, +.path-bar.linked:not(.vertical) > button:drop(active), layouttabbar button:hover, layouttabbar button:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven stackswitcher.linked > button:hover, .raven stackswitcher.linked > button:drop(active), .xfce4-panel.background button:hover, .xfce4-panel.background button:drop(active), toolbar button:hover, toolbar button:drop(active), .titlebar button:hover:not(.suggested-action):not(.destructive-action), -.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), +.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), popover.background.menu button:hover, +popover.background.menu button:drop(active), +popover.background button.model:hover, +popover.background button.model:drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):drop(active), .app-notification button:hover, .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:hover, messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:hover, -filechooser #pathbarbox > stack > box > button:drop(active), .nemo-window .toolbar button:hover, +filechooser #pathbarbox > stack > box > button:drop(active), infobar.info button:hover, +infobar.info button:drop(active), infobar.question button:hover, +infobar.question button:drop(active), .lock-dialog button:hover, +.lock-dialog button:drop(active), .lightdm-gtk-greeter button:hover, +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:hover, .nemo-window .toolbar button:drop(active), button.flat:hover, toolbar button:drop(active), .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), +popover.background.menu button:drop(active), +popover.background button.model:drop(active), actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:drop(active), +infobar.info button:drop(active), +infobar.question button:drop(active), +.lock-dialog button:drop(active), +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:drop(active), button.flat:drop(active) { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -614,9 +626,9 @@ button.flat:drop(active) { modelbutton.flat:active, .menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active, -radio:active, calendar.button:active, button.sidebar-button:active, infobar.info button:active, infobar.question button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .lock-dialog button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, -.path-bar button:active, popover.background.menu button:active, -popover.background button.model:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, +radio:active, calendar.button:active, button.sidebar-button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, +.path-bar.linked:not(.vertical) > button:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), popover.background.menu button:active, +popover.background button.model:active, actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, infobar.info button:active, infobar.question button:active, .lock-dialog button:active, .lightdm-gtk-greeter button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; @@ -628,9 +640,9 @@ button.flat:active { modelbutton.flat:disabled, .menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, -radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, infobar.info button:disabled, infobar.question button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .lock-dialog button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, -.path-bar button:disabled, popover.background.menu button:disabled, -popover.background button.model:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, .nemo-window .toolbar button:disabled, +radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, +.path-bar.linked:not(.vertical) > button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:disabled, +popover.background button.model:disabled, actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, infobar.info button:disabled, infobar.question button:disabled, .lock-dialog button:disabled, .lightdm-gtk-greeter button:disabled, .nemo-window .toolbar button:disabled, button.flat:disabled { box-shadow: none; background-color: transparent; @@ -638,16 +650,16 @@ button.flat:disabled { } combobox > .linked:not(.vertical) > button:checked:not(:only-child), .caja-pathbar button:checked, -.path-bar button:checked, popover.background.menu button:checked, -popover.background button.model:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background 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 button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, +.path-bar.linked:not(.vertical) > button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked, +popover.background button.model:checked, actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, infobar.info button:checked, infobar.question button:checked, .lock-dialog button:checked, .lightdm-gtk-greeter button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.12); color: white; } combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), .caja-pathbar button:checked:disabled, -.path-bar button:checked:disabled, popover.background.menu button:checked:disabled, -popover.background button.model:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .xfce4-panel.background 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 button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, +.path-bar.linked:not(.vertical) > 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, .xfce4-panel.background button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked:disabled, +popover.background button.model:checked:disabled, actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, infobar.info button:checked:disabled, infobar.question button:checked:disabled, .lock-dialog button:checked:disabled, .lightdm-gtk-greeter button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: alpha(currentColor, 0.12); color: rgba(255, 255, 255, 0.5); @@ -660,7 +672,8 @@ button.text-button { padding-right: 16px; } -toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, .nemo-window .toolbar button.text-button, +toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), popover.background.menu button.text-button, +popover.background button.text-button.model, actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, infobar.info button.text-button, infobar.question button.text-button, .lock-dialog button.text-button, .lightdm-gtk-greeter button.text-button, .nemo-window .toolbar button.text-button, button.text-button.flat { min-width: 48px; padding-left: 8px; @@ -690,12 +703,12 @@ button.text-button.image-button label:last-child { margin-right: 10px; } -toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, +toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, popover.background.menu button.text-button.image-button label:first-child, popover.background button.text-button.image-button.model label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, infobar.info button.text-button.image-button label:first-child, infobar.question button.text-button.image-button label:first-child, .lock-dialog button.text-button.image-button label:first-child, .lightdm-gtk-greeter button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, button.text-button.image-button.flat label:first-child { margin-left: 6px; } -toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, +toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, popover.background.menu button.text-button.image-button label:last-child, popover.background button.text-button.image-button.model label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, infobar.info button.text-button.image-button label:last-child, infobar.question button.text-button.image-button label:last-child, .lock-dialog button.text-button.image-button label:last-child, .lightdm-gtk-greeter button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, button.text-button.image-button.flat label:last-child { margin-right: 6px; } @@ -705,13 +718,20 @@ button.text-button.image-button image:not(:only-child) { margin: 0 4px; } -toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), +toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child), +popover.background .linked:not(.vertical) > button.model:not(:only-child), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), infobar.info .linked:not(.vertical) > button:not(:only-child), infobar.question .linked:not(.vertical) > button:not(:only-child), .lock-dialog .linked:not(.vertical) > button:not(:only-child), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), toolbar .linked.vertical > button:not(:only-child), .titlebar .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child), +popover.background .linked.vertical > button.model:not(:only-child), actionbar > revealer > box .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > button:not(:only-child), messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child), filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child), +infobar.info .linked.vertical > button:not(:only-child), +infobar.question .linked.vertical > button:not(:only-child), +.lock-dialog .linked.vertical > button:not(:only-child), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child), .nemo-window .toolbar .linked.vertical > button:not(:only-child), .linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > @@ -719,39 +739,33 @@ button.flat:not(:only-child) { border-radius: 2px; } -toolbar .linked:not(.vertical) > button:not(:only-child).image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button, -toolbar .linked.vertical > button:not(:only-child).image-button, -.titlebar .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button, .linked:not(.vertical) > -button.flat:not(:only-child).image-button, +toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +popover.background .linked:not(.vertical) > button.model:not(:only-child).image-button:not(.text-button), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.info .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.question .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lock-dialog .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.titlebar .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child).image-button:not(.text-button), +popover.background .linked.vertical > button.model:not(:only-child).image-button:not(.text-button), +actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +.app-notification .linked.vertical > button:not(:only-child).image-button:not(.text-button), +messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button:not(.text-button), +filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.info .linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.question .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lock-dialog .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), .linked:not(.vertical) > +button.flat:not(:only-child).image-button:not(.text-button), .linked.vertical > -button.flat:not(:only-child).image-button { +button.flat:not(:only-child).image-button:not(.text-button) { border-radius: 9999px; } -toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).text-button.image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).text-button.image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).text-button.image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, -toolbar .linked.vertical > button:not(:only-child).text-button.image-button, -.titlebar .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).text-button.image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).text-button.image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).text-button.image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).text-button.image-button, .linked:not(.vertical) > -button.flat:not(:only-child).text-button.image-button, -.linked.vertical > -button.flat:not(:only-child).text-button.image-button { - border-radius: 2px; -} - infobar.error button.flat, .mate-panel-menu-bar button, .budgie-panel button, .raven-mpris button.image-button, .xfce4-panel.background button { color: rgba(255, 255, 255, 0.7); } -infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), +infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error popover.background.menu button:drop(active), popover.background.menu infobar.error button:drop(active), +infobar.error popover.background button.model:drop(active), popover.background infobar.error button.model:drop(active), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error infobar.info button:drop(active), infobar.info infobar.error button:drop(active), infobar.error infobar.question button:drop(active), infobar.question infobar.error button:drop(active), infobar.error .lock-dialog button:drop(active), .lock-dialog infobar.error button:drop(active), infobar.error .lightdm-gtk-greeter button:drop(active), .lightdm-gtk-greeter infobar.error button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), infobar.error button.flat:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven-mpris button.image-button:hover, @@ -821,8 +835,8 @@ button.suggested-action.flat:checked { button.destructive-action { - background-color: #EA4335; - color: white; + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } @@ -834,13 +848,13 @@ button.destructive-action:disabled { button.destructive-action:checked { - background-color: #f07b72; + background-color: rgba(182, 105, 98, 0.961); } button.destructive-action.flat { background-color: transparent; - color: #EA4335; + color: #F28B82; } @@ -852,7 +866,7 @@ button.destructive-action.flat:disabled { button.destructive-action.flat:checked { - background-color: rgba(234, 67, 53, 0.3); + background-color: rgba(242, 139, 130, 0.3); } .stack-switcher > @@ -882,7 +896,7 @@ button { button.image-button, .inline-toolbar button:not(.text-button), check, -radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked > button.disclosure-button:not(.suggested-action):not(.destructive-action), .nautilus-window headerbar revealer > button, .raven .expander-button, +radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked:not(.vertical) > button.disclosure-button:not(.suggested-action):not(.destructive-action):not(:only-child), .nautilus-window headerbar revealer > button, .raven .expander-button, button.close, button.circular { border-radius: 9999px; @@ -928,31 +942,31 @@ spinbutton:not(.vertical) button, notebook > header tab button.flat, button.side border-bottom-right-radius: 0; } -.linked:not(.vertical) > button.image-button:first-child { +.linked:not(.vertical) > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-bottom-left-radius: 2px; } -.linked:not(.vertical) > button.image-button:last-child { +.linked:not(.vertical) > button.image-button:last-child:not(.text-button) { border-top-right-radius: 2px; border-bottom-right-radius: 2px; } -.linked:not(.vertical) > button.image-button:only-child { +.linked:not(.vertical) > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } -.linked.vertical > button.image-button:first-child { +.linked.vertical > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-top-right-radius: 2px; } -.linked.vertical > button.image-button:last-child { +.linked.vertical > button.image-button:last-child:not(.text-button) { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } -.linked.vertical > button.image-button:only-child { +.linked.vertical > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } @@ -1165,7 +1179,7 @@ button.combo:only-child:disabled { toolbar { -GtkWidget-window-dragging: true; padding: 2px; - background-color: #282828; + background-color: #212121; } .osd toolbar { @@ -1176,12 +1190,12 @@ toolbar.osd, .app-notification, frame.documents-dropdown { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop { - 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.1); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); } toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown { @@ -1244,7 +1258,7 @@ searchbar > revealer > box, border-style: solid; border-width: 0 0 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; background-clip: border-box; } @@ -1259,8 +1273,8 @@ searchbar > revealer > box { .titlebar { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - 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.1); - background-color: #383838; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #353535; color: white; } @@ -1269,7 +1283,7 @@ searchbar > revealer > box { } .titlebar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1349,13 +1363,13 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar 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; background-color: transparent; color: white; } -.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 button:not(.suggested-action):not(.destructive-action):checked:disabled { +.path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; color: rgba(255, 255, 255, 0.5); } @@ -1373,11 +1387,11 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked { +.path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { +.path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1399,13 +1413,13 @@ searchbar > revealer > box { .titlebar.selection-mode { transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); animation: ripple-on-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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.2); background-color: #8AB4F8; color: rgba(0, 0, 0, 0.87); } .titlebar.selection-mode:backdrop { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar.selection-mode .subtitle:link { @@ -1431,7 +1445,7 @@ searchbar > revealer > box { } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:disabled { @@ -1439,7 +1453,7 @@ searchbar > revealer > box { } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { @@ -1472,7 +1486,7 @@ searchbar > revealer > box { .maximized .titlebar, .fullscreen .titlebar { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .titlebar.default-decoration { @@ -1500,7 +1514,7 @@ searchbar > revealer > box { .solid-csd .titlebar:dir(rtl), .solid-csd .titlebar:dir(ltr) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } headerbar { @@ -1540,7 +1554,7 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta * Pathbars * ************/ .caja-pathbar button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { padding-left: 6px; padding-right: 6px; border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #8AB4F8 0%, transparent 0%) 0 0 0/0 0 0px; @@ -1548,33 +1562,33 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta } .caja-pathbar button:checked, -.path-bar button:checked { +.path-bar.linked:not(.vertical) > button:checked { border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #8AB4F8 100%, transparent 0%) 0 0 2/0 0 2px; } .caja-pathbar button:checked, .caja-pathbar button:checked:disabled, -.path-bar button:checked, -.path-bar button:checked:disabled { +.path-bar.linked:not(.vertical) > button:checked, +.path-bar.linked:not(.vertical) > button:checked:disabled { background-color: transparent; } .caja-pathbar button label:not(:only-child):first-child, -.path-bar button label:not(:only-child):first-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):first-child { margin-left: 0; } .caja-pathbar button label:not(:only-child):last-child, -.path-bar button label:not(:only-child):last-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):last-child { margin-right: 0; } .caja-pathbar button.text-button, -.path-bar button.text-button { +.path-bar.linked:not(.vertical) > button.text-button { min-width: 0; } .caja-pathbar button.slider-button, -.path-bar button.slider-button { +.path-bar.linked:not(.vertical) > button.slider-button { padding-left: 4px; padding-right: 4px; } @@ -1597,7 +1611,7 @@ treeview.view { } treeview.view:selected { - background-color: #303030; + background-color: #2C2C2C; background-image: image(rgba(138, 180, 248, 0.24)); } @@ -1682,7 +1696,7 @@ treeview.view header button:not(:focus):not(:hover):not(:active) { } treeview.view header button, treeview.view header button:disabled { - background-color: #303030; + background-color: #2C2C2C; } treeview.view header button:last-child { @@ -1697,7 +1711,7 @@ treeview.view header.button.dnd { border-color: rgba(255, 255, 255, 0.12); border-radius: 0; box-shadow: none; - background-color: #303030; + background-color: #2C2C2C; background-clip: border-box; color: #8AB4F8; } @@ -1713,13 +1727,13 @@ menubar, .menubar { -GtkWidget-window-dragging: true; padding: 0; - background-color: #383838; + background-color: #353535; color: white; } menubar:backdrop, .menubar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1763,7 +1777,7 @@ menu, margin: 4px 0; padding: 4px 0; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; border: 1px solid rgba(0, 0, 0, 0.26); } @@ -1834,7 +1848,7 @@ menu > arrow, min-height: 16px; min-width: 16px; padding: 4px; - background-color: #424242; + background-color: #3C3C3C; color: rgba(255, 255, 255, 0.7); } @@ -1892,12 +1906,12 @@ menuitem:disabled accelerator { popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #3C3C3C; } popover.background:backdrop { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); } popover.background, .csd popover.background { @@ -1926,7 +1940,7 @@ popover.background > toolbar { popover.background list, popover.background .view:not(:selected), popover.background toolbar { - background-color: #424242; + background-color: #3C3C3C; } popover.background.menu button, @@ -1959,7 +1973,7 @@ notebook:focus tab:checked { notebook > header { border-width: 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; background-clip: border-box; } @@ -2136,7 +2150,7 @@ notebook > header tab:checked:disabled { notebook > header tab:checked.reorderable-page { border-color: rgba(0, 0, 0, 0.26); - background-color: #303030; + background-color: #2C2C2C; } notebook > header tab > box { @@ -2190,7 +2204,7 @@ notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs t } notebook > stack:not(:only-child) { - background-color: #303030; + background-color: #2C2C2C; } /************** @@ -2198,8 +2212,7 @@ notebook > stack:not(:only-child) { **************/ scrollbar { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; - background-clip: border-box; + background-color: #2C2C2C; } * { @@ -2271,14 +2284,14 @@ scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { min-width: 4px; min-height: 4px; margin: 3px; - border: 1px solid rgba(48, 48, 48, 0.3); + border: 1px solid rgba(44, 44, 44, 0.3); } scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { min-width: 4px; min-height: 4px; margin: 3px; - border: 1px solid rgba(48, 48, 48, 0.3); + border: 1px solid rgba(44, 44, 44, 0.3); border-radius: 9999px; background-color: rgba(255, 255, 255, 0.5); background-clip: padding-box; @@ -2306,7 +2319,7 @@ scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button { } scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { - background-color: rgba(48, 48, 48, 0.9); + background-color: rgba(60, 60, 60, 0.9); } scrollbar.horizontal slider { @@ -2374,20 +2387,20 @@ switch slider { 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; + box-shadow: 0 0 0 10px transparent, 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #3C3C3C; } switch:focus slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:focus:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:checked slider { @@ -2407,13 +2420,13 @@ switch:checked slider { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list):hover, .view.content-view.check:not(list):active, .content-view .tile check:not(list):hover, .content-view .tile check:not(list):active { - -gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + -gtk-icon-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 3px rgba(0, 0, 0, 0.14), 0 1px 6px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list), @@ -2561,7 +2574,7 @@ radio:checked:not(:indeterminate):disabled { border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(255, 255, 255, 0.3)), to(transparent)); } -window.background:not(.csd) > widget > checkbutton > check, +#MozillaGtkWidget > widget > checkbutton > check, menu menuitem check { min-height: 16px; min-width: 16px; @@ -2569,17 +2582,17 @@ menu menuitem check { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:checked, +#MozillaGtkWidget > widget > checkbutton > check:checked, menu menuitem check:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:indeterminate, +#MozillaGtkWidget > widget > checkbutton > check:indeterminate, menu menuitem check:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio, +#MozillaGtkWidget > widget > radiobutton > radio, menu menuitem radio { min-height: 16px; min-width: 16px; @@ -2587,12 +2600,12 @@ menu menuitem radio { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:checked, +#MozillaGtkWidget > widget > radiobutton > radio:checked, menu menuitem radio:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:indeterminate, +#MozillaGtkWidget > widget > radiobutton > radio:indeterminate, menu menuitem radio:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")); } @@ -2696,7 +2709,7 @@ scale highlight { } scale highlight:disabled { - background-color: #282828; + background-color: #212121; background-image: image(rgba(255, 255, 255, 0.3)); } @@ -2944,7 +2957,7 @@ levelbar.vertical.discrete block:not(:last-child) { } levelbar block.low { - background-color: #FBBC05; + background-color: #FDD633; } levelbar block.high, levelbar block:not(.empty) { @@ -2952,7 +2965,7 @@ levelbar block.high, levelbar block:not(.empty) { } levelbar block.full { - background-color: #34A853; + background-color: #81C995; } levelbar block.empty { @@ -2965,7 +2978,7 @@ levelbar block.empty { printdialog paper { padding: 0; border: 1px solid rgba(0, 0, 0, 0.26); - background-color: #303030; + background-color: #2C2C2C; color: white; } @@ -2994,7 +3007,7 @@ frame.flat > border { actionbar > revealer > box { padding: 6px; border-top: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; background-clip: border-box; } @@ -3044,7 +3057,7 @@ overshoot.right { undershoot.top { background-color: transparent; - background-image: linear-gradient(to left, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-top: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3054,7 +3067,7 @@ undershoot.top { undershoot.bottom { background-color: transparent; - background-image: linear-gradient(to left, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-bottom: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3064,7 +3077,7 @@ undershoot.bottom { undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3074,7 +3087,7 @@ undershoot.left { undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(255, 255, 255, 0.3) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3086,7 +3099,7 @@ junction { border-style: solid none none solid; border-width: 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; } junction:dir(rtl) { @@ -3113,7 +3126,7 @@ stacksidebar.sidebar separator.horizontal, .tweak-categories separator, preferen *********/ list { border-color: rgba(0, 0, 0, 0.26); - background-color: #303030; + background-color: #2C2C2C; } list row { @@ -3135,7 +3148,8 @@ row.activatable:focus, treeview.view header button:focus, .budgie-popover.budgie } row.activatable:hover, treeview.view header button:hover, -treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), +treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu popover.background.menu button:not(.image-button):drop(active), popover.background.menu .budgie-popover.budgie-menu button:not(.image-button):drop(active), +.budgie-popover.budgie-menu popover.background button.model:not(.image-button):drop(active), popover.background .budgie-popover.budgie-menu button.model:not(.image-button):drop(active), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.info button:not(.image-button):drop(active), infobar.info .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.question button:not(.image-button):drop(active), infobar.question .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lock-dialog button:not(.image-button):drop(active), .lock-dialog .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lightdm-gtk-greeter button:not(.image-button):drop(active), .lightdm-gtk-greeter .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu button.flat:not(.image-button):drop(active) { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 0ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -3175,6 +3189,10 @@ row:selected:disabled label { margin: 8px; } +.app-notification button.text-button:not(:disabled) { + color: #8AB4F8; +} + .app-notification.frame, .app-notification border { border-style: none; @@ -3244,19 +3262,19 @@ calendar:indeterminate { * Dialogs * ***********/ messagedialog.background { - background-color: #424242; + background-color: #3C3C3C; } messagedialog .titlebar { min-height: 24px; border-style: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; color: white; } messagedialog .titlebar:backdrop { - background-color: #424242; + background-color: #3C3C3C; color: rgba(255, 255, 255, 0.7); } @@ -3279,7 +3297,7 @@ messagedialog.csd .dialog-action-box button:not(:disabled) { } messagedialog.csd .dialog-action-box button.destructive-action:not(:disabled) { - color: #EA4335; + color: #F28B82; } filechooser .dialog-action-box { @@ -3288,7 +3306,7 @@ filechooser .dialog-action-box { filechooser #pathbarbox { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } /*********** @@ -3330,6 +3348,7 @@ stacksidebar.sidebar row { stacksidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #8AB4F8; font-weight: 500; } @@ -3351,9 +3370,14 @@ separator.sidebar { * File chooser * ****************/ row image.sidebar-icon { + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); color: rgba(255, 255, 255, 0.7); } +row image.sidebar-icon:disabled { + color: rgba(255, 255, 255, 0.3); +} + placessidebar.sidebar > viewport.frame { border-style: none; } @@ -3375,9 +3399,14 @@ placessidebar.sidebar row > revealer { placessidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #8AB4F8; font-weight: 500; } +placessidebar.sidebar row:selected image.sidebar-icon { + color: #8AB4F8; +} + placessidebar.sidebar row:disabled { color: rgba(255, 255, 255, 0.5); } @@ -3390,6 +3419,10 @@ placessidebar.sidebar row image.sidebar-icon:dir(rtl) { padding-left: 8px; } +placessidebar.sidebar row label.sidebar-label { + color: inherit; +} + placessidebar.sidebar row label.sidebar-label:dir(ltr) { padding-right: 2px; } @@ -3398,11 +3431,6 @@ placessidebar.sidebar row label.sidebar-label:dir(rtl) { padding-left: 2px; } -placessidebar.sidebar row:selected image.sidebar-icon, -placessidebar.sidebar row:selected label.sidebar-label { - color: inherit; -} - placessidebar.sidebar row.sidebar-placeholder-row { background-color: alpha(currentColor, 0.08); } @@ -3411,6 +3439,10 @@ placessidebar.sidebar row.sidebar-new-bookmark-row { color: #8AB4F8; } +placessidebar.sidebar row.sidebar-new-bookmark-row image.sidebar-icon { + color: #8AB4F8; +} + placesview .server-list-button > image { -gtk-icon-transform: rotate(0turn); } @@ -3441,7 +3473,7 @@ paned > separator { paned > separator.wide { min-width: 6px; min-height: 6px; - background-color: #282828; + background-color: #212121; background-image: image(rgba(255, 255, 255, 0.12)), image(rgba(255, 255, 255, 0.12)); background-size: 1px 1px, 1px 1px; } @@ -3492,12 +3524,7 @@ infobar { infobar.info, infobar.question { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; -} - -infobar.info button.text-button, infobar.question button.text-button { - padding-left: 8px; - padding-right: 8px; + background-color: #2C2C2C; } infobar.info button.text-button:not(:disabled), infobar.question button.text-button:not(:disabled) { @@ -3505,7 +3532,7 @@ infobar.info button.text-button:not(:disabled), infobar.question button.text-but } infobar.warning { - background-color: #FBBC05; + background-color: #FDD633; color: rgba(0, 0, 0, 0.87); } @@ -3514,12 +3541,12 @@ infobar.warning *:link, infobar.warning button.link:link { } infobar.error { - background-color: #EA4335; - color: white; + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } infobar.error *:link, infobar.error button.link:link { - color: white; + color: rgba(0, 0, 0, 0.87); } /************ @@ -3598,15 +3625,15 @@ colorswatch.light { colorswatch overlay { transition: box-shadow 75ms 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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } colorswatch overlay:hover { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch overlay:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch#add-color-button { @@ -3619,7 +3646,7 @@ colorswatch#add-color-button:only-child { } colorswatch#add-color-button overlay { - background-color: #424242; + background-color: #3C3C3C; } colorswatch:disabled { @@ -3641,19 +3668,19 @@ colorswatch#editor-color-sample overlay { colorchooser .popover.osd { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } colorchooser .popover.osd:backdrop { - 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.1); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); } /******** * Misc * ********/ .content-view { - background-color: #282828; + background-color: #212121; } /********************** @@ -3662,12 +3689,12 @@ colorchooser .popover.osd:backdrop { decoration { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; margin: 8px; } decoration:backdrop { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; } .maximized decoration, @@ -3690,7 +3717,7 @@ decoration:backdrop { .csd.popup decoration { border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } tooltip.csd decoration { @@ -3706,7 +3733,7 @@ messagedialog.csd decoration { margin: 0; border-radius: 0; box-shadow: none; - background-color: #383838; + background-color: #353535; } .view selection, .view:selected, flowbox flowboxchild:selected, label selection, spinbutton:not(.vertical) selection, @@ -3754,7 +3781,7 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) border: solid 1px rgba(0, 0, 0, 0.26); border-radius: 3px; box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26); - background-color: #424242; + background-color: #3C3C3C; color: white; font-size: smaller; } @@ -3847,7 +3874,7 @@ popover.emoji-completion .emoji:hover { .nautilus-window, .nautilus-window notebook, .nautilus-window notebook > stack { - background-color: #303030; + background-color: #2C2C2C; } .nautilus-canvas-item.dim-label, @@ -3857,7 +3884,7 @@ popover.emoji-completion .emoji:hover { .nautilus-desktop.nautilus-canvas-item, .caja-desktop.caja-canvas-item, .nemo-desktop.nemo-canvas-item { color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } @keyframes nautilus-operations-button-needs-attention { @@ -3901,20 +3928,24 @@ popover.emoji-completion .emoji:hover { margin-right: 0; } -.path-bar-box .nautilus-path-bar button { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: 6px; padding-right: 6px; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 0; +} + +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):first-child { margin-left: 0; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):last-child { margin-right: 0; } -.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button.image-button image:not(:only-child) { margin: 0; } @@ -3925,8 +3956,7 @@ popover.emoji-completion .emoji:hover { border-width: 1px; border-color: rgba(255, 255, 255, 0.12); border-radius: 3px 3px 0 0; - background-color: rgba(48, 48, 48, 0.9); - background-clip: border-box; + background-color: rgba(60, 60, 60, 0.9); } .nautilus-window .floating-bar.bottom.left { @@ -3963,12 +3993,12 @@ popover.emoji-completion .emoji:hover { .search-information { padding: 2px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; color: white; } .conflict-row:not(:selected) { - background-color: #6d5a23; + background-color: #6b5f2e; } .nautilus-window flowboxchild .icon-item-background { @@ -4027,7 +4057,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .nautilus-window paned > separator { - background-color: #282828; + background-color: #2C2C2C; } /********* @@ -4039,7 +4069,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .open-document-selector-match { - background-color: #FBBC05; + background-color: #FDD633; color: rgba(0, 0, 0, 0.87); } @@ -4100,20 +4130,20 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .gedit-search-slider .linked:not(.vertical) > entry:not(.error) { - background-color: #424242; + background-color: #3C3C3C; } .gedit-search-slider .linked:not(.vertical) > entry.error ~ button { - color: rgba(255, 255, 255, 0.7); + color: rgba(0, 0, 0, 0.6); } .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:hover, .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:drop(active), .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:active { - color: white; + color: rgba(0, 0, 0, 0.87); } .gedit-search-slider .linked:not(.vertical) > entry.error ~ button:disabled { - color: rgba(255, 255, 255, 0.3); + color: rgba(0, 0, 0, 0.26); } .gedit-search-slider .linked > button { @@ -4155,16 +4185,16 @@ frame.gedit-map-frame > border:dir(rtl) { .tweak-group-white, .tweak-white, .tweak-white:hover { - background-image: image(#303030); + background-image: image(#2C2C2C); } .tweak-startup, .tweak-startup:hover { - background-image: image(#303030); + background-image: image(#2C2C2C); } .tweak-group-startup { - background-image: image(#303030); + background-image: image(#2C2C2C); border: 1px solid rgba(0, 0, 0, 0.26); } @@ -4208,7 +4238,7 @@ row#workspaces-only-on-primary { ***********/ layouttabbar { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } layouttabbar > box > button { @@ -4221,7 +4251,7 @@ layouttab { border-width: 1px; border-color: rgba(0, 0, 0, 0.26); box-shadow: inset 0 -2px #8AB4F8; - background-color: #303030; + background-color: #2C2C2C; } layouttab separator.vertical { @@ -4240,8 +4270,8 @@ layout { } entry.search-missing { - background-color: #EA4335; - color: white; + background-color: #F28B82; + color: rgba(0, 0, 0, 0.87); } window.workbench treeview.image { @@ -4287,7 +4317,7 @@ popover.omnibar list row:not(:last-child) { entry.preferences-search { border-bottom: 1px solid rgba(255, 255, 255, 0.12); box-shadow: none; - background-color: #303030; + background-color: #2C2C2C; } preferences stacksidebar.sidebar list { @@ -4352,13 +4382,13 @@ dockpaned { eggsearchbar box.search-bar { padding: 0 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } docktabstrip { padding: 0 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #282828; + background-color: #212121; } docktab { @@ -4393,7 +4423,7 @@ docktab:checked { } dockoverlayedge { - background-color: #282828; + background-color: #212121; } dockoverlayedge docktabstrip { @@ -4410,14 +4440,14 @@ dockoverlayedge.right-edge docktab:checked { } pillbox { - background-color: #282828; + background-color: #212121; border-radius: 2px; } layoutpane entry.search { border-bottom: 1px solid rgba(255, 255, 255, 0.12); box-shadow: none; - background-color: #303030; + background-color: #2C2C2C; } editortweak entry.search { @@ -4472,7 +4502,7 @@ idelayoutstackheader button:checked { ideeditorutilities > dzldockpaned > box > stackswitcher { padding: 8px 0; - background-color: #282828; + background-color: #212121; } ideeditorutilities > dzldockpaned > box > stackswitcher:dir(ltr) { @@ -4536,7 +4566,7 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: 9999px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #8AB4F8; color: rgba(0, 0, 0, 0.87); font-weight: bold; @@ -4572,7 +4602,7 @@ button.photos-filter-preview:checked { 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); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { @@ -4735,7 +4765,7 @@ list.categories { min-height: 24px; padding: 0 4px; border-radius: 2px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -4773,7 +4803,7 @@ button.title label { overlay > revealer.left > scrolledwindow.frame, overlay > revealer.right > scrolledwindow.frame { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } overlay > revealer.left > scrolledwindow.frame { @@ -4786,7 +4816,7 @@ overlay > revealer.right > scrolledwindow.frame { .terminix-session-sidebar, .tilix-session-sidebar { - background-image: image(#424242); + background-image: image(#3C3C3C); } .terminal-titlebar button { @@ -4797,11 +4827,20 @@ button.image-button.session-new-button { min-width: 32px; } +notebook.tilix-background tab > box > stack { + margin: -6px; +} + +button.flat.tilix-small-button { + min-height: 20px; + min-width: 16px; +} + /************** * Terminator * **************/ .terminator-terminal-window paned > separator { - background-color: #282828; + background-color: #212121; } .terminator-terminal-window notebook.frame { @@ -4836,38 +4875,47 @@ window.background > box.vertical > scrolledwindow > widget toolbar button { * Chromium * ************/ window.background.chromium { - background-color: #424242; + background-color: #3C3C3C; } window.background.chromium entry, -window.background.chromium > button:not(.suggested-action):not(.destructive-action) { - border: 1px solid rgba(0, 0, 0, 0.26); +window.background.chromium > button { + border: 1px solid rgba(255, 255, 255, 0.3); } window.background.chromium > button { - box-shadow: none; - background-size: auto; + color: #8AB4F8; } -window.background.chromium > button:hover, -window.background.chromium > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +window.background.chromium > button:disabled { + color: rgba(255, 255, 255, 0.3); } -window.background.chromium > button:active { - background-image: image(alpha(currentColor, 0.12)); +window.background.chromium menubar, +window.background.chromium headerbar { + color: rgba(255, 255, 255, 0.7); } window.background.chromium headerbar button:active { - background-size: 1000% 1000%; + background-color: alpha(currentColor, 0.12); } window.background.chromium spinner { color: #8AB4F8; } -window.background.chromium textview { - background-color: #424242; +window.background.chromium textview.view { + background-color: transparent; +} + +window.background.chromium treeview.view.cell:selected:focus { + background-color: #8AB4F8; + color: rgba(0, 0, 0, 0.87); +} + +window.background.chromium treeview.view button { + border: 1px solid rgba(255, 255, 255, 0.3); + background-color: #2C2C2C; } tooltip.background.chromium { @@ -4877,103 +4925,106 @@ tooltip.background.chromium { /*********** * Firefox * ***********/ -window.background:not(.csd) > widget > separator { - color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget text { + background-color: #3C3C3C; } -window.background:not(.csd) > widget > scrollbar { - background-clip: border-box; +#MozillaGtkWidget > widget text:selected { + background-color: #8AB4F8; + color: rgba(0, 0, 0, 0.87); } -window.background:not(.csd) > widget > scrollbar, -window.background:not(.csd) > widget > frame > border { - border-color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget > separator { + color: rgba(255, 255, 255, 0.12); } -window.background:not(.csd) > widget > entry, -window.background:not(.csd) > widget > button > button { - border: 1px solid rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget > frame > border { + border-color: rgba(255, 255, 255, 0.3); +} + +#MozillaGtkWidget > widget > entry, +#MozillaGtkWidget > widget > button > button { + border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 2px; box-shadow: none; } -window.background:not(.csd) > widget > entry { +#MozillaGtkWidget > widget > entry:disabled, +#MozillaGtkWidget > widget > button > button:disabled { + border-color: rgba(255, 255, 255, 0.12); +} + +#MozillaGtkWidget > widget > entry { min-height: 30px; - background-color: #303030; + background-color: #2C2C2C; } -window.background:not(.csd) > widget > entry:focus { +#MozillaGtkWidget > widget > entry:focus { border-color: #8AB4F8; box-shadow: inset 0 0 0 1px #8AB4F8; } -window.background:not(.csd) > widget > entry:disabled { +#MozillaGtkWidget > widget > entry:disabled { background-color: #2C2C2C; } -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > button > button { padding: 4px 8px; background-size: auto; } -window.background:not(.csd) > widget > button > button:hover, -window.background:not(.csd) > widget > button > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +#MozillaGtkWidget > widget > button > button:hover, +#MozillaGtkWidget > widget > button > button:drop(active) { + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); } -window.background:not(.csd) > widget > button > button:active { +#MozillaGtkWidget > widget > button > button:active { background-image: image(alpha(currentColor, 0.12)); } -window.background:not(.csd) > widget > checkbutton > check:not(:checked), -window.background:not(.csd) > widget > radiobutton > radio:not(:checked) { +#MozillaGtkWidget > widget > checkbutton > check, +#MozillaGtkWidget > widget > radiobutton > radio { + margin: 0; + padding: 0; +} + +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate), +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate) { color: #757575; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):hover, #MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):active, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):hover, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):active { color: #212121; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):disabled, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):disabled { color: rgba(117, 117, 117, 0.5); } -window.background:not(.csd) > window > menu, -window.background:not(.csd) > menu > menu { +#MozillaGtkWidget menu { border: none; } -text:selected { - background-color: #8AB4F8; - color: rgba(0, 0, 0, 0.87); -} - -window.background:not(.csd) > widget > menubar { +#MozillaGtkWidget > widget > menubar { color: rgba(255, 255, 255, 0.7); } -window.background:not(.csd) > widget > menubar:hover { +#MozillaGtkWidget > widget > menubar:hover { color: white; } -window.background:not(.csd) > widget > menubar:disabled { +#MozillaGtkWidget > widget > menubar:disabled { color: rgba(255, 255, 255, 0.3); } -window.background:not(.csd) > widget > frame { - color: rgba(0, 0, 0, 0.26); -} - -window.background:not(.csd) > widget > checkbutton > check, -window.background:not(.csd) > widget > radiobutton > radio { - margin: 0; - padding: 0; +#MozillaGtkWidget > widget > frame { + color: rgba(255, 255, 255, 0.3); } -window.background:not(.csd) > window.background > menu > separator { +#MozillaGtkWidget menu > separator { color: rgba(255, 255, 255, 0.12); } @@ -5080,12 +5131,12 @@ UnityDecoration .top { border-style: none; border-radius: 2px 2px 0 0; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #383838; + background-color: #353535; color: white; } UnityDecoration .top:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -5101,7 +5152,7 @@ UnityDecoration .menuitem:hover { .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .background:not(.csd) headerbar:not(.titlebar).inline-toolbar { @@ -5110,7 +5161,7 @@ UnityDecoration .menuitem:hover { UnityPanelWidget, .unity-panel { - background-color: #d6d6d6; + background-color: #1F1F1F; color: white; } @@ -5146,7 +5197,7 @@ UnityPanelWidget:backdrop, } .mate-panel-menu-bar { - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -5271,7 +5322,7 @@ PanelApplet.wnck-applet .wnck-pager:selected { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 3px; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } #MatePanelPopupWindow frame > border { @@ -5317,7 +5368,7 @@ na-tray-applet { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 3px; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } .mate-panel-applet-slider frame > border { @@ -5335,7 +5386,7 @@ na-tray-applet { #mate-menu { border: 1px solid rgba(0, 0, 0, 0.26); - background-color: #424242; + background-color: #3C3C3C; } #mate-menu button { @@ -5370,7 +5421,7 @@ na-tray-applet { .brisk-menu { box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } .brisk-menu entry { @@ -5441,6 +5492,10 @@ na-tray-applet { margin: 0 -1px 0 -2px; } +.caja-pathbar button.slider-button { + min-width: 24px; +} + .caja-pathbar button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -GtkArrow-arrow-scaling: 1; @@ -5448,7 +5503,7 @@ na-tray-applet { .caja-side-pane notebook viewport.frame, .caja-side-pane notebook widget .vertical { - background-color: #303030; + background-color: #2C2C2C; } .caja-side-pane notebook, @@ -5461,6 +5516,35 @@ na-tray-applet { border-style: none; } +.caja-canvas-item { + border-radius: 2px; +} + +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: 2px; + background-color: rgba(255, 255, 255, 0.04); + background-image: none; + color: white; +} + +.caja-desktop.view .entry:selected, +.caja-navigation-window .view .entry:selected { + background-color: rgba(138, 180, 248, 0.24); +} + +.caja-desktop.view .entry { + background-color: rgba(0, 0, 0, 0.3); + color: white; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); + caret-color: currentColor; +} + +.caja-desktop.view .entry:selected { + background-color: rgba(138, 180, 248, 0.24); +} + .caja-navigation-window statusbar { margin: 0 -10px; padding: 0 4px; @@ -5473,7 +5557,7 @@ na-tray-applet { #caja-extra-view-widget { border-bottom: 1px solid rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; } #caja-extra-view-widget > box > box > label { @@ -5539,14 +5623,18 @@ na-tray-applet { .lock-dialog { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 3px; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } .lock-dialog frame > border { border-style: none; } +.lock-dialog button:not(:disabled) { + color: #8AB4F8; +} + /* multimedia OSD */ MsdOsdWindow.background.osd { border-radius: 2px; @@ -5584,8 +5672,8 @@ MsdOsdWindow.background.osd .progressbar { border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: 3px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #3C3C3C; } .budgie-popover .container { @@ -5780,13 +5868,13 @@ MsdOsdWindow.background.osd .progressbar { .budgie-panel { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } .budgie-panel.transparent { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .budgie-panel button { @@ -5809,7 +5897,7 @@ MsdOsdWindow.background.osd .progressbar { } .budgie-panel .alert { - color: #EA4335; + color: #F28B82; } .budgie-panel .titlebar:not(headerbar) { @@ -5845,7 +5933,8 @@ MsdOsdWindow.background.osd .progressbar { color: rgba(255, 255, 255, 0.5); } -.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel popover.background.menu button.launcher:not(:checked):drop(active), popover.background.menu .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel popover.background button.launcher.model:not(:checked):drop(active), popover.background .budgie-panel button.launcher.model:not(:checked):drop(active), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel infobar.info button.launcher:not(:checked):drop(active), infobar.info .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel infobar.question button.launcher:not(:checked):drop(active), infobar.question .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lock-dialog button.launcher:not(:checked):drop(active), .lock-dialog .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lightdm-gtk-greeter button.launcher:not(:checked):drop(active), .lightdm-gtk-greeter .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):active { color: rgba(255, 255, 255, 0.7); } @@ -5892,7 +5981,7 @@ MsdOsdWindow.background.osd .progressbar { frame.raven-frame > border { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } .top frame.raven-frame > border { @@ -5912,7 +6001,7 @@ frame.raven-frame > border { } .raven { - background-color: #424242; + background-color: #3C3C3C; } .raven > box { @@ -5961,7 +6050,7 @@ frame.raven-frame > border { border-style: solid none; border-width: 1px; border-color: rgba(255, 255, 255, 0.12); - background-color: #303030; + background-color: #2C2C2C; } .raven .raven-background > overlay > widget > image { @@ -5991,7 +6080,7 @@ calendar.raven-calendar:selected { } .raven-mpris { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -6023,8 +6112,8 @@ calendar.raven-calendar:selected { margin: 5px 9px; padding: 3px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } .drop-shadow .linked > button { @@ -6034,7 +6123,7 @@ calendar.raven-calendar:selected { .budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog { border-radius: 2px; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + background-color: #3C3C3C; } .budgie-session-dialog decoration, .budgie-polkit-dialog decoration, .budgie-run-dialog decoration { @@ -6065,11 +6154,11 @@ calendar.raven-calendar:selected { } .budgie-polkit-dialog .failure { - color: #EA4335; + color: #F28B82; } .budgie-run-dialog { - background-color: #303030; + background-color: #2C2C2C; } .budgie-run-dialog entry.search { @@ -6092,7 +6181,7 @@ calendar.raven-calendar:selected { * Xfce4 Apps * **************/ .XfceHeading { - background-color: #303030; + background-color: #2C2C2C; } /*************** @@ -6100,7 +6189,7 @@ calendar.raven-calendar:selected { ***************/ .xfce4-panel.background { border: none; - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -6140,7 +6229,7 @@ XfdesktopIconView.view { border-radius: 2px; background-color: transparent; color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } XfdesktopIconView.view:active { @@ -6191,7 +6280,7 @@ XfdesktopIconView.view .rubberband { * LightDM GTK+ Greeter * ************************/ #panel_window { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; } @@ -6225,14 +6314,18 @@ XfdesktopIconView.view .rubberband { #restart_dialog { margin: 8px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #424242; + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #3C3C3C; } #content_frame { padding-bottom: 16px; } +.lightdm-gtk-greeter button:not(:disabled) { + color: #8AB4F8; +} + #buttonbox_frame { padding-top: 24px; } @@ -6285,7 +6378,7 @@ XfdesktopIconView.view .rubberband { } .places-treeview { - -NemoPlacesTreeView-disk-full-bg-color: dimgray; + -NemoPlacesTreeView-disk-full-bg-color: #646464; -NemoPlacesTreeView-disk-full-fg-color: #8AB4F8; -NemoPlacesTreeView-disk-full-bar-width: 2px; -NemoPlacesTreeView-disk-full-bar-radius: 0; @@ -6304,10 +6397,10 @@ text color for entries, views and content in general */ @define-color theme_text_color white; /* widget base background color */ -@define-color theme_bg_color #282828; +@define-color theme_bg_color #212121; /* text widgets and the like base background color */ -@define-color theme_base_color #303030; +@define-color theme_base_color #2C2C2C; /* base background color of selections */ @define-color theme_selected_bg_color #8AB4F8; @@ -6316,7 +6409,7 @@ text/foreground color of selections */ @define-color theme_selected_fg_color rgba(0, 0, 0, 0.87); /* base background color of insensitive widgets */ -@define-color insensitive_bg_color #282828; +@define-color insensitive_bg_color #212121; /* text foreground color of insensitive widgets */ @define-color insensitive_fg_color rgba(255, 255, 255, 0.5); @@ -6331,10 +6424,10 @@ text color for entries, views and content in general on backdrop windows */ @define-color theme_unfocused_text_color white; /* widget base background color on backdrop windows */ -@define-color theme_unfocused_bg_color #282828; +@define-color theme_unfocused_bg_color #212121; /* text widgets and the like base background color on backdrop windows */ -@define-color theme_unfocused_base_color #303030; +@define-color theme_unfocused_base_color #2C2C2C; /* base background color of selections on backdrop windows */ @define-color theme_unfocused_selected_bg_color #8AB4F8; @@ -6352,18 +6445,18 @@ widgets main borders color on backdrop windows */ @define-color unfocused_borders rgba(255, 255, 255, 0.12); /* these are pretty self explicative */ -@define-color warning_color #FBBC05; -@define-color error_color #EA4335; -@define-color success_color #34A853; +@define-color warning_color #FDD633; +@define-color error_color #F28B82; +@define-color success_color #81C995; /* these colors are exported for the window manager and shouldn't be used in applications, read if you used those and something break with a version upgrade you're on your own... */ @define-color wm_title white; @define-color wm_unfocused_title rgba(255, 255, 255, 0.7); @define-color wm_highlight rgba(255, 255, 255, 0.1); -@define-color wm_bg #383838; -@define-color wm_unfocused_bg #303030; +@define-color wm_bg #353535; +@define-color wm_unfocused_bg #2C2C2C; /* FIXME this is really an API */ -@define-color content_view_bg #303030; -@define-color placeholder_text_color #c1c1c1; +@define-color content_view_bg #2C2C2C; +@define-color placeholder_text_color silver; diff --git a/src/gtk/3.0/gtk-light-compact.css b/src/gtk/3.0/gtk-light-compact.css index 1845d1d12..09e5e30f5 100644 --- a/src/gtk/3.0/gtk-light-compact.css +++ b/src/gtk/3.0/gtk-light-compact.css @@ -12,17 +12,17 @@ @keyframes ripple-on-headerbar { from { - background-image: radial-gradient(circle, #4285F4 0%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 0%, transparent 0%); } to { - background-image: radial-gradient(circle, #4285F4 100%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 100%, transparent 0%); } } * { background-clip: padding-box; -GtkToolButton-icon-spacing: 0; - -GtkTextView-error-underline-color: #EA4335; + -GtkTextView-error-underline-color: #D93025; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 24; @@ -34,7 +34,7 @@ outline-color: transparent; outline-offset: -4px; -gtk-outline-radius: 2px; - -gtk-secondary-caret-color: #4285F4; + -gtk-secondary-caret-color: #1A73E8; } *:focus { @@ -80,7 +80,7 @@ } .gtkstyle-fallback:selected { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -94,7 +94,7 @@ } .view:selected:hover { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.08); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.08); } .view:disabled { @@ -111,7 +111,7 @@ textview text { textview border { background-color: #FAFAFA; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .rubberband, @@ -139,7 +139,7 @@ label { } label.separator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } label:disabled { @@ -152,8 +152,14 @@ button label:disabled { color: inherit; } +label.osd { + border-radius: 2px; + background-color: rgba(97, 97, 97, 0.9); + color: white; +} + .dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } assistant .sidebar { @@ -205,7 +211,7 @@ entry { border-radius: 2px 2px 0 0; caret-color: currentColor; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -213,7 +219,7 @@ entry { spinbutton:focus:not(.vertical), entry:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton:drop(active):not(.vertical), @@ -238,7 +244,7 @@ entry.flat { spinbutton:not(.vertical) image, entry image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, @@ -267,7 +273,7 @@ entry image.right { spinbutton:not(.vertical) undershoot.left, entry undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -278,7 +284,7 @@ entry undershoot.left { spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -289,15 +295,15 @@ entry undershoot.right { spinbutton.error:not(.vertical), entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #EA4335; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #D93025; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.error:focus:not(.vertical), entry.error:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.error:disabled:not(.vertical), @@ -310,15 +316,15 @@ entry.error:disabled { spinbutton.warning:not(.vertical), entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FBBC05; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #F4B400; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.warning:focus:not(.vertical), entry.warning:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.warning:disabled:not(.vertical), @@ -331,7 +337,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { margin: 2px -8px; - border-bottom: 2px solid #4285F4; + border-bottom: 2px solid #1A73E8; background-color: transparent; } @@ -339,22 +345,22 @@ spinbutton.vertical entry, .gedit-search-slider .linked:not(.vertical) > entry { border-radius: 2px; transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry:focus, .gedit-search-slider .linked:not(.vertical) > entry:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:drop(active), .gedit-search-slider .linked:not(.vertical) > entry:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) > entry:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -362,18 +368,18 @@ spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) spinbutton.vertical entry.error, .gedit-search-slider .linked:not(.vertical) > entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #EA4335; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #D93025; color: white; } spinbutton.vertical entry.error:focus, .gedit-search-slider .linked:not(.vertical) > entry.error:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.error:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -393,24 +399,24 @@ spinbutton.vertical entry.error image:disabled, .gedit-search-slider .linked:not spinbutton.vertical entry.warning, .gedit-search-slider .linked:not(.vertical) > entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #FBBC05; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.warning:focus, .gedit-search-slider .linked:not(.vertical) > entry.warning:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.warning:disabled, .gedit-search-slider .linked:not(.vertical) > entry.warning:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } spinbutton.vertical entry.warning image, .gedit-search-slider .linked:not(.vertical) > entry.warning image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.warning image:hover, .gedit-search-slider .linked:not(.vertical) > entry.warning image:hover, spinbutton.vertical entry.warning image:active, .gedit-search-slider .linked:not(.vertical) > entry.warning image:active { @@ -462,7 +468,7 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f } .entry-tag.button:not(:hover):not(:active), .button.documents-entry-tag:not(:hover):not(:active), .button.photos-entry-tag:not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /*********** @@ -470,10 +476,10 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f ***********/ @keyframes needs-attention { from { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } to { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#1A73E8), to(transparent)); } } @@ -486,7 +492,7 @@ button { font-weight: 500; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; - box-shadow: inset 0 0 0 9999px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: inset 0 0 0 9999px transparent, 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; @@ -497,20 +503,20 @@ button { button:focus { - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:hover, button:drop(active) { - box-shadow: inset 0 0 0 9999px transparent, 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px transparent, 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 5px 3px -3px rgba(0, 0, 0, 0.2), 0 8px 6px 1px rgba(0, 0, 0, 0.14), 0 3px 8.4px 2px rgba(0, 0, 0, 0.12); background-image: radial-gradient(circle, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; } @@ -524,7 +530,7 @@ button:disabled { button:checked { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -537,9 +543,9 @@ button:checked:disabled { modelbutton.flat, .menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, notebook > header > tabs > arrow, scrollbar button, check, -radio, calendar.button, button.sidebar-button, infobar.info button, infobar.question button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .lock-dialog button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, -.path-bar button, popover.background.menu button, -popover.background button.model, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, .nemo-window .toolbar button, +radio, calendar.button, button.sidebar-button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, +.path-bar.linked:not(.vertical) > button, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), popover.background.menu button, +popover.background button.model, actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, infobar.info button, infobar.question button, .lock-dialog button, .lightdm-gtk-greeter button, .nemo-window .toolbar button, button.flat { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; @@ -549,14 +555,14 @@ button.flat { background-repeat: no-repeat; background-position: center; background-size: 1000% 1000%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } modelbutton.flat:focus, .menuitem.button.flat:focus, spinbutton:not(.vertical) button:focus, spinbutton.vertical button:focus, notebook > header > tabs > arrow:focus, scrollbar button:focus, check:focus, -radio:focus, calendar.button:focus, button.sidebar-button:focus, infobar.info button:focus, infobar.question button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .lock-dialog button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, .lightdm-gtk-greeter button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, -.path-bar button:focus, popover.background.menu button:focus, -popover.background button.model:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, .nemo-window .toolbar button:focus, +radio:focus, calendar.button:focus, button.sidebar-button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, +.path-bar.linked:not(.vertical) > button:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), popover.background.menu button:focus, +popover.background button.model:focus, actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, infobar.info button:focus, infobar.question button:focus, .lock-dialog button:focus, .lightdm-gtk-greeter button:focus, .nemo-window .toolbar button:focus, button.flat:focus { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); color: rgba(0, 0, 0, 0.87); @@ -568,44 +574,50 @@ spinbutton:not(.vertical) button:drop(active), spinbutton.vertical button:hover, spinbutton.vertical button:drop(active), notebook > header > tabs > arrow:hover, scrollbar button:hover, scrollbar button:drop(active), check:hover, radio:hover, calendar.button:hover, button.sidebar-button:hover, -button.sidebar-button:drop(active), infobar.info button:hover, -infobar.info button:drop(active), infobar.question button:hover, -infobar.question button:drop(active), .gedit-search-slider .linked > button:hover, +button.sidebar-button:drop(active), .gedit-search-slider .linked > button:hover, .gedit-search-slider .linked > button:drop(active), popover.messagepopover .popover-action-area button:hover, popover.messagepopover .popover-action-area button:drop(active), #MatePanelPopupWindow button:hover, #MatePanelPopupWindow button:drop(active), #mate-menu button:hover, -#mate-menu button:drop(active), .lock-dialog button:hover, -.lock-dialog button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, +#mate-menu button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, .budgie-settings-window buttonbox.inline-toolbar button:drop(active), .drop-shadow button:hover, .drop-shadow button:drop(active), .budgie-session-dialog .linked.horizontal > button:hover, -.budgie-session-dialog .linked.horizontal > button:drop(active), .lightdm-gtk-greeter button:hover, -.lightdm-gtk-greeter button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), +.budgie-session-dialog .linked.horizontal > button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), combobox > .linked:not(.vertical) > button:not(:only-child):drop(active), .caja-pathbar button:hover, .caja-pathbar button:drop(active), -.path-bar button:hover, -.path-bar button:drop(active), popover.background.menu button:hover, -popover.background.menu button:drop(active), -popover.background button.model:hover, -popover.background button.model:drop(active), layouttabbar button:hover, +.path-bar.linked:not(.vertical) > button:hover, +.path-bar.linked:not(.vertical) > button:drop(active), layouttabbar button:hover, layouttabbar button:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven stackswitcher.linked > button:hover, .raven stackswitcher.linked > button:drop(active), .xfce4-panel.background button:hover, .xfce4-panel.background button:drop(active), toolbar button:hover, toolbar button:drop(active), .titlebar button:hover:not(.suggested-action):not(.destructive-action), -.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), +.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), popover.background.menu button:hover, +popover.background.menu button:drop(active), +popover.background button.model:hover, +popover.background button.model:drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):drop(active), .app-notification button:hover, .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:hover, messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:hover, -filechooser #pathbarbox > stack > box > button:drop(active), .nemo-window .toolbar button:hover, +filechooser #pathbarbox > stack > box > button:drop(active), infobar.info button:hover, +infobar.info button:drop(active), infobar.question button:hover, +infobar.question button:drop(active), .lock-dialog button:hover, +.lock-dialog button:drop(active), .lightdm-gtk-greeter button:hover, +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:hover, .nemo-window .toolbar button:drop(active), button.flat:hover, toolbar button:drop(active), .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), +popover.background.menu button:drop(active), +popover.background button.model:drop(active), actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:drop(active), +infobar.info button:drop(active), +infobar.question button:drop(active), +.lock-dialog button:drop(active), +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:drop(active), button.flat:drop(active) { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -614,9 +626,9 @@ button.flat:drop(active) { modelbutton.flat:active, .menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active, -radio:active, calendar.button:active, button.sidebar-button:active, infobar.info button:active, infobar.question button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .lock-dialog button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, -.path-bar button:active, popover.background.menu button:active, -popover.background button.model:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, +radio:active, calendar.button:active, button.sidebar-button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, +.path-bar.linked:not(.vertical) > button:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), popover.background.menu button:active, +popover.background button.model:active, actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, infobar.info button:active, infobar.question button:active, .lock-dialog button:active, .lightdm-gtk-greeter button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; @@ -628,9 +640,9 @@ button.flat:active { modelbutton.flat:disabled, .menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, -radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, infobar.info button:disabled, infobar.question button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .lock-dialog button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, -.path-bar button:disabled, popover.background.menu button:disabled, -popover.background button.model:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, .nemo-window .toolbar button:disabled, +radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, +.path-bar.linked:not(.vertical) > button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:disabled, +popover.background button.model:disabled, actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, infobar.info button:disabled, infobar.question button:disabled, .lock-dialog button:disabled, .lightdm-gtk-greeter button:disabled, .nemo-window .toolbar button:disabled, button.flat:disabled { box-shadow: none; background-color: transparent; @@ -638,16 +650,16 @@ button.flat:disabled { } combobox > .linked:not(.vertical) > button:checked:not(:only-child), .caja-pathbar button:checked, -.path-bar button:checked, popover.background.menu button:checked, -popover.background button.model:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background 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 button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, +.path-bar.linked:not(.vertical) > button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked, +popover.background button.model:checked, actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, infobar.info button:checked, infobar.question button:checked, .lock-dialog button:checked, .lightdm-gtk-greeter button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.87); } combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), .caja-pathbar button:checked:disabled, -.path-bar button:checked:disabled, popover.background.menu button:checked:disabled, -popover.background button.model:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .xfce4-panel.background 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 button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, +.path-bar.linked:not(.vertical) > 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, .xfce4-panel.background button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked:disabled, +popover.background button.model:checked:disabled, actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, infobar.info button:checked:disabled, infobar.question button:checked:disabled, .lock-dialog button:checked:disabled, .lightdm-gtk-greeter button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.38); @@ -660,7 +672,8 @@ button.text-button { padding-right: 16px; } -toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, .nemo-window .toolbar button.text-button, +toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), popover.background.menu button.text-button, +popover.background button.text-button.model, actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, infobar.info button.text-button, infobar.question button.text-button, .lock-dialog button.text-button, .lightdm-gtk-greeter button.text-button, .nemo-window .toolbar button.text-button, button.text-button.flat { min-width: 48px; padding-left: 8px; @@ -690,12 +703,12 @@ button.text-button.image-button label:last-child { margin-right: 12px; } -toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, +toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, popover.background.menu button.text-button.image-button label:first-child, popover.background button.text-button.image-button.model label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, infobar.info button.text-button.image-button label:first-child, infobar.question button.text-button.image-button label:first-child, .lock-dialog button.text-button.image-button label:first-child, .lightdm-gtk-greeter button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, button.text-button.image-button.flat label:first-child { margin-left: 8px; } -toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, +toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, popover.background.menu button.text-button.image-button label:last-child, popover.background button.text-button.image-button.model label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, infobar.info button.text-button.image-button label:last-child, infobar.question button.text-button.image-button label:last-child, .lock-dialog button.text-button.image-button label:last-child, .lightdm-gtk-greeter button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, button.text-button.image-button.flat label:last-child { margin-right: 8px; } @@ -705,13 +718,20 @@ button.text-button.image-button image:not(:only-child) { margin: 0 4px; } -toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), +toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child), +popover.background .linked:not(.vertical) > button.model:not(:only-child), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), infobar.info .linked:not(.vertical) > button:not(:only-child), infobar.question .linked:not(.vertical) > button:not(:only-child), .lock-dialog .linked:not(.vertical) > button:not(:only-child), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), toolbar .linked.vertical > button:not(:only-child), .titlebar .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child), +popover.background .linked.vertical > button.model:not(:only-child), actionbar > revealer > box .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > button:not(:only-child), messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child), filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child), +infobar.info .linked.vertical > button:not(:only-child), +infobar.question .linked.vertical > button:not(:only-child), +.lock-dialog .linked.vertical > button:not(:only-child), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child), .nemo-window .toolbar .linked.vertical > button:not(:only-child), .linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > @@ -719,39 +739,33 @@ button.flat:not(:only-child) { border-radius: 2px; } -toolbar .linked:not(.vertical) > button:not(:only-child).image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button, -toolbar .linked.vertical > button:not(:only-child).image-button, -.titlebar .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button, .linked:not(.vertical) > -button.flat:not(:only-child).image-button, +toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +popover.background .linked:not(.vertical) > button.model:not(:only-child).image-button:not(.text-button), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.info .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.question .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lock-dialog .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.titlebar .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child).image-button:not(.text-button), +popover.background .linked.vertical > button.model:not(:only-child).image-button:not(.text-button), +actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +.app-notification .linked.vertical > button:not(:only-child).image-button:not(.text-button), +messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button:not(.text-button), +filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.info .linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.question .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lock-dialog .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), .linked:not(.vertical) > +button.flat:not(:only-child).image-button:not(.text-button), .linked.vertical > -button.flat:not(:only-child).image-button { +button.flat:not(:only-child).image-button:not(.text-button) { border-radius: 9999px; } -toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).text-button.image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).text-button.image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).text-button.image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, -toolbar .linked.vertical > button:not(:only-child).text-button.image-button, -.titlebar .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).text-button.image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).text-button.image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).text-button.image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).text-button.image-button, .linked:not(.vertical) > -button.flat:not(:only-child).text-button.image-button, -.linked.vertical > -button.flat:not(:only-child).text-button.image-button { - border-radius: 2px; -} - infobar.error button.flat, .mate-panel-menu-bar button, .budgie-panel button, .raven-mpris button.image-button, .xfce4-panel.background button { color: rgba(255, 255, 255, 0.7); } -infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), +infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error popover.background.menu button:drop(active), popover.background.menu infobar.error button:drop(active), +infobar.error popover.background button.model:drop(active), popover.background infobar.error button.model:drop(active), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error infobar.info button:drop(active), infobar.info infobar.error button:drop(active), infobar.error infobar.question button:drop(active), infobar.question infobar.error button:drop(active), infobar.error .lock-dialog button:drop(active), .lock-dialog infobar.error button:drop(active), infobar.error .lightdm-gtk-greeter button:drop(active), .lightdm-gtk-greeter infobar.error button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), infobar.error button.flat:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven-mpris button.image-button:hover, @@ -785,7 +799,7 @@ button.osd:disabled { button.suggested-action { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -798,13 +812,13 @@ button.suggested-action:disabled { button.suggested-action:checked { - background-color: #7baaf7; + background-color: #5f9def; } button.suggested-action.flat { background-color: transparent; - color: #4285F4; + color: #1A73E8; } @@ -816,12 +830,12 @@ button.suggested-action.flat:disabled { button.suggested-action.flat:checked { - background-color: rgba(66, 133, 244, 0.3); + background-color: rgba(26, 115, 232, 0.3); } button.destructive-action { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -834,13 +848,13 @@ button.destructive-action:disabled { button.destructive-action:checked { - background-color: #f07b72; + background-color: #e46e66; } button.destructive-action.flat { background-color: transparent; - color: #EA4335; + color: #D93025; } @@ -852,7 +866,7 @@ button.destructive-action.flat:disabled { button.destructive-action.flat:checked { - background-color: rgba(234, 67, 53, 0.3); + background-color: rgba(217, 48, 37, 0.3); } .stack-switcher > @@ -882,7 +896,7 @@ button { button.image-button, .inline-toolbar button:not(.text-button), check, -radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked > button.disclosure-button:not(.suggested-action):not(.destructive-action), .nautilus-window headerbar revealer > button, .raven .expander-button, +radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked:not(.vertical) > button.disclosure-button:not(.suggested-action):not(.destructive-action):not(:only-child), .nautilus-window headerbar revealer > button, .raven .expander-button, button.close, button.circular { border-radius: 9999px; @@ -928,31 +942,31 @@ spinbutton:not(.vertical) button, notebook > header tab button.flat, button.side border-bottom-right-radius: 0; } -.linked:not(.vertical) > button.image-button:first-child { +.linked:not(.vertical) > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-bottom-left-radius: 2px; } -.linked:not(.vertical) > button.image-button:last-child { +.linked:not(.vertical) > button.image-button:last-child:not(.text-button) { border-top-right-radius: 2px; border-bottom-right-radius: 2px; } -.linked:not(.vertical) > button.image-button:only-child { +.linked:not(.vertical) > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } -.linked.vertical > button.image-button:first-child { +.linked.vertical > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-top-right-radius: 2px; } -.linked.vertical > button.image-button:last-child { +.linked.vertical > button.image-button:last-child:not(.text-button) { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } -.linked.vertical > button.image-button:only-child { +.linked.vertical > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } @@ -984,7 +998,7 @@ button.color { *********/ *:link, button.link:link, button.link:link:focus, button.link:link:hover, button.link:link:drop(active), button.link:link:active { - color: #4285F4; + color: #1A73E8; } *:visited, button.link:visited, button.link:visited:focus, button.link:visited:hover, @@ -1018,7 +1032,7 @@ spinbutton:not(.vertical) button { spinbutton:not(.vertical) button:focus:not(:hover):not(:active):not(:disabled) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) { @@ -1047,7 +1061,7 @@ spinbutton.vertical button { spinbutton.vertical button:focus:not(:hover):not(:active) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical button.up { @@ -1134,7 +1148,7 @@ button.combo:only-child { border-radius: 2px 2px 0 0; font-weight: normal; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -1150,7 +1164,7 @@ button.combo:only-child:drop(active) { } button.combo:only-child:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } button.combo:only-child:disabled { @@ -1176,12 +1190,12 @@ toolbar.osd, .app-notification, frame.documents-dropdown { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 4px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown { @@ -1259,7 +1273,7 @@ searchbar > revealer > box { .titlebar { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - 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.4); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #E0E0E0; color: rgba(0, 0, 0, 0.87); } @@ -1270,7 +1284,7 @@ searchbar > revealer > box { .titlebar:backdrop { background-color: #D6D6D6; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar:backdrop:disabled { @@ -1290,7 +1304,7 @@ searchbar > revealer > box { .titlebar .subtitle, .titlebar .dim-label { transition: color 75ms cubic-bezier(0, 0, 0.2, 1); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar .subtitle:backdrop, @@ -1320,7 +1334,7 @@ searchbar > revealer > box { } .titlebar entry image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar entry image:hover, .titlebar entry image:active { @@ -1336,8 +1350,8 @@ searchbar > revealer > box { } .titlebar button:not(.suggested-action):not(.destructive-action) { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; - color: rgba(0, 0, 0, 0.54); + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; + color: rgba(0, 0, 0, 0.6); } .titlebar button:not(.suggested-action):not(.destructive-action):focus, .titlebar button:not(.suggested-action):not(.destructive-action):hover, @@ -1349,13 +1363,13 @@ searchbar > revealer > box { color: rgba(0, 0, 0, 0.26); } -.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar 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; +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked { + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; background-color: transparent; color: rgba(0, 0, 0, 0.87); } -.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 button:not(.suggested-action):not(.destructive-action):checked:disabled { +.path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; color: rgba(0, 0, 0, 0.38); } @@ -1366,18 +1380,18 @@ searchbar > revealer > box { .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:focus, .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:hover, .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:drop(active), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:active { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:disabled { color: rgba(0, 0, 0, 0.26); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked { - color: rgba(0, 0, 0, 0.54); +.path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked { + color: rgba(0, 0, 0, 0.6); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { +.path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(0, 0, 0, 0.26); } @@ -1399,8 +1413,8 @@ searchbar > revealer > box { .titlebar.selection-mode { transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); animation: ripple-on-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; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.2); + background-color: #1A73E8; color: white; } @@ -1461,7 +1475,7 @@ searchbar > revealer > box { .titlebar .selection-mode { box-shadow: inset 0 1px rgba(255, 255, 255, 0.2); - background-color: #4285F4; + background-color: #1A73E8; } .tiled .titlebar, @@ -1472,7 +1486,7 @@ searchbar > revealer > box { .maximized .titlebar, .fullscreen .titlebar { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .titlebar.default-decoration { @@ -1500,7 +1514,7 @@ searchbar > revealer > box { .solid-csd .titlebar:dir(rtl), .solid-csd .titlebar:dir(ltr) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } headerbar { @@ -1540,41 +1554,41 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta * Pathbars * ************/ .caja-pathbar button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { padding-left: 4px; padding-right: 4px; - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 2px; } .caja-pathbar button:checked, -.path-bar button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; +.path-bar.linked:not(.vertical) > button:checked { + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } .caja-pathbar button:checked, .caja-pathbar button:checked:disabled, -.path-bar button:checked, -.path-bar button:checked:disabled { +.path-bar.linked:not(.vertical) > button:checked, +.path-bar.linked:not(.vertical) > button:checked:disabled { background-color: transparent; } .caja-pathbar button label:not(:only-child):first-child, -.path-bar button label:not(:only-child):first-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):first-child { margin-left: 0; } .caja-pathbar button label:not(:only-child):last-child, -.path-bar button label:not(:only-child):last-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):last-child { margin-right: 0; } .caja-pathbar button.text-button, -.path-bar button.text-button { +.path-bar.linked:not(.vertical) > button.text-button { min-width: 0; } .caja-pathbar button.slider-button, -.path-bar button.slider-button { +.path-bar.linked:not(.vertical) > button.slider-button { padding-left: 4px; padding-right: 4px; } @@ -1598,7 +1612,7 @@ treeview.view { treeview.view:selected { background-color: #FFFFFF; - background-image: image(rgba(66, 133, 244, 0.24)); + background-image: image(rgba(26, 115, 232, 0.24)); } treeview.view:hover, treeview.view:selected { @@ -1627,7 +1641,7 @@ treeview.view:drop(active).before { treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view.expander:dir(rtl) { @@ -1647,7 +1661,7 @@ treeview.view.expander:disabled { } treeview.view.progressbar { - border-bottom: 4px solid #4285F4; + border-bottom: 4px solid #1A73E8; box-shadow: none; background-color: transparent; background-image: none; @@ -1678,7 +1692,7 @@ treeview.view header button { } treeview.view header button:not(:focus):not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view header button, treeview.view header button:disabled { @@ -1699,11 +1713,11 @@ treeview.view header.button.dnd { box-shadow: none; background-color: #FFFFFF; background-clip: border-box; - color: #4285F4; + color: #1A73E8; } treeview.view acceleditor > label { - background-color: #4285F4; + background-color: #1A73E8; } /********* @@ -1720,7 +1734,7 @@ menubar, menubar:backdrop, .menubar:backdrop { background-color: #D6D6D6; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .csd menubar, .csd @@ -1733,7 +1747,7 @@ menubar > menuitem, transition: all 75ms cubic-bezier(0, 0, 0.2, 1); min-height: 20px; padding: 4px 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menubar > menuitem:hover, @@ -1835,7 +1849,7 @@ menu > arrow, min-width: 16px; padding: 4px; background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu > arrow.top, @@ -1879,7 +1893,7 @@ menu separator, } menuitem accelerator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menuitem:disabled accelerator { @@ -1892,12 +1906,12 @@ menuitem:disabled accelerator { popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } popover.background:backdrop { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); } popover.background, .csd popover.background { @@ -1953,7 +1967,7 @@ notebook.frame > header { } notebook:focus tab:checked { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.12); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.12); } notebook > header { @@ -1976,7 +1990,7 @@ notebook > header.top > tabs > tab { } notebook > header.top > tabs > tab:checked { - border-image-source: linear-gradient(to top, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to top, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.top > tabs > tab.reorderable-page { @@ -1996,7 +2010,7 @@ notebook > header.bottom > tabs > tab { } notebook > header.bottom > tabs > tab:checked { - border-image-source: linear-gradient(to bottom, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to bottom, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.bottom > tabs > tab.reorderable-page { @@ -2016,7 +2030,7 @@ notebook > header.left > tabs > tab { } notebook > header.left > tabs > tab:checked { - border-image-source: linear-gradient(to left, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to left, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.left > tabs > tab.reorderable-page { @@ -2036,7 +2050,7 @@ notebook > header.right > tabs > tab { } notebook > header.right > tabs > tab:checked { - border-image-source: linear-gradient(to right, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to right, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.right > tabs > tab.reorderable-page { @@ -2103,12 +2117,12 @@ notebook > header tab { border-width: 1px; border-color: transparent; outline: none; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; background-clip: border-box; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -2199,7 +2213,6 @@ notebook > stack:not(:only-child) { scrollbar { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); background-color: #FFFFFF; - background-clip: padding-box; } * { @@ -2234,7 +2247,7 @@ scrollbar slider { } scrollbar slider:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } scrollbar slider:active { @@ -2355,7 +2368,7 @@ switch { } switch:checked { - background-color: rgba(66, 133, 244, 0.5); + background-color: rgba(26, 115, 232, 0.5); } switch:disabled { @@ -2374,25 +2387,25 @@ switch slider { 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); + box-shadow: 0 0 0 10px transparent, 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; } switch:focus slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:focus:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:checked slider { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } /************************* @@ -2407,13 +2420,13 @@ switch:checked slider { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list):hover, .view.content-view.check:not(list):active, .content-view .tile check:not(list):hover, .content-view .tile check:not(list):active { - -gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + -gtk-icon-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 3px rgba(0, 0, 0, 0.14), 0 1px 6px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list), @@ -2452,7 +2465,7 @@ radio { check:checked, check:indeterminate, radio:checked, radio:indeterminate { - color: #4285F4; + color: #1A73E8; } check:checked:disabled, check:indeterminate:disabled, @@ -2475,7 +2488,7 @@ radio:disabled { popover modelbutton.flat check:not(:checked):not(:indeterminate):not(:disabled), popover modelbutton.flat radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover modelbutton.flat check.left:dir(rtl), popover modelbutton.flat @@ -2509,7 +2522,7 @@ radio:dir(rtl) { menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem @@ -2548,12 +2561,12 @@ radio:indeterminate { radio { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } radio:checked:not(:indeterminate) { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#1A73E8), to(transparent)); } @@ -2561,7 +2574,7 @@ radio:checked:not(:indeterminate):disabled { border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(0, 0, 0, 0.26)), to(transparent)); } -window.background:not(.csd) > widget > checkbutton > check, +#MozillaGtkWidget > widget > checkbutton > check, menu menuitem check { min-height: 16px; min-width: 16px; @@ -2569,17 +2582,17 @@ menu menuitem check { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:checked, +#MozillaGtkWidget > widget > checkbutton > check:checked, menu menuitem check:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:indeterminate, +#MozillaGtkWidget > widget > checkbutton > check:indeterminate, menu menuitem check:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio, +#MozillaGtkWidget > widget > radiobutton > radio, menu menuitem radio { min-height: 16px; min-width: 16px; @@ -2587,12 +2600,12 @@ menu menuitem radio { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:checked, +#MozillaGtkWidget > widget > radiobutton > radio:checked, menu menuitem radio:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:indeterminate, +#MozillaGtkWidget > widget > radiobutton > radio:indeterminate, menu menuitem radio:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")); } @@ -2611,7 +2624,7 @@ treeview.view radio:selected { treeview.view check, treeview.view radio { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view check:hover, treeview.view check:active, @@ -2628,7 +2641,7 @@ treeview.view radio:disabled { treeview.view check:checked, treeview.view check:indeterminate, treeview.view radio:checked, treeview.view radio:indeterminate { - color: #4285F4; + color: #1A73E8; } treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled, @@ -2692,7 +2705,7 @@ scale trough:disabled { scale highlight { transition: background-image 75ms cubic-bezier(0, 0, 0.2, 1); - background-image: image(#4285F4); + background-image: image(#1A73E8); } scale highlight:disabled { @@ -2715,7 +2728,7 @@ scale slider { background-position: center; background-size: auto, 1000% 1000%; border-radius: 50%; - color: #4285F4; + color: #1A73E8; } scale slider { @@ -2748,7 +2761,7 @@ scale slider:active { scale marks, scale value { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } scale indicator { @@ -2890,7 +2903,7 @@ scale.color.vertical:dir(rtl) slider { * Progress bars * *****************/ progressbar { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } @@ -2909,7 +2922,7 @@ progressbar trough { } progressbar progress { - background-color: #4285F4; + background-color: #1A73E8; } progressbar trough.empty progress { @@ -2944,15 +2957,15 @@ levelbar.vertical.discrete block:not(:last-child) { } levelbar block.low { - background-color: #FBBC05; + background-color: #F4B400; } levelbar block.high, levelbar block:not(.empty) { - background-color: #4285F4; + background-color: #1A73E8; } levelbar block.full { - background-color: #34A853; + background-color: #0F9D58; } levelbar block.empty { @@ -3007,7 +3020,7 @@ scrolledwindow viewport.frame { } overshoot.top { - background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center top; background-color: transparent; @@ -3016,7 +3029,7 @@ overshoot.top { } overshoot.bottom { - background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center bottom; background-color: transparent; @@ -3025,7 +3038,7 @@ overshoot.bottom { } overshoot.left { - background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: left center; background-color: transparent; @@ -3034,7 +3047,7 @@ overshoot.left { } overshoot.right { - background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: right center; background-color: transparent; @@ -3044,7 +3057,7 @@ overshoot.right { undershoot.top { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-top: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3054,7 +3067,7 @@ undershoot.top { undershoot.bottom { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-bottom: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3064,7 +3077,7 @@ undershoot.bottom { undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3074,7 +3087,7 @@ undershoot.left { undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3135,7 +3148,8 @@ row.activatable:focus, treeview.view header button:focus, .budgie-popover.budgie } row.activatable:hover, treeview.view header button:hover, -treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), +treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu popover.background.menu button:not(.image-button):drop(active), popover.background.menu .budgie-popover.budgie-menu button:not(.image-button):drop(active), +.budgie-popover.budgie-menu popover.background button.model:not(.image-button):drop(active), popover.background .budgie-popover.budgie-menu button.model:not(.image-button):drop(active), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.info button:not(.image-button):drop(active), infobar.info .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.question button:not(.image-button):drop(active), infobar.question .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lock-dialog button:not(.image-button):drop(active), .lock-dialog .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lightdm-gtk-greeter button:not(.image-button):drop(active), .lightdm-gtk-greeter .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu button.flat:not(.image-button):drop(active) { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 0ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -3150,7 +3164,7 @@ row.activatable.has-open-popup, treeview.view header button.has-open-popup, .bud } row:selected { - color: #4285F4; + color: #1A73E8; } row:selected image, @@ -3175,6 +3189,10 @@ row:selected:disabled label { margin: 8px; } +.app-notification button.text-button:not(:disabled) { + color: #1A73E8; +} + .app-notification.frame, .app-notification border { border-style: none; @@ -3189,7 +3207,7 @@ expander title > arrow { min-height: 16px; -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } expander title > arrow:dir(rtl) { @@ -3232,7 +3250,7 @@ calendar.header { } calendar.highlight { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -3257,7 +3275,7 @@ messagedialog .titlebar { messagedialog .titlebar:backdrop { background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } messagedialog.csd.background { @@ -3275,11 +3293,11 @@ messagedialog.csd .dialog-action-box button:not(:last-child) { } messagedialog.csd .dialog-action-box button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } messagedialog.csd .dialog-action-box button.destructive-action:not(:disabled) { - color: #EA4335; + color: #D93025; } filechooser .dialog-action-box { @@ -3330,6 +3348,7 @@ stacksidebar.sidebar row { stacksidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } @@ -3351,7 +3370,12 @@ separator.sidebar { * File chooser * ****************/ row image.sidebar-icon { - color: rgba(0, 0, 0, 0.54); + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); + color: rgba(0, 0, 0, 0.6); +} + +row image.sidebar-icon:disabled { + color: rgba(0, 0, 0, 0.26); } placessidebar.sidebar > viewport.frame { @@ -3375,9 +3399,14 @@ placessidebar.sidebar row > revealer { placessidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } +placessidebar.sidebar row:selected image.sidebar-icon { + color: #1A73E8; +} + placessidebar.sidebar row:disabled { color: rgba(0, 0, 0, 0.38); } @@ -3390,6 +3419,10 @@ placessidebar.sidebar row image.sidebar-icon:dir(rtl) { padding-left: 8px; } +placessidebar.sidebar row label.sidebar-label { + color: inherit; +} + placessidebar.sidebar row label.sidebar-label:dir(ltr) { padding-right: 2px; } @@ -3398,17 +3431,16 @@ placessidebar.sidebar row label.sidebar-label:dir(rtl) { padding-left: 2px; } -placessidebar.sidebar row:selected image.sidebar-icon, -placessidebar.sidebar row:selected label.sidebar-label { - color: inherit; -} - placessidebar.sidebar row.sidebar-placeholder-row { background-color: alpha(currentColor, 0.08); } placessidebar.sidebar row.sidebar-new-bookmark-row { - color: #4285F4; + color: #1A73E8; +} + +placessidebar.sidebar row.sidebar-new-bookmark-row image.sidebar-icon { + color: #1A73E8; } placesview .server-list-button > image { @@ -3495,17 +3527,12 @@ infobar.info, infobar.question { background-color: #FFFFFF; } -infobar.info button.text-button, infobar.question button.text-button { - padding-left: 8px; - padding-right: 8px; -} - infobar.info button.text-button:not(:disabled), infobar.question button.text-button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } infobar.warning { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -3514,7 +3541,7 @@ infobar.warning *:link, infobar.warning button.link:link { } infobar.error { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -3598,15 +3625,15 @@ colorswatch.light { colorswatch overlay { transition: box-shadow 75ms 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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } colorswatch overlay:hover { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch overlay:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch#add-color-button { @@ -3641,12 +3668,12 @@ colorswatch#editor-color-sample overlay { colorchooser .popover.osd { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } colorchooser .popover.osd:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } /******** @@ -3662,12 +3689,12 @@ colorchooser .popover.osd:backdrop { decoration { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; margin: 8px; } decoration:backdrop { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; } .maximized decoration, @@ -3690,7 +3717,7 @@ decoration:backdrop { .csd.popup decoration { border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } tooltip.csd decoration { @@ -3712,7 +3739,7 @@ messagedialog.csd decoration { .view selection, .view:selected, flowbox flowboxchild:selected, label selection, spinbutton:not(.vertical) selection, entry selection, modelbutton.flat:selected, .menuitem.button.flat:selected, row:selected, calendar:selected, .nautilus-window flowboxchild:selected .icon-item-background, box.vertical > widget > widget:selected, .budgie-popover.budgie-menu button.flat:not(.image-button):checked, calendar.raven-calendar:selected, XfdesktopIconView.view:active, .nemo-window .nemo-window-pane widget.entry:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); } .monospace { @@ -3723,7 +3750,7 @@ entry selection, modelbutton.flat:selected, * Touch Copy & Paste * **********************/ cursor-handle { - color: #4285F4; + color: #1A73E8; -gtk-icon-source: -gtk-recolor(url("assets/scalable/cursor-handle-symbolic.svg")); } @@ -3760,7 +3787,7 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) } :not(decoration):not(window):drop(active) { - caret-color: #4285F4; + caret-color: #1A73E8; } stackswitcher button.text-button { @@ -3801,7 +3828,7 @@ button.emoji-section { } button.emoji-section:checked { - color: #4285F4; + color: #1A73E8; } button.emoji-section:not(:last-child) { @@ -3852,12 +3879,12 @@ popover.emoji-completion .emoji:hover { .nautilus-canvas-item.dim-label, .nautilus-list-dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-desktop.nautilus-canvas-item, .caja-desktop.caja-canvas-item, .nemo-desktop.nemo-canvas-item { color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } @keyframes nautilus-operations-button-needs-attention { @@ -3901,20 +3928,24 @@ popover.emoji-completion .emoji:hover { margin-right: 0; } -.path-bar-box .nautilus-path-bar button { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: 4px; padding-right: 4px; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 0; +} + +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):first-child { margin-left: 0; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):last-child { margin-right: 0; } -.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button.image-button image:not(:only-child) { margin: 0; } @@ -3926,7 +3957,6 @@ popover.emoji-completion .emoji:hover { border-color: rgba(0, 0, 0, 0.12); border-radius: 3px 3px 0 0; background-color: rgba(255, 255, 255, 0.9); - background-clip: padding-box; } .nautilus-window .floating-bar.bottom.left { @@ -3951,8 +3981,8 @@ popover.emoji-completion .emoji:hover { } .disk-space-display.used { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } .disk-space-display.free { @@ -3968,7 +3998,7 @@ popover.emoji-completion .emoji:hover { } .conflict-row:not(:selected) { - background-color: #feebb4; + background-color: #fce9b3; } .nautilus-window flowboxchild .icon-item-background { @@ -4023,23 +4053,23 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .nautilus-menu-sort-heading:disabled { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-window paned > separator { - background-color: #F2F2F2; + background-color: #FAFAFA; } /********* * gedit * *********/ .open-document-selector-path-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } .open-document-selector-match { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -4070,7 +4100,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: .gedit-search-slider .linked:not(.vertical) > entry .gedit-search-entry-occurrences-tag { all: unset; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .gedit-search-slider .linked:not(.vertical) > entry:dir(ltr) { @@ -4220,7 +4250,7 @@ layouttab { border-style: none solid; border-width: 1px; border-color: rgba(0, 0, 0, 0.12); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: #FFFFFF; } @@ -4240,12 +4270,12 @@ layout { } entry.search-missing { - background-color: #EA4335; + background-color: #D93025; color: white; } window.workbench treeview.image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.popover-selector list { @@ -4277,7 +4307,7 @@ omnibar.linked:not(.vertical) entry { } omnibar:not(:hover):not(:active) entry { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.omnibar list row:not(:last-child) { @@ -4370,11 +4400,11 @@ docktab { border-width: 1px; border-color: transparent; box-shadow: inset 0 -2px transparent; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -4385,7 +4415,7 @@ docktab:hover { docktab:checked { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 225ms cubic-bezier(0, 0, 0.2, 1), background-image 525ms cubic-bezier(0, 0, 0.2, 1); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-size: 1000% 1000%; @@ -4402,11 +4432,11 @@ dockoverlayedge docktabstrip { } dockoverlayedge.left-edge docktab:checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } dockoverlayedge.right-edge docktab:checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } pillbox { @@ -4490,7 +4520,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button { } ideeditorutilities > dzldockpaned > box > stackswitcher button:active { - background-image: radial-gradient(circle, rgba(66, 133, 244, 0.7) 10%, transparent 0%); + background-image: radial-gradient(circle, rgba(26, 115, 232, 0.7) 10%, transparent 0%); } ideeditorutilities > dzldockpaned > box > stackswitcher button:checked { @@ -4503,7 +4533,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { @@ -4511,7 +4541,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } ideeditorsidebar notebook header { @@ -4536,8 +4566,8 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: 9999px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #4285F4; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #1A73E8; color: white; font-weight: bold; } @@ -4566,13 +4596,13 @@ button.photos-filter-preview { } button.photos-filter-preview:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); 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); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { @@ -4605,11 +4635,11 @@ overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) { } .side-panel .view:selected { - background-image: image(#4285F4); + background-image: image(#1A73E8); } .side-panel .view:selected:hover { - background-image: image(#518ff5); + background-image: image(#2c7eea); } .songs-list:hover { @@ -4735,7 +4765,7 @@ list.categories { min-height: 24px; padding: 0 4px; border-radius: 2px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -4773,7 +4803,7 @@ button.title label { overlay > revealer.left > scrolledwindow.frame, overlay > revealer.right > scrolledwindow.frame { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } overlay > revealer.left > scrolledwindow.frame { @@ -4797,6 +4827,15 @@ button.image-button.session-new-button { min-width: 28px; } +notebook.tilix-background tab > box > stack { + margin: -6px; +} + +button.flat.tilix-small-button { + min-height: 16px; + min-width: 12px; +} + /************** * Terminator * **************/ @@ -4836,37 +4875,46 @@ window.background > box.vertical > scrolledwindow > widget toolbar button { * Chromium * ************/ window.background.chromium { - background-color: #F2F2F2; + background-color: #FFFFFF; } window.background.chromium entry, -window.background.chromium > button:not(.suggested-action):not(.destructive-action) { +window.background.chromium > button { border: 1px solid rgba(0, 0, 0, 0.26); } window.background.chromium > button { - box-shadow: none; - background-size: auto; + color: #1A73E8; } -window.background.chromium > button:hover, -window.background.chromium > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +window.background.chromium > button:disabled { + color: rgba(0, 0, 0, 0.26); } -window.background.chromium > button:active { - background-image: image(alpha(currentColor, 0.12)); +window.background.chromium menubar, +window.background.chromium headerbar { + color: rgba(0, 0, 0, 0.6); } window.background.chromium headerbar button:active { - background-size: 1000% 1000%; + background-color: alpha(currentColor, 0.12); } window.background.chromium spinner { - color: #4285F4; + color: #1A73E8; } -window.background.chromium textview { +window.background.chromium textview.view { + background-color: transparent; +} + +window.background.chromium treeview.view.cell:selected:focus { + background-color: #1A73E8; + color: white; +} + +window.background.chromium treeview.view button { + border: 1px solid rgba(0, 0, 0, 0.26); background-color: #FFFFFF; } @@ -4877,103 +4925,106 @@ tooltip.background.chromium { /*********** * Firefox * ***********/ -window.background:not(.csd) > widget > separator { - color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget text { + background-color: #FFFFFF; } -window.background:not(.csd) > widget > scrollbar { - background-clip: border-box; +#MozillaGtkWidget > widget text:selected { + background-color: #1A73E8; + color: white; +} + +#MozillaGtkWidget > widget > separator { + color: rgba(0, 0, 0, 0.12); } -window.background:not(.csd) > widget > scrollbar, -window.background:not(.csd) > widget > frame > border { +#MozillaGtkWidget > widget > frame > border { border-color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > entry, -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > entry, +#MozillaGtkWidget > widget > button > button { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 2px; box-shadow: none; } -window.background:not(.csd) > widget > entry { +#MozillaGtkWidget > widget > entry:disabled, +#MozillaGtkWidget > widget > button > button:disabled { + border-color: rgba(0, 0, 0, 0.12); +} + +#MozillaGtkWidget > widget > entry { min-height: 30px; background-color: #FFFFFF; } -window.background:not(.csd) > widget > entry:focus { - border-color: #4285F4; - box-shadow: inset 0 0 0 1px #4285F4; +#MozillaGtkWidget > widget > entry:focus { + border-color: #1A73E8; + box-shadow: inset 0 0 0 1px #1A73E8; } -window.background:not(.csd) > widget > entry:disabled { +#MozillaGtkWidget > widget > entry:disabled { background-color: #FAFAFA; } -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > button > button { padding: 4px 8px; background-size: auto; } -window.background:not(.csd) > widget > button > button:hover, -window.background:not(.csd) > widget > button > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +#MozillaGtkWidget > widget > button > button:hover, +#MozillaGtkWidget > widget > button > button:drop(active) { + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); } -window.background:not(.csd) > widget > button > button:active { +#MozillaGtkWidget > widget > button > button:active { background-image: image(alpha(currentColor, 0.12)); } -window.background:not(.csd) > widget > checkbutton > check:not(:checked), -window.background:not(.csd) > widget > radiobutton > radio:not(:checked) { +#MozillaGtkWidget > widget > checkbutton > check, +#MozillaGtkWidget > widget > radiobutton > radio { + margin: 0; + padding: 0; +} + +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate), +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate) { color: #757575; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):hover, #MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):active, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):hover, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):active { color: #212121; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):disabled, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):disabled { color: rgba(117, 117, 117, 0.5); } -window.background:not(.csd) > window > menu, -window.background:not(.csd) > menu > menu { +#MozillaGtkWidget menu { border: none; } -text:selected { - background-color: #4285F4; - color: white; +#MozillaGtkWidget > widget > menubar { + color: rgba(0, 0, 0, 0.6); } -window.background:not(.csd) > widget > menubar { - color: rgba(0, 0, 0, 0.54); -} - -window.background:not(.csd) > widget > menubar:hover { +#MozillaGtkWidget > widget > menubar:hover { color: rgba(0, 0, 0, 0.87); } -window.background:not(.csd) > widget > menubar:disabled { +#MozillaGtkWidget > widget > menubar:disabled { color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > frame { +#MozillaGtkWidget > widget > frame { color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > checkbutton > check, -window.background:not(.csd) > widget > radiobutton > radio { - margin: 0; - padding: 0; -} - -window.background:not(.csd) > window.background > menu > separator { +#MozillaGtkWidget menu > separator { color: rgba(0, 0, 0, 0.12); } @@ -5069,7 +5120,7 @@ UnityDecoration { -UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32); -UnityDecoration-inactive-shadow-radius: 6px; -UnityDecoration-glow-size: 8px; - -UnityDecoration-glow-color: #4285F4; + -UnityDecoration-glow-color: #1A73E8; -UnityDecoration-title-indent: 4px; -UnityDecoration-title-fade: 32px; -UnityDecoration-title-alignment: 0.0; @@ -5086,22 +5137,22 @@ UnityDecoration .top { UnityDecoration .top:backdrop { background-color: #D6D6D6; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } UnityDecoration .menuitem { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } UnityDecoration .menuitem:hover { - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; color: rgba(0, 0, 0, 0.87); } .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .background:not(.csd) headerbar:not(.titlebar).inline-toolbar { @@ -5110,23 +5161,23 @@ UnityDecoration .menuitem:hover { UnityPanelWidget, .unity-panel { - background-color: #d6d6d6; + background-color: #CCCCCC; color: rgba(0, 0, 0, 0.87); } UnityPanelWidget:backdrop, .unity-panel:backdrop { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .unity-panel.menuitem, .unity-panel .menuitem { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .unity-panel.menubar.menuitem:hover, .unity-panel.menubar .menuitem *:hover { - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; color: rgba(0, 0, 0, 0.87); } @@ -5134,7 +5185,7 @@ UnityPanelWidget:backdrop, .menu IdoPlaybackMenuItem.menuitem:active { -gtk-icon-source: -gtk-icontheme("process-working-symbolic"); animation: spin 1s linear infinite; - color: #4285F4; + color: #1A73E8; } /************** @@ -5146,7 +5197,7 @@ UnityPanelWidget:backdrop, } .mate-panel-menu-bar { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -5256,7 +5307,7 @@ PanelApplet.wnck-applet .wnck-pager:active { } PanelApplet.wnck-applet .wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } .mate-panel-menu-bar.horizontal #clock-applet-button label { @@ -5352,7 +5403,7 @@ na-tray-applet { #mate-menu button image, #mate-menu button label + label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } #mate-menu entry { @@ -5400,7 +5451,7 @@ na-tray-applet { } .brisk-menu .categories-list button:checked { - color: #4285F4; + color: #1A73E8; } .brisk-menu .session-button { @@ -5441,6 +5492,10 @@ na-tray-applet { margin: 0 -1px 0 -2px; } +.caja-pathbar button.slider-button { + min-width: 24px; +} + .caja-pathbar button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -GtkArrow-arrow-scaling: 1; @@ -5461,6 +5516,35 @@ na-tray-applet { border-style: none; } +.caja-canvas-item { + border-radius: 2px; +} + +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.04); + background-image: none; + color: rgba(0, 0, 0, 0.87); +} + +.caja-desktop.view .entry:selected, +.caja-navigation-window .view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + +.caja-desktop.view .entry { + background-color: rgba(0, 0, 0, 0.3); + color: white; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); + caret-color: currentColor; +} + +.caja-desktop.view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + .caja-navigation-window statusbar { margin: 0 -10px; padding: 0 4px; @@ -5539,7 +5623,7 @@ na-tray-applet { .lock-dialog { border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 3px; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -5547,6 +5631,10 @@ na-tray-applet { border-style: none; } +.lock-dialog button:not(:disabled) { + color: #1A73E8; +} + /* multimedia OSD */ MsdOsdWindow.background.osd { border-radius: 2px; @@ -5561,7 +5649,7 @@ MsdOsdWindow.background.osd .trough { MsdOsdWindow.background.osd .progressbar { border-radius: 0; - background-color: #4285F4; + background-color: #1A73E8; } /****************** @@ -5584,7 +5672,7 @@ MsdOsdWindow.background.osd .progressbar { border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: 3px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } @@ -5780,13 +5868,13 @@ MsdOsdWindow.background.osd .progressbar { .budgie-panel { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.7); font-weight: 500; } .budgie-panel.transparent { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .budgie-panel button { @@ -5809,7 +5897,7 @@ MsdOsdWindow.background.osd .progressbar { } .budgie-panel .alert { - color: #EA4335; + color: #D93025; } .budgie-panel .titlebar:not(headerbar) { @@ -5845,7 +5933,8 @@ MsdOsdWindow.background.osd .progressbar { color: rgba(255, 255, 255, 0.5); } -.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel popover.background.menu button.launcher:not(:checked):drop(active), popover.background.menu .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel popover.background button.launcher.model:not(:checked):drop(active), popover.background .budgie-panel button.launcher.model:not(:checked):drop(active), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel infobar.info button.launcher:not(:checked):drop(active), infobar.info .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel infobar.question button.launcher:not(:checked):drop(active), infobar.question .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lock-dialog button.launcher:not(:checked):drop(active), .lock-dialog .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lightdm-gtk-greeter button.launcher:not(:checked):drop(active), .lightdm-gtk-greeter .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):active { color: rgba(255, 255, 255, 0.7); } @@ -5892,7 +5981,7 @@ MsdOsdWindow.background.osd .progressbar { frame.raven-frame > border { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } .top frame.raven-frame > border { @@ -5920,12 +6009,12 @@ frame.raven-frame > border { } .raven stackswitcher.linked > button { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 0; } .raven stackswitcher.linked > button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; background-color: transparent; } @@ -5991,7 +6080,7 @@ calendar.raven-calendar:selected { } .raven-mpris { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -6012,7 +6101,7 @@ calendar.raven-calendar:selected { } .budgie-notification .notification-body, .budgie-switcher .notification-body { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-osd .budgie-osd-text { @@ -6023,7 +6112,7 @@ calendar.raven-calendar:selected { margin: 5px 9px; padding: 3px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6061,11 +6150,11 @@ calendar.raven-calendar:selected { } .budgie-polkit-dialog .message { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-polkit-dialog .failure { - color: #EA4335; + color: #D93025; } .budgie-run-dialog { @@ -6100,7 +6189,7 @@ calendar.raven-calendar:selected { ***************/ .xfce4-panel.background { border: none; - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -6133,14 +6222,14 @@ wnck-pager:active { } wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } XfdesktopIconView.view { border-radius: 2px; background-color: transparent; color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } XfdesktopIconView.view:active { @@ -6191,7 +6280,7 @@ XfdesktopIconView.view .rubberband { * LightDM GTK+ Greeter * ************************/ #panel_window { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; } @@ -6225,7 +6314,7 @@ XfdesktopIconView.view .rubberband { #restart_dialog { margin: 8px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6233,6 +6322,10 @@ XfdesktopIconView.view .rubberband { padding-bottom: 16px; } +.lightdm-gtk-greeter button:not(:disabled) { + color: #1A73E8; +} + #buttonbox_frame { padding-top: 24px; } @@ -6286,7 +6379,7 @@ XfdesktopIconView.view .rubberband { .places-treeview { -NemoPlacesTreeView-disk-full-bg-color: rgba(182, 182, 182, 0.961); - -NemoPlacesTreeView-disk-full-fg-color: #4285F4; + -NemoPlacesTreeView-disk-full-fg-color: #1A73E8; -NemoPlacesTreeView-disk-full-bar-width: 2px; -NemoPlacesTreeView-disk-full-bar-radius: 0; -NemoPlacesTreeView-disk-full-bottom-padding: 1px; @@ -6310,7 +6403,7 @@ text widgets and the like base background color */ @define-color theme_base_color #FFFFFF; /* base background color of selections */ -@define-color theme_selected_bg_color #4285F4; +@define-color theme_selected_bg_color #1A73E8; /* text/foreground color of selections */ @define-color theme_selected_fg_color white; @@ -6337,7 +6430,7 @@ text widgets and the like base background color on backdrop windows */ @define-color theme_unfocused_base_color #FFFFFF; /* base background color of selections on backdrop windows */ -@define-color theme_unfocused_selected_bg_color #4285F4; +@define-color theme_unfocused_selected_bg_color #1A73E8; /* text/foreground color of selections on backdrop windows */ @define-color theme_unfocused_selected_fg_color white; @@ -6352,18 +6445,18 @@ widgets main borders color on backdrop windows */ @define-color unfocused_borders rgba(0, 0, 0, 0.12); /* these are pretty self explicative */ -@define-color warning_color #FBBC05; -@define-color error_color #EA4335; -@define-color success_color #34A853; +@define-color warning_color #F4B400; +@define-color error_color #D93025; +@define-color success_color #0F9D58; /* these colors are exported for the window manager and shouldn't be used in applications, read if you used those and something break with a version upgrade you're on your own... */ @define-color wm_title rgba(0, 0, 0, 0.87); -@define-color wm_unfocused_title rgba(0, 0, 0, 0.54); +@define-color wm_unfocused_title rgba(0, 0, 0, 0.6); @define-color wm_highlight rgba(255, 255, 255, 0.4); @define-color wm_bg #E0E0E0; @define-color wm_unfocused_bg #D6D6D6; /* FIXME this is really an API */ @define-color content_view_bg #FFFFFF; -@define-color placeholder_text_color #757575; +@define-color placeholder_text_color #666666; diff --git a/src/gtk/3.0/gtk-light.css b/src/gtk/3.0/gtk-light.css index d99f5b392..16064d0a6 100644 --- a/src/gtk/3.0/gtk-light.css +++ b/src/gtk/3.0/gtk-light.css @@ -12,17 +12,17 @@ @keyframes ripple-on-headerbar { from { - background-image: radial-gradient(circle, #4285F4 0%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 0%, transparent 0%); } to { - background-image: radial-gradient(circle, #4285F4 100%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 100%, transparent 0%); } } * { background-clip: padding-box; -GtkToolButton-icon-spacing: 0; - -GtkTextView-error-underline-color: #EA4335; + -GtkTextView-error-underline-color: #D93025; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 24; @@ -34,7 +34,7 @@ outline-color: transparent; outline-offset: -4px; -gtk-outline-radius: 2px; - -gtk-secondary-caret-color: #4285F4; + -gtk-secondary-caret-color: #1A73E8; } *:focus { @@ -80,7 +80,7 @@ } .gtkstyle-fallback:selected { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -94,7 +94,7 @@ } .view:selected:hover { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.08); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.08); } .view:disabled { @@ -111,7 +111,7 @@ textview text { textview border { background-color: #FAFAFA; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .rubberband, @@ -139,7 +139,7 @@ label { } label.separator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } label:disabled { @@ -152,8 +152,14 @@ button label:disabled { color: inherit; } +label.osd { + border-radius: 2px; + background-color: rgba(97, 97, 97, 0.9); + color: white; +} + .dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } assistant .sidebar { @@ -205,7 +211,7 @@ entry { border-radius: 2px 2px 0 0; caret-color: currentColor; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -213,7 +219,7 @@ entry { spinbutton:focus:not(.vertical), entry:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton:drop(active):not(.vertical), @@ -238,7 +244,7 @@ entry.flat { spinbutton:not(.vertical) image, entry image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, @@ -267,7 +273,7 @@ entry image.right { spinbutton:not(.vertical) undershoot.left, entry undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -278,7 +284,7 @@ entry undershoot.left { spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -289,15 +295,15 @@ entry undershoot.right { spinbutton.error:not(.vertical), entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #EA4335; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #D93025; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.error:focus:not(.vertical), entry.error:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.error:disabled:not(.vertical), @@ -310,15 +316,15 @@ entry.error:disabled { spinbutton.warning:not(.vertical), entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FBBC05; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #F4B400; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.warning:focus:not(.vertical), entry.warning:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.warning:disabled:not(.vertical), @@ -331,7 +337,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { margin: 2px -8px; - border-bottom: 2px solid #4285F4; + border-bottom: 2px solid #1A73E8; background-color: transparent; } @@ -339,22 +345,22 @@ spinbutton.vertical entry, .gedit-search-slider .linked:not(.vertical) > entry { border-radius: 2px; transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry:focus, .gedit-search-slider .linked:not(.vertical) > entry:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:drop(active), .gedit-search-slider .linked:not(.vertical) > entry:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) > entry:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -362,18 +368,18 @@ spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) spinbutton.vertical entry.error, .gedit-search-slider .linked:not(.vertical) > entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #EA4335; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #D93025; color: white; } spinbutton.vertical entry.error:focus, .gedit-search-slider .linked:not(.vertical) > entry.error:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.error:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -393,24 +399,24 @@ spinbutton.vertical entry.error image:disabled, .gedit-search-slider .linked:not spinbutton.vertical entry.warning, .gedit-search-slider .linked:not(.vertical) > entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #FBBC05; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.warning:focus, .gedit-search-slider .linked:not(.vertical) > entry.warning:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.warning:disabled, .gedit-search-slider .linked:not(.vertical) > entry.warning:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } spinbutton.vertical entry.warning image, .gedit-search-slider .linked:not(.vertical) > entry.warning image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.warning image:hover, .gedit-search-slider .linked:not(.vertical) > entry.warning image:hover, spinbutton.vertical entry.warning image:active, .gedit-search-slider .linked:not(.vertical) > entry.warning image:active { @@ -462,7 +468,7 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f } .entry-tag.button:not(:hover):not(:active), .button.documents-entry-tag:not(:hover):not(:active), .button.photos-entry-tag:not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /*********** @@ -470,10 +476,10 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f ***********/ @keyframes needs-attention { from { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } to { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#1A73E8), to(transparent)); } } @@ -486,7 +492,7 @@ button { font-weight: 500; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; - box-shadow: inset 0 0 0 9999px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: inset 0 0 0 9999px transparent, 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; @@ -497,20 +503,20 @@ button { button:focus { - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:hover, button:drop(active) { - box-shadow: inset 0 0 0 9999px transparent, 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px transparent, 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 5px 3px -3px rgba(0, 0, 0, 0.2), 0 8px 6px 1px rgba(0, 0, 0, 0.14), 0 3px 8.4px 2px rgba(0, 0, 0, 0.12); background-image: radial-gradient(circle, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; } @@ -524,7 +530,7 @@ button:disabled { button:checked { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -537,9 +543,9 @@ button:checked:disabled { modelbutton.flat, .menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, notebook > header > tabs > arrow, scrollbar button, check, -radio, calendar.button, button.sidebar-button, infobar.info button, infobar.question button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .lock-dialog button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, -.path-bar button, popover.background.menu button, -popover.background button.model, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, .nemo-window .toolbar button, +radio, calendar.button, button.sidebar-button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, +.path-bar.linked:not(.vertical) > button, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), popover.background.menu button, +popover.background button.model, actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, infobar.info button, infobar.question button, .lock-dialog button, .lightdm-gtk-greeter button, .nemo-window .toolbar button, button.flat { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; @@ -549,14 +555,14 @@ button.flat { background-repeat: no-repeat; background-position: center; background-size: 1000% 1000%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } modelbutton.flat:focus, .menuitem.button.flat:focus, spinbutton:not(.vertical) button:focus, spinbutton.vertical button:focus, notebook > header > tabs > arrow:focus, scrollbar button:focus, check:focus, -radio:focus, calendar.button:focus, button.sidebar-button:focus, infobar.info button:focus, infobar.question button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .lock-dialog button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, .lightdm-gtk-greeter button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, -.path-bar button:focus, popover.background.menu button:focus, -popover.background button.model:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, .nemo-window .toolbar button:focus, +radio:focus, calendar.button:focus, button.sidebar-button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, +.path-bar.linked:not(.vertical) > button:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), popover.background.menu button:focus, +popover.background button.model:focus, actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, infobar.info button:focus, infobar.question button:focus, .lock-dialog button:focus, .lightdm-gtk-greeter button:focus, .nemo-window .toolbar button:focus, button.flat:focus { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); color: rgba(0, 0, 0, 0.87); @@ -568,44 +574,50 @@ spinbutton:not(.vertical) button:drop(active), spinbutton.vertical button:hover, spinbutton.vertical button:drop(active), notebook > header > tabs > arrow:hover, scrollbar button:hover, scrollbar button:drop(active), check:hover, radio:hover, calendar.button:hover, button.sidebar-button:hover, -button.sidebar-button:drop(active), infobar.info button:hover, -infobar.info button:drop(active), infobar.question button:hover, -infobar.question button:drop(active), .gedit-search-slider .linked > button:hover, +button.sidebar-button:drop(active), .gedit-search-slider .linked > button:hover, .gedit-search-slider .linked > button:drop(active), popover.messagepopover .popover-action-area button:hover, popover.messagepopover .popover-action-area button:drop(active), #MatePanelPopupWindow button:hover, #MatePanelPopupWindow button:drop(active), #mate-menu button:hover, -#mate-menu button:drop(active), .lock-dialog button:hover, -.lock-dialog button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, +#mate-menu button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, .budgie-settings-window buttonbox.inline-toolbar button:drop(active), .drop-shadow button:hover, .drop-shadow button:drop(active), .budgie-session-dialog .linked.horizontal > button:hover, -.budgie-session-dialog .linked.horizontal > button:drop(active), .lightdm-gtk-greeter button:hover, -.lightdm-gtk-greeter button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), +.budgie-session-dialog .linked.horizontal > button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), combobox > .linked:not(.vertical) > button:not(:only-child):drop(active), .caja-pathbar button:hover, .caja-pathbar button:drop(active), -.path-bar button:hover, -.path-bar button:drop(active), popover.background.menu button:hover, -popover.background.menu button:drop(active), -popover.background button.model:hover, -popover.background button.model:drop(active), layouttabbar button:hover, +.path-bar.linked:not(.vertical) > button:hover, +.path-bar.linked:not(.vertical) > button:drop(active), layouttabbar button:hover, layouttabbar button:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven stackswitcher.linked > button:hover, .raven stackswitcher.linked > button:drop(active), .xfce4-panel.background button:hover, .xfce4-panel.background button:drop(active), toolbar button:hover, toolbar button:drop(active), .titlebar button:hover:not(.suggested-action):not(.destructive-action), -.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), +.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), popover.background.menu button:hover, +popover.background.menu button:drop(active), +popover.background button.model:hover, +popover.background button.model:drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):drop(active), .app-notification button:hover, .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:hover, messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:hover, -filechooser #pathbarbox > stack > box > button:drop(active), .nemo-window .toolbar button:hover, +filechooser #pathbarbox > stack > box > button:drop(active), infobar.info button:hover, +infobar.info button:drop(active), infobar.question button:hover, +infobar.question button:drop(active), .lock-dialog button:hover, +.lock-dialog button:drop(active), .lightdm-gtk-greeter button:hover, +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:hover, .nemo-window .toolbar button:drop(active), button.flat:hover, toolbar button:drop(active), .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), +popover.background.menu button:drop(active), +popover.background button.model:drop(active), actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:drop(active), +infobar.info button:drop(active), +infobar.question button:drop(active), +.lock-dialog button:drop(active), +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:drop(active), button.flat:drop(active) { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -614,9 +626,9 @@ button.flat:drop(active) { modelbutton.flat:active, .menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active, -radio:active, calendar.button:active, button.sidebar-button:active, infobar.info button:active, infobar.question button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .lock-dialog button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, -.path-bar button:active, popover.background.menu button:active, -popover.background button.model:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, +radio:active, calendar.button:active, button.sidebar-button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, +.path-bar.linked:not(.vertical) > button:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), popover.background.menu button:active, +popover.background button.model:active, actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, infobar.info button:active, infobar.question button:active, .lock-dialog button:active, .lightdm-gtk-greeter button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; @@ -628,9 +640,9 @@ button.flat:active { modelbutton.flat:disabled, .menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, -radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, infobar.info button:disabled, infobar.question button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .lock-dialog button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, -.path-bar button:disabled, popover.background.menu button:disabled, -popover.background button.model:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, .nemo-window .toolbar button:disabled, +radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, +.path-bar.linked:not(.vertical) > button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:disabled, +popover.background button.model:disabled, actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, infobar.info button:disabled, infobar.question button:disabled, .lock-dialog button:disabled, .lightdm-gtk-greeter button:disabled, .nemo-window .toolbar button:disabled, button.flat:disabled { box-shadow: none; background-color: transparent; @@ -638,16 +650,16 @@ button.flat:disabled { } combobox > .linked:not(.vertical) > button:checked:not(:only-child), .caja-pathbar button:checked, -.path-bar button:checked, popover.background.menu button:checked, -popover.background button.model:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background 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 button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, +.path-bar.linked:not(.vertical) > button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked, +popover.background button.model:checked, actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, infobar.info button:checked, infobar.question button:checked, .lock-dialog button:checked, .lightdm-gtk-greeter button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.87); } combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), .caja-pathbar button:checked:disabled, -.path-bar button:checked:disabled, popover.background.menu button:checked:disabled, -popover.background button.model:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .xfce4-panel.background 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 button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, +.path-bar.linked:not(.vertical) > 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, .xfce4-panel.background button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked:disabled, +popover.background button.model:checked:disabled, actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, infobar.info button:checked:disabled, infobar.question button:checked:disabled, .lock-dialog button:checked:disabled, .lightdm-gtk-greeter button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.38); @@ -660,7 +672,8 @@ button.text-button { padding-right: 16px; } -toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, .nemo-window .toolbar button.text-button, +toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), popover.background.menu button.text-button, +popover.background button.text-button.model, actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, infobar.info button.text-button, infobar.question button.text-button, .lock-dialog button.text-button, .lightdm-gtk-greeter button.text-button, .nemo-window .toolbar button.text-button, button.text-button.flat { min-width: 48px; padding-left: 8px; @@ -690,12 +703,12 @@ button.text-button.image-button label:last-child { margin-right: 10px; } -toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, +toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, popover.background.menu button.text-button.image-button label:first-child, popover.background button.text-button.image-button.model label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, infobar.info button.text-button.image-button label:first-child, infobar.question button.text-button.image-button label:first-child, .lock-dialog button.text-button.image-button label:first-child, .lightdm-gtk-greeter button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, button.text-button.image-button.flat label:first-child { margin-left: 6px; } -toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, +toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, popover.background.menu button.text-button.image-button label:last-child, popover.background button.text-button.image-button.model label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, infobar.info button.text-button.image-button label:last-child, infobar.question button.text-button.image-button label:last-child, .lock-dialog button.text-button.image-button label:last-child, .lightdm-gtk-greeter button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, button.text-button.image-button.flat label:last-child { margin-right: 6px; } @@ -705,13 +718,20 @@ button.text-button.image-button image:not(:only-child) { margin: 0 4px; } -toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), +toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child), +popover.background .linked:not(.vertical) > button.model:not(:only-child), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), infobar.info .linked:not(.vertical) > button:not(:only-child), infobar.question .linked:not(.vertical) > button:not(:only-child), .lock-dialog .linked:not(.vertical) > button:not(:only-child), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), toolbar .linked.vertical > button:not(:only-child), .titlebar .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child), +popover.background .linked.vertical > button.model:not(:only-child), actionbar > revealer > box .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > button:not(:only-child), messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child), filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child), +infobar.info .linked.vertical > button:not(:only-child), +infobar.question .linked.vertical > button:not(:only-child), +.lock-dialog .linked.vertical > button:not(:only-child), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child), .nemo-window .toolbar .linked.vertical > button:not(:only-child), .linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > @@ -719,39 +739,33 @@ button.flat:not(:only-child) { border-radius: 2px; } -toolbar .linked:not(.vertical) > button:not(:only-child).image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button, -toolbar .linked.vertical > button:not(:only-child).image-button, -.titlebar .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button, .linked:not(.vertical) > -button.flat:not(:only-child).image-button, +toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +popover.background .linked:not(.vertical) > button.model:not(:only-child).image-button:not(.text-button), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.info .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.question .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lock-dialog .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.titlebar .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child).image-button:not(.text-button), +popover.background .linked.vertical > button.model:not(:only-child).image-button:not(.text-button), +actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +.app-notification .linked.vertical > button:not(:only-child).image-button:not(.text-button), +messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button:not(.text-button), +filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.info .linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.question .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lock-dialog .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), .linked:not(.vertical) > +button.flat:not(:only-child).image-button:not(.text-button), .linked.vertical > -button.flat:not(:only-child).image-button { +button.flat:not(:only-child).image-button:not(.text-button) { border-radius: 9999px; } -toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).text-button.image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).text-button.image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).text-button.image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, -toolbar .linked.vertical > button:not(:only-child).text-button.image-button, -.titlebar .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).text-button.image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).text-button.image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).text-button.image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).text-button.image-button, .linked:not(.vertical) > -button.flat:not(:only-child).text-button.image-button, -.linked.vertical > -button.flat:not(:only-child).text-button.image-button { - border-radius: 2px; -} - infobar.error button.flat, .mate-panel-menu-bar button, .budgie-panel button, .raven-mpris button.image-button, .xfce4-panel.background button { color: rgba(255, 255, 255, 0.7); } -infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), +infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error popover.background.menu button:drop(active), popover.background.menu infobar.error button:drop(active), +infobar.error popover.background button.model:drop(active), popover.background infobar.error button.model:drop(active), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error infobar.info button:drop(active), infobar.info infobar.error button:drop(active), infobar.error infobar.question button:drop(active), infobar.question infobar.error button:drop(active), infobar.error .lock-dialog button:drop(active), .lock-dialog infobar.error button:drop(active), infobar.error .lightdm-gtk-greeter button:drop(active), .lightdm-gtk-greeter infobar.error button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), infobar.error button.flat:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven-mpris button.image-button:hover, @@ -785,7 +799,7 @@ button.osd:disabled { button.suggested-action { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -798,13 +812,13 @@ button.suggested-action:disabled { button.suggested-action:checked { - background-color: #7baaf7; + background-color: #5f9def; } button.suggested-action.flat { background-color: transparent; - color: #4285F4; + color: #1A73E8; } @@ -816,12 +830,12 @@ button.suggested-action.flat:disabled { button.suggested-action.flat:checked { - background-color: rgba(66, 133, 244, 0.3); + background-color: rgba(26, 115, 232, 0.3); } button.destructive-action { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -834,13 +848,13 @@ button.destructive-action:disabled { button.destructive-action:checked { - background-color: #f07b72; + background-color: #e46e66; } button.destructive-action.flat { background-color: transparent; - color: #EA4335; + color: #D93025; } @@ -852,7 +866,7 @@ button.destructive-action.flat:disabled { button.destructive-action.flat:checked { - background-color: rgba(234, 67, 53, 0.3); + background-color: rgba(217, 48, 37, 0.3); } .stack-switcher > @@ -882,7 +896,7 @@ button { button.image-button, .inline-toolbar button:not(.text-button), check, -radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked > button.disclosure-button:not(.suggested-action):not(.destructive-action), .nautilus-window headerbar revealer > button, .raven .expander-button, +radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked:not(.vertical) > button.disclosure-button:not(.suggested-action):not(.destructive-action):not(:only-child), .nautilus-window headerbar revealer > button, .raven .expander-button, button.close, button.circular { border-radius: 9999px; @@ -928,31 +942,31 @@ spinbutton:not(.vertical) button, notebook > header tab button.flat, button.side border-bottom-right-radius: 0; } -.linked:not(.vertical) > button.image-button:first-child { +.linked:not(.vertical) > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-bottom-left-radius: 2px; } -.linked:not(.vertical) > button.image-button:last-child { +.linked:not(.vertical) > button.image-button:last-child:not(.text-button) { border-top-right-radius: 2px; border-bottom-right-radius: 2px; } -.linked:not(.vertical) > button.image-button:only-child { +.linked:not(.vertical) > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } -.linked.vertical > button.image-button:first-child { +.linked.vertical > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-top-right-radius: 2px; } -.linked.vertical > button.image-button:last-child { +.linked.vertical > button.image-button:last-child:not(.text-button) { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } -.linked.vertical > button.image-button:only-child { +.linked.vertical > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } @@ -984,7 +998,7 @@ button.color { *********/ *:link, button.link:link, button.link:link:focus, button.link:link:hover, button.link:link:drop(active), button.link:link:active { - color: #4285F4; + color: #1A73E8; } *:visited, button.link:visited, button.link:visited:focus, button.link:visited:hover, @@ -1018,7 +1032,7 @@ spinbutton:not(.vertical) button { spinbutton:not(.vertical) button:focus:not(:hover):not(:active):not(:disabled) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) { @@ -1047,7 +1061,7 @@ spinbutton.vertical button { spinbutton.vertical button:focus:not(:hover):not(:active) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical button.up { @@ -1134,7 +1148,7 @@ button.combo:only-child { border-radius: 2px 2px 0 0; font-weight: normal; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -1150,7 +1164,7 @@ button.combo:only-child:drop(active) { } button.combo:only-child:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } button.combo:only-child:disabled { @@ -1176,12 +1190,12 @@ toolbar.osd, .app-notification, frame.documents-dropdown { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown { @@ -1259,7 +1273,7 @@ searchbar > revealer > box { .titlebar { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - 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.4); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #E0E0E0; color: rgba(0, 0, 0, 0.87); } @@ -1270,7 +1284,7 @@ searchbar > revealer > box { .titlebar:backdrop { background-color: #D6D6D6; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar:backdrop:disabled { @@ -1290,7 +1304,7 @@ searchbar > revealer > box { .titlebar .subtitle, .titlebar .dim-label { transition: color 75ms cubic-bezier(0, 0, 0.2, 1); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar .subtitle:backdrop, @@ -1320,7 +1334,7 @@ searchbar > revealer > box { } .titlebar entry image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar entry image:hover, .titlebar entry image:active { @@ -1336,8 +1350,8 @@ searchbar > revealer > box { } .titlebar button:not(.suggested-action):not(.destructive-action) { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; - color: rgba(0, 0, 0, 0.54); + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; + color: rgba(0, 0, 0, 0.6); } .titlebar button:not(.suggested-action):not(.destructive-action):focus, .titlebar button:not(.suggested-action):not(.destructive-action):hover, @@ -1349,13 +1363,13 @@ searchbar > revealer > box { color: rgba(0, 0, 0, 0.26); } -.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar 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; +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked { + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; background-color: transparent; color: rgba(0, 0, 0, 0.87); } -.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 button:not(.suggested-action):not(.destructive-action):checked:disabled { +.path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; color: rgba(0, 0, 0, 0.38); } @@ -1366,18 +1380,18 @@ searchbar > revealer > box { .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:focus, .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:hover, .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:drop(active), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:active { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:disabled { color: rgba(0, 0, 0, 0.26); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked { - color: rgba(0, 0, 0, 0.54); +.path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked { + color: rgba(0, 0, 0, 0.6); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { +.path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(0, 0, 0, 0.26); } @@ -1399,8 +1413,8 @@ searchbar > revealer > box { .titlebar.selection-mode { transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); animation: ripple-on-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; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.2); + background-color: #1A73E8; color: white; } @@ -1461,7 +1475,7 @@ searchbar > revealer > box { .titlebar .selection-mode { box-shadow: inset 0 1px rgba(255, 255, 255, 0.2); - background-color: #4285F4; + background-color: #1A73E8; } .tiled .titlebar, @@ -1472,7 +1486,7 @@ searchbar > revealer > box { .maximized .titlebar, .fullscreen .titlebar { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .titlebar.default-decoration { @@ -1500,7 +1514,7 @@ searchbar > revealer > box { .solid-csd .titlebar:dir(rtl), .solid-csd .titlebar:dir(ltr) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } headerbar { @@ -1540,41 +1554,41 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta * Pathbars * ************/ .caja-pathbar button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { padding-left: 6px; padding-right: 6px; - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 2px; } .caja-pathbar button:checked, -.path-bar button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; +.path-bar.linked:not(.vertical) > button:checked { + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } .caja-pathbar button:checked, .caja-pathbar button:checked:disabled, -.path-bar button:checked, -.path-bar button:checked:disabled { +.path-bar.linked:not(.vertical) > button:checked, +.path-bar.linked:not(.vertical) > button:checked:disabled { background-color: transparent; } .caja-pathbar button label:not(:only-child):first-child, -.path-bar button label:not(:only-child):first-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):first-child { margin-left: 0; } .caja-pathbar button label:not(:only-child):last-child, -.path-bar button label:not(:only-child):last-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):last-child { margin-right: 0; } .caja-pathbar button.text-button, -.path-bar button.text-button { +.path-bar.linked:not(.vertical) > button.text-button { min-width: 0; } .caja-pathbar button.slider-button, -.path-bar button.slider-button { +.path-bar.linked:not(.vertical) > button.slider-button { padding-left: 4px; padding-right: 4px; } @@ -1598,7 +1612,7 @@ treeview.view { treeview.view:selected { background-color: #FFFFFF; - background-image: image(rgba(66, 133, 244, 0.24)); + background-image: image(rgba(26, 115, 232, 0.24)); } treeview.view:hover, treeview.view:selected { @@ -1627,7 +1641,7 @@ treeview.view:drop(active).before { treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view.expander:dir(rtl) { @@ -1647,7 +1661,7 @@ treeview.view.expander:disabled { } treeview.view.progressbar { - border-bottom: 4px solid #4285F4; + border-bottom: 4px solid #1A73E8; box-shadow: none; background-color: transparent; background-image: none; @@ -1678,7 +1692,7 @@ treeview.view header button { } treeview.view header button:not(:focus):not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view header button, treeview.view header button:disabled { @@ -1699,11 +1713,11 @@ treeview.view header.button.dnd { box-shadow: none; background-color: #FFFFFF; background-clip: border-box; - color: #4285F4; + color: #1A73E8; } treeview.view acceleditor > label { - background-color: #4285F4; + background-color: #1A73E8; } /********* @@ -1720,7 +1734,7 @@ menubar, menubar:backdrop, .menubar:backdrop { background-color: #D6D6D6; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .csd menubar, .csd @@ -1733,7 +1747,7 @@ menubar > menuitem, transition: all 75ms cubic-bezier(0, 0, 0.2, 1); min-height: 20px; padding: 4px 8px; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menubar > menuitem:hover, @@ -1835,7 +1849,7 @@ menu > arrow, min-width: 16px; padding: 4px; background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu > arrow.top, @@ -1879,7 +1893,7 @@ menu separator, } menuitem accelerator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menuitem:disabled accelerator { @@ -1892,12 +1906,12 @@ menuitem:disabled accelerator { popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } popover.background:backdrop { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); } popover.background, .csd popover.background { @@ -1953,7 +1967,7 @@ notebook.frame > header { } notebook:focus tab:checked { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.12); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.12); } notebook > header { @@ -1976,7 +1990,7 @@ notebook > header.top > tabs > tab { } notebook > header.top > tabs > tab:checked { - border-image-source: linear-gradient(to top, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to top, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.top > tabs > tab.reorderable-page { @@ -1996,7 +2010,7 @@ notebook > header.bottom > tabs > tab { } notebook > header.bottom > tabs > tab:checked { - border-image-source: linear-gradient(to bottom, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to bottom, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.bottom > tabs > tab.reorderable-page { @@ -2016,7 +2030,7 @@ notebook > header.left > tabs > tab { } notebook > header.left > tabs > tab:checked { - border-image-source: linear-gradient(to left, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to left, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.left > tabs > tab.reorderable-page { @@ -2036,7 +2050,7 @@ notebook > header.right > tabs > tab { } notebook > header.right > tabs > tab:checked { - border-image-source: linear-gradient(to right, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to right, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.right > tabs > tab.reorderable-page { @@ -2103,12 +2117,12 @@ notebook > header tab { border-width: 1px; border-color: transparent; outline: none; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; background-clip: border-box; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -2199,7 +2213,6 @@ notebook > stack:not(:only-child) { scrollbar { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); background-color: #FFFFFF; - background-clip: padding-box; } * { @@ -2234,7 +2247,7 @@ scrollbar slider { } scrollbar slider:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } scrollbar slider:active { @@ -2355,7 +2368,7 @@ switch { } switch:checked { - background-color: rgba(66, 133, 244, 0.5); + background-color: rgba(26, 115, 232, 0.5); } switch:disabled { @@ -2374,25 +2387,25 @@ switch slider { 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); + box-shadow: 0 0 0 10px transparent, 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; } switch:focus slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:focus:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:checked slider { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } /************************* @@ -2407,13 +2420,13 @@ switch:checked slider { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list):hover, .view.content-view.check:not(list):active, .content-view .tile check:not(list):hover, .content-view .tile check:not(list):active { - -gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + -gtk-icon-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 3px rgba(0, 0, 0, 0.14), 0 1px 6px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list), @@ -2452,7 +2465,7 @@ radio { check:checked, check:indeterminate, radio:checked, radio:indeterminate { - color: #4285F4; + color: #1A73E8; } check:checked:disabled, check:indeterminate:disabled, @@ -2475,7 +2488,7 @@ radio:disabled { popover modelbutton.flat check:not(:checked):not(:indeterminate):not(:disabled), popover modelbutton.flat radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover modelbutton.flat check.left:dir(rtl), popover modelbutton.flat @@ -2509,7 +2522,7 @@ radio:dir(rtl) { menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem @@ -2548,12 +2561,12 @@ radio:indeterminate { radio { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } radio:checked:not(:indeterminate) { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#1A73E8), to(transparent)); } @@ -2561,7 +2574,7 @@ radio:checked:not(:indeterminate):disabled { border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(0, 0, 0, 0.26)), to(transparent)); } -window.background:not(.csd) > widget > checkbutton > check, +#MozillaGtkWidget > widget > checkbutton > check, menu menuitem check { min-height: 16px; min-width: 16px; @@ -2569,17 +2582,17 @@ menu menuitem check { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:checked, +#MozillaGtkWidget > widget > checkbutton > check:checked, menu menuitem check:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:indeterminate, +#MozillaGtkWidget > widget > checkbutton > check:indeterminate, menu menuitem check:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio, +#MozillaGtkWidget > widget > radiobutton > radio, menu menuitem radio { min-height: 16px; min-width: 16px; @@ -2587,12 +2600,12 @@ menu menuitem radio { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:checked, +#MozillaGtkWidget > widget > radiobutton > radio:checked, menu menuitem radio:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:indeterminate, +#MozillaGtkWidget > widget > radiobutton > radio:indeterminate, menu menuitem radio:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")); } @@ -2611,7 +2624,7 @@ treeview.view radio:selected { treeview.view check, treeview.view radio { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view check:hover, treeview.view check:active, @@ -2628,7 +2641,7 @@ treeview.view radio:disabled { treeview.view check:checked, treeview.view check:indeterminate, treeview.view radio:checked, treeview.view radio:indeterminate { - color: #4285F4; + color: #1A73E8; } treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled, @@ -2692,7 +2705,7 @@ scale trough:disabled { scale highlight { transition: background-image 75ms cubic-bezier(0, 0, 0.2, 1); - background-image: image(#4285F4); + background-image: image(#1A73E8); } scale highlight:disabled { @@ -2715,7 +2728,7 @@ scale slider { background-position: center; background-size: auto, 1000% 1000%; border-radius: 50%; - color: #4285F4; + color: #1A73E8; } scale slider { @@ -2748,7 +2761,7 @@ scale slider:active { scale marks, scale value { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } scale indicator { @@ -2890,7 +2903,7 @@ scale.color.vertical:dir(rtl) slider { * Progress bars * *****************/ progressbar { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } @@ -2909,7 +2922,7 @@ progressbar trough { } progressbar progress { - background-color: #4285F4; + background-color: #1A73E8; } progressbar trough.empty progress { @@ -2944,15 +2957,15 @@ levelbar.vertical.discrete block:not(:last-child) { } levelbar block.low { - background-color: #FBBC05; + background-color: #F4B400; } levelbar block.high, levelbar block:not(.empty) { - background-color: #4285F4; + background-color: #1A73E8; } levelbar block.full { - background-color: #34A853; + background-color: #0F9D58; } levelbar block.empty { @@ -3007,7 +3020,7 @@ scrolledwindow viewport.frame { } overshoot.top { - background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center top; background-color: transparent; @@ -3016,7 +3029,7 @@ overshoot.top { } overshoot.bottom { - background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center bottom; background-color: transparent; @@ -3025,7 +3038,7 @@ overshoot.bottom { } overshoot.left { - background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: left center; background-color: transparent; @@ -3034,7 +3047,7 @@ overshoot.left { } overshoot.right { - background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: right center; background-color: transparent; @@ -3044,7 +3057,7 @@ overshoot.right { undershoot.top { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-top: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3054,7 +3067,7 @@ undershoot.top { undershoot.bottom { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-bottom: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3064,7 +3077,7 @@ undershoot.bottom { undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3074,7 +3087,7 @@ undershoot.left { undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3135,7 +3148,8 @@ row.activatable:focus, treeview.view header button:focus, .budgie-popover.budgie } row.activatable:hover, treeview.view header button:hover, -treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), +treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu popover.background.menu button:not(.image-button):drop(active), popover.background.menu .budgie-popover.budgie-menu button:not(.image-button):drop(active), +.budgie-popover.budgie-menu popover.background button.model:not(.image-button):drop(active), popover.background .budgie-popover.budgie-menu button.model:not(.image-button):drop(active), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.info button:not(.image-button):drop(active), infobar.info .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.question button:not(.image-button):drop(active), infobar.question .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lock-dialog button:not(.image-button):drop(active), .lock-dialog .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lightdm-gtk-greeter button:not(.image-button):drop(active), .lightdm-gtk-greeter .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu button.flat:not(.image-button):drop(active) { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 0ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -3150,7 +3164,7 @@ row.activatable.has-open-popup, treeview.view header button.has-open-popup, .bud } row:selected { - color: #4285F4; + color: #1A73E8; } row:selected image, @@ -3175,6 +3189,10 @@ row:selected:disabled label { margin: 8px; } +.app-notification button.text-button:not(:disabled) { + color: #1A73E8; +} + .app-notification.frame, .app-notification border { border-style: none; @@ -3189,7 +3207,7 @@ expander title > arrow { min-height: 16px; -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } expander title > arrow:dir(rtl) { @@ -3232,7 +3250,7 @@ calendar.header { } calendar.highlight { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -3257,7 +3275,7 @@ messagedialog .titlebar { messagedialog .titlebar:backdrop { background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } messagedialog.csd.background { @@ -3275,11 +3293,11 @@ messagedialog.csd .dialog-action-box button:not(:last-child) { } messagedialog.csd .dialog-action-box button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } messagedialog.csd .dialog-action-box button.destructive-action:not(:disabled) { - color: #EA4335; + color: #D93025; } filechooser .dialog-action-box { @@ -3330,6 +3348,7 @@ stacksidebar.sidebar row { stacksidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } @@ -3351,7 +3370,12 @@ separator.sidebar { * File chooser * ****************/ row image.sidebar-icon { - color: rgba(0, 0, 0, 0.54); + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); + color: rgba(0, 0, 0, 0.6); +} + +row image.sidebar-icon:disabled { + color: rgba(0, 0, 0, 0.26); } placessidebar.sidebar > viewport.frame { @@ -3375,9 +3399,14 @@ placessidebar.sidebar row > revealer { placessidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } +placessidebar.sidebar row:selected image.sidebar-icon { + color: #1A73E8; +} + placessidebar.sidebar row:disabled { color: rgba(0, 0, 0, 0.38); } @@ -3390,6 +3419,10 @@ placessidebar.sidebar row image.sidebar-icon:dir(rtl) { padding-left: 8px; } +placessidebar.sidebar row label.sidebar-label { + color: inherit; +} + placessidebar.sidebar row label.sidebar-label:dir(ltr) { padding-right: 2px; } @@ -3398,17 +3431,16 @@ placessidebar.sidebar row label.sidebar-label:dir(rtl) { padding-left: 2px; } -placessidebar.sidebar row:selected image.sidebar-icon, -placessidebar.sidebar row:selected label.sidebar-label { - color: inherit; -} - placessidebar.sidebar row.sidebar-placeholder-row { background-color: alpha(currentColor, 0.08); } placessidebar.sidebar row.sidebar-new-bookmark-row { - color: #4285F4; + color: #1A73E8; +} + +placessidebar.sidebar row.sidebar-new-bookmark-row image.sidebar-icon { + color: #1A73E8; } placesview .server-list-button > image { @@ -3495,17 +3527,12 @@ infobar.info, infobar.question { background-color: #FFFFFF; } -infobar.info button.text-button, infobar.question button.text-button { - padding-left: 8px; - padding-right: 8px; -} - infobar.info button.text-button:not(:disabled), infobar.question button.text-button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } infobar.warning { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -3514,7 +3541,7 @@ infobar.warning *:link, infobar.warning button.link:link { } infobar.error { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -3598,15 +3625,15 @@ colorswatch.light { colorswatch overlay { transition: box-shadow 75ms 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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } colorswatch overlay:hover { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch overlay:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch#add-color-button { @@ -3641,12 +3668,12 @@ colorswatch#editor-color-sample overlay { colorchooser .popover.osd { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } colorchooser .popover.osd:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } /******** @@ -3662,12 +3689,12 @@ colorchooser .popover.osd:backdrop { decoration { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; margin: 8px; } decoration:backdrop { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; } .maximized decoration, @@ -3690,7 +3717,7 @@ decoration:backdrop { .csd.popup decoration { border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } tooltip.csd decoration { @@ -3712,7 +3739,7 @@ messagedialog.csd decoration { .view selection, .view:selected, flowbox flowboxchild:selected, label selection, spinbutton:not(.vertical) selection, entry selection, modelbutton.flat:selected, .menuitem.button.flat:selected, row:selected, calendar:selected, .nautilus-window flowboxchild:selected .icon-item-background, box.vertical > widget > widget:selected, .budgie-popover.budgie-menu button.flat:not(.image-button):checked, calendar.raven-calendar:selected, XfdesktopIconView.view:active, .nemo-window .nemo-window-pane widget.entry:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); } .monospace { @@ -3723,7 +3750,7 @@ entry selection, modelbutton.flat:selected, * Touch Copy & Paste * **********************/ cursor-handle { - color: #4285F4; + color: #1A73E8; -gtk-icon-source: -gtk-recolor(url("assets/scalable/cursor-handle-symbolic.svg")); } @@ -3760,7 +3787,7 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) } :not(decoration):not(window):drop(active) { - caret-color: #4285F4; + caret-color: #1A73E8; } stackswitcher button.text-button { @@ -3801,7 +3828,7 @@ button.emoji-section { } button.emoji-section:checked { - color: #4285F4; + color: #1A73E8; } button.emoji-section:not(:last-child) { @@ -3852,12 +3879,12 @@ popover.emoji-completion .emoji:hover { .nautilus-canvas-item.dim-label, .nautilus-list-dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-desktop.nautilus-canvas-item, .caja-desktop.caja-canvas-item, .nemo-desktop.nemo-canvas-item { color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } @keyframes nautilus-operations-button-needs-attention { @@ -3901,20 +3928,24 @@ popover.emoji-completion .emoji:hover { margin-right: 0; } -.path-bar-box .nautilus-path-bar button { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: 6px; padding-right: 6px; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 0; +} + +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):first-child { margin-left: 0; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):last-child { margin-right: 0; } -.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button.image-button image:not(:only-child) { margin: 0; } @@ -3926,7 +3957,6 @@ popover.emoji-completion .emoji:hover { border-color: rgba(0, 0, 0, 0.12); border-radius: 3px 3px 0 0; background-color: rgba(255, 255, 255, 0.9); - background-clip: padding-box; } .nautilus-window .floating-bar.bottom.left { @@ -3951,8 +3981,8 @@ popover.emoji-completion .emoji:hover { } .disk-space-display.used { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } .disk-space-display.free { @@ -3968,7 +3998,7 @@ popover.emoji-completion .emoji:hover { } .conflict-row:not(:selected) { - background-color: #feebb4; + background-color: #fce9b3; } .nautilus-window flowboxchild .icon-item-background { @@ -4023,23 +4053,23 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .nautilus-menu-sort-heading:disabled { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-window paned > separator { - background-color: #F2F2F2; + background-color: #FAFAFA; } /********* * gedit * *********/ .open-document-selector-path-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } .open-document-selector-match { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -4070,7 +4100,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: .gedit-search-slider .linked:not(.vertical) > entry .gedit-search-entry-occurrences-tag { all: unset; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .gedit-search-slider .linked:not(.vertical) > entry:dir(ltr) { @@ -4220,7 +4250,7 @@ layouttab { border-style: none solid; border-width: 1px; border-color: rgba(0, 0, 0, 0.12); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: #FFFFFF; } @@ -4240,12 +4270,12 @@ layout { } entry.search-missing { - background-color: #EA4335; + background-color: #D93025; color: white; } window.workbench treeview.image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.popover-selector list { @@ -4277,7 +4307,7 @@ omnibar.linked:not(.vertical) entry { } omnibar:not(:hover):not(:active) entry { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.omnibar list row:not(:last-child) { @@ -4370,11 +4400,11 @@ docktab { border-width: 1px; border-color: transparent; box-shadow: inset 0 -2px transparent; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -4385,7 +4415,7 @@ docktab:hover { docktab:checked { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 225ms cubic-bezier(0, 0, 0.2, 1), background-image 525ms cubic-bezier(0, 0, 0.2, 1); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-size: 1000% 1000%; @@ -4402,11 +4432,11 @@ dockoverlayedge docktabstrip { } dockoverlayedge.left-edge docktab:checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } dockoverlayedge.right-edge docktab:checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } pillbox { @@ -4490,7 +4520,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button { } ideeditorutilities > dzldockpaned > box > stackswitcher button:active { - background-image: radial-gradient(circle, rgba(66, 133, 244, 0.7) 10%, transparent 0%); + background-image: radial-gradient(circle, rgba(26, 115, 232, 0.7) 10%, transparent 0%); } ideeditorutilities > dzldockpaned > box > stackswitcher button:checked { @@ -4503,7 +4533,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { @@ -4511,7 +4541,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } ideeditorsidebar notebook header { @@ -4536,8 +4566,8 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: 9999px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #4285F4; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #1A73E8; color: white; font-weight: bold; } @@ -4566,13 +4596,13 @@ button.photos-filter-preview { } button.photos-filter-preview:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); 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); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { @@ -4605,11 +4635,11 @@ overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) { } .side-panel .view:selected { - background-image: image(#4285F4); + background-image: image(#1A73E8); } .side-panel .view:selected:hover { - background-image: image(#518ff5); + background-image: image(#2c7eea); } .songs-list:hover { @@ -4735,7 +4765,7 @@ list.categories { min-height: 24px; padding: 0 4px; border-radius: 2px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -4773,7 +4803,7 @@ button.title label { overlay > revealer.left > scrolledwindow.frame, overlay > revealer.right > scrolledwindow.frame { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } overlay > revealer.left > scrolledwindow.frame { @@ -4797,6 +4827,15 @@ button.image-button.session-new-button { min-width: 32px; } +notebook.tilix-background tab > box > stack { + margin: -6px; +} + +button.flat.tilix-small-button { + min-height: 20px; + min-width: 16px; +} + /************** * Terminator * **************/ @@ -4836,37 +4875,46 @@ window.background > box.vertical > scrolledwindow > widget toolbar button { * Chromium * ************/ window.background.chromium { - background-color: #F2F2F2; + background-color: #FFFFFF; } window.background.chromium entry, -window.background.chromium > button:not(.suggested-action):not(.destructive-action) { +window.background.chromium > button { border: 1px solid rgba(0, 0, 0, 0.26); } window.background.chromium > button { - box-shadow: none; - background-size: auto; + color: #1A73E8; } -window.background.chromium > button:hover, -window.background.chromium > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +window.background.chromium > button:disabled { + color: rgba(0, 0, 0, 0.26); } -window.background.chromium > button:active { - background-image: image(alpha(currentColor, 0.12)); +window.background.chromium menubar, +window.background.chromium headerbar { + color: rgba(0, 0, 0, 0.6); } window.background.chromium headerbar button:active { - background-size: 1000% 1000%; + background-color: alpha(currentColor, 0.12); } window.background.chromium spinner { - color: #4285F4; + color: #1A73E8; } -window.background.chromium textview { +window.background.chromium textview.view { + background-color: transparent; +} + +window.background.chromium treeview.view.cell:selected:focus { + background-color: #1A73E8; + color: white; +} + +window.background.chromium treeview.view button { + border: 1px solid rgba(0, 0, 0, 0.26); background-color: #FFFFFF; } @@ -4877,103 +4925,106 @@ tooltip.background.chromium { /*********** * Firefox * ***********/ -window.background:not(.csd) > widget > separator { - color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget text { + background-color: #FFFFFF; } -window.background:not(.csd) > widget > scrollbar { - background-clip: border-box; +#MozillaGtkWidget > widget text:selected { + background-color: #1A73E8; + color: white; +} + +#MozillaGtkWidget > widget > separator { + color: rgba(0, 0, 0, 0.12); } -window.background:not(.csd) > widget > scrollbar, -window.background:not(.csd) > widget > frame > border { +#MozillaGtkWidget > widget > frame > border { border-color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > entry, -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > entry, +#MozillaGtkWidget > widget > button > button { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 2px; box-shadow: none; } -window.background:not(.csd) > widget > entry { +#MozillaGtkWidget > widget > entry:disabled, +#MozillaGtkWidget > widget > button > button:disabled { + border-color: rgba(0, 0, 0, 0.12); +} + +#MozillaGtkWidget > widget > entry { min-height: 30px; background-color: #FFFFFF; } -window.background:not(.csd) > widget > entry:focus { - border-color: #4285F4; - box-shadow: inset 0 0 0 1px #4285F4; +#MozillaGtkWidget > widget > entry:focus { + border-color: #1A73E8; + box-shadow: inset 0 0 0 1px #1A73E8; } -window.background:not(.csd) > widget > entry:disabled { +#MozillaGtkWidget > widget > entry:disabled { background-color: #FAFAFA; } -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > button > button { padding: 4px 8px; background-size: auto; } -window.background:not(.csd) > widget > button > button:hover, -window.background:not(.csd) > widget > button > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +#MozillaGtkWidget > widget > button > button:hover, +#MozillaGtkWidget > widget > button > button:drop(active) { + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); } -window.background:not(.csd) > widget > button > button:active { +#MozillaGtkWidget > widget > button > button:active { background-image: image(alpha(currentColor, 0.12)); } -window.background:not(.csd) > widget > checkbutton > check:not(:checked), -window.background:not(.csd) > widget > radiobutton > radio:not(:checked) { +#MozillaGtkWidget > widget > checkbutton > check, +#MozillaGtkWidget > widget > radiobutton > radio { + margin: 0; + padding: 0; +} + +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate), +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate) { color: #757575; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):hover, #MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):active, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):hover, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):active { color: #212121; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):disabled, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):disabled { color: rgba(117, 117, 117, 0.5); } -window.background:not(.csd) > window > menu, -window.background:not(.csd) > menu > menu { +#MozillaGtkWidget menu { border: none; } -text:selected { - background-color: #4285F4; - color: white; +#MozillaGtkWidget > widget > menubar { + color: rgba(0, 0, 0, 0.6); } -window.background:not(.csd) > widget > menubar { - color: rgba(0, 0, 0, 0.54); -} - -window.background:not(.csd) > widget > menubar:hover { +#MozillaGtkWidget > widget > menubar:hover { color: rgba(0, 0, 0, 0.87); } -window.background:not(.csd) > widget > menubar:disabled { +#MozillaGtkWidget > widget > menubar:disabled { color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > frame { +#MozillaGtkWidget > widget > frame { color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > checkbutton > check, -window.background:not(.csd) > widget > radiobutton > radio { - margin: 0; - padding: 0; -} - -window.background:not(.csd) > window.background > menu > separator { +#MozillaGtkWidget menu > separator { color: rgba(0, 0, 0, 0.12); } @@ -5069,7 +5120,7 @@ UnityDecoration { -UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32); -UnityDecoration-inactive-shadow-radius: 6px; -UnityDecoration-glow-size: 8px; - -UnityDecoration-glow-color: #4285F4; + -UnityDecoration-glow-color: #1A73E8; -UnityDecoration-title-indent: 4px; -UnityDecoration-title-fade: 32px; -UnityDecoration-title-alignment: 0.0; @@ -5086,22 +5137,22 @@ UnityDecoration .top { UnityDecoration .top:backdrop { background-color: #D6D6D6; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } UnityDecoration .menuitem { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } UnityDecoration .menuitem:hover { - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; color: rgba(0, 0, 0, 0.87); } .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .background:not(.csd) headerbar:not(.titlebar).inline-toolbar { @@ -5110,23 +5161,23 @@ UnityDecoration .menuitem:hover { UnityPanelWidget, .unity-panel { - background-color: #d6d6d6; + background-color: #CCCCCC; color: rgba(0, 0, 0, 0.87); } UnityPanelWidget:backdrop, .unity-panel:backdrop { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .unity-panel.menuitem, .unity-panel .menuitem { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .unity-panel.menubar.menuitem:hover, .unity-panel.menubar .menuitem *:hover { - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; color: rgba(0, 0, 0, 0.87); } @@ -5134,7 +5185,7 @@ UnityPanelWidget:backdrop, .menu IdoPlaybackMenuItem.menuitem:active { -gtk-icon-source: -gtk-icontheme("process-working-symbolic"); animation: spin 1s linear infinite; - color: #4285F4; + color: #1A73E8; } /************** @@ -5146,7 +5197,7 @@ UnityPanelWidget:backdrop, } .mate-panel-menu-bar { - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -5256,7 +5307,7 @@ PanelApplet.wnck-applet .wnck-pager:active { } PanelApplet.wnck-applet .wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } .mate-panel-menu-bar.horizontal #clock-applet-button label { @@ -5352,7 +5403,7 @@ na-tray-applet { #mate-menu button image, #mate-menu button label + label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } #mate-menu entry { @@ -5400,7 +5451,7 @@ na-tray-applet { } .brisk-menu .categories-list button:checked { - color: #4285F4; + color: #1A73E8; } .brisk-menu .session-button { @@ -5441,6 +5492,10 @@ na-tray-applet { margin: 0 -1px 0 -2px; } +.caja-pathbar button.slider-button { + min-width: 24px; +} + .caja-pathbar button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -GtkArrow-arrow-scaling: 1; @@ -5461,6 +5516,35 @@ na-tray-applet { border-style: none; } +.caja-canvas-item { + border-radius: 2px; +} + +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.04); + background-image: none; + color: rgba(0, 0, 0, 0.87); +} + +.caja-desktop.view .entry:selected, +.caja-navigation-window .view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + +.caja-desktop.view .entry { + background-color: rgba(0, 0, 0, 0.3); + color: white; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); + caret-color: currentColor; +} + +.caja-desktop.view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + .caja-navigation-window statusbar { margin: 0 -10px; padding: 0 4px; @@ -5539,7 +5623,7 @@ na-tray-applet { .lock-dialog { border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 3px; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -5547,6 +5631,10 @@ na-tray-applet { border-style: none; } +.lock-dialog button:not(:disabled) { + color: #1A73E8; +} + /* multimedia OSD */ MsdOsdWindow.background.osd { border-radius: 2px; @@ -5561,7 +5649,7 @@ MsdOsdWindow.background.osd .trough { MsdOsdWindow.background.osd .progressbar { border-radius: 0; - background-color: #4285F4; + background-color: #1A73E8; } /****************** @@ -5584,7 +5672,7 @@ MsdOsdWindow.background.osd .progressbar { border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: 3px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } @@ -5780,13 +5868,13 @@ MsdOsdWindow.background.osd .progressbar { .budgie-panel { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.7); font-weight: 500; } .budgie-panel.transparent { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .budgie-panel button { @@ -5809,7 +5897,7 @@ MsdOsdWindow.background.osd .progressbar { } .budgie-panel .alert { - color: #EA4335; + color: #D93025; } .budgie-panel .titlebar:not(headerbar) { @@ -5845,7 +5933,8 @@ MsdOsdWindow.background.osd .progressbar { color: rgba(255, 255, 255, 0.5); } -.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel popover.background.menu button.launcher:not(:checked):drop(active), popover.background.menu .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel popover.background button.launcher.model:not(:checked):drop(active), popover.background .budgie-panel button.launcher.model:not(:checked):drop(active), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel infobar.info button.launcher:not(:checked):drop(active), infobar.info .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel infobar.question button.launcher:not(:checked):drop(active), infobar.question .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lock-dialog button.launcher:not(:checked):drop(active), .lock-dialog .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lightdm-gtk-greeter button.launcher:not(:checked):drop(active), .lightdm-gtk-greeter .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):active { color: rgba(255, 255, 255, 0.7); } @@ -5892,7 +5981,7 @@ MsdOsdWindow.background.osd .progressbar { frame.raven-frame > border { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } .top frame.raven-frame > border { @@ -5920,12 +6009,12 @@ frame.raven-frame > border { } .raven stackswitcher.linked > button { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 0; } .raven stackswitcher.linked > button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; background-color: transparent; } @@ -5991,7 +6080,7 @@ calendar.raven-calendar:selected { } .raven-mpris { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -6012,7 +6101,7 @@ calendar.raven-calendar:selected { } .budgie-notification .notification-body, .budgie-switcher .notification-body { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-osd .budgie-osd-text { @@ -6023,7 +6112,7 @@ calendar.raven-calendar:selected { margin: 5px 9px; padding: 3px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6061,11 +6150,11 @@ calendar.raven-calendar:selected { } .budgie-polkit-dialog .message { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-polkit-dialog .failure { - color: #EA4335; + color: #D93025; } .budgie-run-dialog { @@ -6100,7 +6189,7 @@ calendar.raven-calendar:selected { ***************/ .xfce4-panel.background { border: none; - background-color: #303030; + background-color: rgba(0, 0, 0, 0.6); color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -6133,14 +6222,14 @@ wnck-pager:active { } wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } XfdesktopIconView.view { border-radius: 2px; background-color: transparent; color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } XfdesktopIconView.view:active { @@ -6191,7 +6280,7 @@ XfdesktopIconView.view .rubberband { * LightDM GTK+ Greeter * ************************/ #panel_window { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; } @@ -6225,7 +6314,7 @@ XfdesktopIconView.view .rubberband { #restart_dialog { margin: 8px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6233,6 +6322,10 @@ XfdesktopIconView.view .rubberband { padding-bottom: 16px; } +.lightdm-gtk-greeter button:not(:disabled) { + color: #1A73E8; +} + #buttonbox_frame { padding-top: 24px; } @@ -6286,7 +6379,7 @@ XfdesktopIconView.view .rubberband { .places-treeview { -NemoPlacesTreeView-disk-full-bg-color: rgba(182, 182, 182, 0.961); - -NemoPlacesTreeView-disk-full-fg-color: #4285F4; + -NemoPlacesTreeView-disk-full-fg-color: #1A73E8; -NemoPlacesTreeView-disk-full-bar-width: 2px; -NemoPlacesTreeView-disk-full-bar-radius: 0; -NemoPlacesTreeView-disk-full-bottom-padding: 1px; @@ -6310,7 +6403,7 @@ text widgets and the like base background color */ @define-color theme_base_color #FFFFFF; /* base background color of selections */ -@define-color theme_selected_bg_color #4285F4; +@define-color theme_selected_bg_color #1A73E8; /* text/foreground color of selections */ @define-color theme_selected_fg_color white; @@ -6337,7 +6430,7 @@ text widgets and the like base background color on backdrop windows */ @define-color theme_unfocused_base_color #FFFFFF; /* base background color of selections on backdrop windows */ -@define-color theme_unfocused_selected_bg_color #4285F4; +@define-color theme_unfocused_selected_bg_color #1A73E8; /* text/foreground color of selections on backdrop windows */ @define-color theme_unfocused_selected_fg_color white; @@ -6352,18 +6445,18 @@ widgets main borders color on backdrop windows */ @define-color unfocused_borders rgba(0, 0, 0, 0.12); /* these are pretty self explicative */ -@define-color warning_color #FBBC05; -@define-color error_color #EA4335; -@define-color success_color #34A853; +@define-color warning_color #F4B400; +@define-color error_color #D93025; +@define-color success_color #0F9D58; /* these colors are exported for the window manager and shouldn't be used in applications, read if you used those and something break with a version upgrade you're on your own... */ @define-color wm_title rgba(0, 0, 0, 0.87); -@define-color wm_unfocused_title rgba(0, 0, 0, 0.54); +@define-color wm_unfocused_title rgba(0, 0, 0, 0.6); @define-color wm_highlight rgba(255, 255, 255, 0.4); @define-color wm_bg #E0E0E0; @define-color wm_unfocused_bg #D6D6D6; /* FIXME this is really an API */ @define-color content_view_bg #FFFFFF; -@define-color placeholder_text_color #757575; +@define-color placeholder_text_color #666666; diff --git a/src/gtk/3.0/gtk.css b/src/gtk/3.0/gtk.css index dc1731031..41c636942 100644 --- a/src/gtk/3.0/gtk.css +++ b/src/gtk/3.0/gtk.css @@ -12,17 +12,17 @@ @keyframes ripple-on-headerbar { from { - background-image: radial-gradient(circle, #4285F4 0%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 0%, transparent 0%); } to { - background-image: radial-gradient(circle, #4285F4 100%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 100%, transparent 0%); } } * { background-clip: padding-box; -GtkToolButton-icon-spacing: 0; - -GtkTextView-error-underline-color: #EA4335; + -GtkTextView-error-underline-color: #D93025; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 24; @@ -34,7 +34,7 @@ outline-color: transparent; outline-offset: -4px; -gtk-outline-radius: 2px; - -gtk-secondary-caret-color: #4285F4; + -gtk-secondary-caret-color: #1A73E8; } *:focus { @@ -80,7 +80,7 @@ } .gtkstyle-fallback:selected { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -94,7 +94,7 @@ } .view:selected:hover { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.08); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.08); } .view:disabled { @@ -111,7 +111,7 @@ textview text { textview border { background-color: #FAFAFA; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .rubberband, @@ -139,7 +139,7 @@ label { } label.separator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } label:disabled { @@ -152,8 +152,14 @@ button label:disabled { color: inherit; } +label.osd { + border-radius: 2px; + background-color: rgba(97, 97, 97, 0.9); + color: white; +} + .dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } assistant .sidebar { @@ -205,7 +211,7 @@ entry { border-radius: 2px 2px 0 0; caret-color: currentColor; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -213,7 +219,7 @@ entry { spinbutton:focus:not(.vertical), entry:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton:drop(active):not(.vertical), @@ -238,7 +244,7 @@ entry.flat { spinbutton:not(.vertical) image, entry image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, @@ -267,7 +273,7 @@ entry image.right { spinbutton:not(.vertical) undershoot.left, entry undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -278,7 +284,7 @@ entry undershoot.left { spinbutton:not(.vertical) undershoot.right, entry undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -289,15 +295,15 @@ entry undershoot.right { spinbutton.error:not(.vertical), entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #EA4335; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #D93025; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.error:focus:not(.vertical), entry.error:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #EA4335 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #D93025 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.error:disabled:not(.vertical), @@ -310,15 +316,15 @@ entry.error:disabled { spinbutton.warning:not(.vertical), entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 0%, transparent 0%) 0 0 0/0 0 0px; - box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #FBBC05; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 0%, transparent 0%) 0 0 0/0 0 0px; + box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px #F4B400; background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); } spinbutton.warning:focus:not(.vertical), entry.warning:focus { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FBBC05 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #F4B400 100%, transparent 0%) 0 0 2/0 0 2px; } spinbutton.warning:disabled:not(.vertical), @@ -331,7 +337,7 @@ entry.warning:disabled { spinbutton:not(.vertical) progress, entry progress { margin: 2px -8px; - border-bottom: 2px solid #4285F4; + border-bottom: 2px solid #1A73E8; background-color: transparent; } @@ -339,22 +345,22 @@ spinbutton.vertical entry, .gedit-search-slider .linked:not(.vertical) > entry { border-radius: 2px; transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry:focus, .gedit-search-slider .linked:not(.vertical) > entry:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:drop(active), .gedit-search-slider .linked:not(.vertical) > entry:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) > entry:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -362,18 +368,18 @@ spinbutton.vertical entry:disabled, .gedit-search-slider .linked:not(.vertical) spinbutton.vertical entry.error, .gedit-search-slider .linked:not(.vertical) > entry.error { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #EA4335; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #D93025; color: white; } spinbutton.vertical entry.error:focus, .gedit-search-slider .linked:not(.vertical) > entry.error:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.error:disabled, .gedit-search-slider .linked:not(.vertical) > entry.error:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } @@ -393,24 +399,24 @@ spinbutton.vertical entry.error image:disabled, .gedit-search-slider .linked:not spinbutton.vertical entry.warning, .gedit-search-slider .linked:not(.vertical) > entry.warning { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); border-image: none; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - background-color: #FBBC05; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } spinbutton.vertical entry.warning:focus, .gedit-search-slider .linked:not(.vertical) > entry.warning:focus { border-image: none; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } spinbutton.vertical entry.warning:disabled, .gedit-search-slider .linked:not(.vertical) > entry.warning:disabled { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FAFAFA; color: rgba(0, 0, 0, 0.38); } spinbutton.vertical entry.warning image, .gedit-search-slider .linked:not(.vertical) > entry.warning image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical entry.warning image:hover, .gedit-search-slider .linked:not(.vertical) > entry.warning image:hover, spinbutton.vertical entry.warning image:active, .gedit-search-slider .linked:not(.vertical) > entry.warning image:active { @@ -462,7 +468,7 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f } .entry-tag.button:not(:hover):not(:active), .button.documents-entry-tag:not(:hover):not(:active), .button.photos-entry-tag:not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } /*********** @@ -470,10 +476,10 @@ treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:f ***********/ @keyframes needs-attention { from { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } to { - background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#4285F4), to(transparent)); + background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#1A73E8), to(transparent)); } } @@ -486,7 +492,7 @@ button { font-weight: 500; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; - box-shadow: inset 0 0 0 9999px transparent, 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: inset 0 0 0 9999px transparent, 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-repeat: no-repeat; @@ -497,20 +503,20 @@ button { button:focus { - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:hover, button:drop(active) { - box-shadow: inset 0 0 0 9999px transparent, 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px transparent, 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } button:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; - box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08), 0 5px 3px -3px rgba(0, 0, 0, 0.2), 0 8px 6px 1px rgba(0, 0, 0, 0.14), 0 3px 8.4px 2px rgba(0, 0, 0, 0.12); background-image: radial-gradient(circle, alpha(currentColor, 0.12) 10%, transparent 0%); background-size: 0% 0%; } @@ -524,7 +530,7 @@ button:disabled { button:checked { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -537,9 +543,9 @@ button:checked:disabled { modelbutton.flat, .menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, notebook > header > tabs > arrow, scrollbar button, check, -radio, calendar.button, button.sidebar-button, infobar.info button, infobar.question button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .lock-dialog button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, -.path-bar button, popover.background.menu button, -popover.background button.model, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, .nemo-window .toolbar button, +radio, calendar.button, button.sidebar-button, .gedit-search-slider .linked > button, popover.messagepopover .popover-action-area button, #MatePanelPopupWindow button, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, combobox > .linked:not(.vertical) > button:not(:only-child), .caja-pathbar button, +.path-bar.linked:not(.vertical) > button, layouttabbar button, .mate-panel-menu-bar button, .budgie-panel button, .raven stackswitcher.linked > button, .xfce4-panel.background button, toolbar button, .titlebar button:not(.suggested-action):not(.destructive-action), popover.background.menu button, +popover.background button.model, actionbar > revealer > box button:not(.suggested-action):not(.destructive-action), .app-notification button, messagedialog.csd .dialog-action-box button, filechooser #pathbarbox > stack > box > button, infobar.info button, infobar.question button, .lock-dialog button, .lightdm-gtk-greeter button, .nemo-window .toolbar button, button.flat { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); outline: none; @@ -549,14 +555,14 @@ button.flat { background-repeat: no-repeat; background-position: center; background-size: 1000% 1000%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } modelbutton.flat:focus, .menuitem.button.flat:focus, spinbutton:not(.vertical) button:focus, spinbutton.vertical button:focus, notebook > header > tabs > arrow:focus, scrollbar button:focus, check:focus, -radio:focus, calendar.button:focus, button.sidebar-button:focus, infobar.info button:focus, infobar.question button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .lock-dialog button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, .lightdm-gtk-greeter button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, -.path-bar button:focus, popover.background.menu button:focus, -popover.background button.model:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, .nemo-window .toolbar button:focus, +radio:focus, calendar.button:focus, button.sidebar-button:focus, .gedit-search-slider .linked > button:focus, popover.messagepopover .popover-action-area button:focus, #MatePanelPopupWindow button:focus, #mate-menu button:focus, .budgie-settings-window buttonbox.inline-toolbar button:focus, .drop-shadow button:focus, .budgie-session-dialog .linked.horizontal > button:focus, combobox > .linked:not(.vertical) > button:focus:not(:only-child), .caja-pathbar button:focus, +.path-bar.linked:not(.vertical) > button:focus, layouttabbar button:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven stackswitcher.linked > button:focus, .xfce4-panel.background button:focus, toolbar button:focus, .titlebar button:focus:not(.suggested-action):not(.destructive-action), popover.background.menu button:focus, +popover.background button.model:focus, actionbar > revealer > box button:focus:not(.suggested-action):not(.destructive-action), .app-notification button:focus, messagedialog.csd .dialog-action-box button:focus, filechooser #pathbarbox > stack > box > button:focus, infobar.info button:focus, infobar.question button:focus, .lock-dialog button:focus, .lightdm-gtk-greeter button:focus, .nemo-window .toolbar button:focus, button.flat:focus { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); color: rgba(0, 0, 0, 0.87); @@ -568,44 +574,50 @@ spinbutton:not(.vertical) button:drop(active), spinbutton.vertical button:hover, spinbutton.vertical button:drop(active), notebook > header > tabs > arrow:hover, scrollbar button:hover, scrollbar button:drop(active), check:hover, radio:hover, calendar.button:hover, button.sidebar-button:hover, -button.sidebar-button:drop(active), infobar.info button:hover, -infobar.info button:drop(active), infobar.question button:hover, -infobar.question button:drop(active), .gedit-search-slider .linked > button:hover, +button.sidebar-button:drop(active), .gedit-search-slider .linked > button:hover, .gedit-search-slider .linked > button:drop(active), popover.messagepopover .popover-action-area button:hover, popover.messagepopover .popover-action-area button:drop(active), #MatePanelPopupWindow button:hover, #MatePanelPopupWindow button:drop(active), #mate-menu button:hover, -#mate-menu button:drop(active), .lock-dialog button:hover, -.lock-dialog button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, +#mate-menu button:drop(active), .budgie-settings-window buttonbox.inline-toolbar button:hover, .budgie-settings-window buttonbox.inline-toolbar button:drop(active), .drop-shadow button:hover, .drop-shadow button:drop(active), .budgie-session-dialog .linked.horizontal > button:hover, -.budgie-session-dialog .linked.horizontal > button:drop(active), .lightdm-gtk-greeter button:hover, -.lightdm-gtk-greeter button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), +.budgie-session-dialog .linked.horizontal > button:drop(active), combobox > .linked:not(.vertical) > button:hover:not(:only-child), combobox > .linked:not(.vertical) > button:not(:only-child):drop(active), .caja-pathbar button:hover, .caja-pathbar button:drop(active), -.path-bar button:hover, -.path-bar button:drop(active), popover.background.menu button:hover, -popover.background.menu button:drop(active), -popover.background button.model:hover, -popover.background button.model:drop(active), layouttabbar button:hover, +.path-bar.linked:not(.vertical) > button:hover, +.path-bar.linked:not(.vertical) > button:drop(active), layouttabbar button:hover, layouttabbar button:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven stackswitcher.linked > button:hover, .raven stackswitcher.linked > button:drop(active), .xfce4-panel.background button:hover, .xfce4-panel.background button:drop(active), toolbar button:hover, toolbar button:drop(active), .titlebar button:hover:not(.suggested-action):not(.destructive-action), -.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), +.titlebar button:not(.suggested-action):not(.destructive-action):drop(active), popover.background.menu button:hover, +popover.background.menu button:drop(active), +popover.background button.model:hover, +popover.background button.model:drop(active), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):drop(active), .app-notification button:hover, .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:hover, messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:hover, -filechooser #pathbarbox > stack > box > button:drop(active), .nemo-window .toolbar button:hover, +filechooser #pathbarbox > stack > box > button:drop(active), infobar.info button:hover, +infobar.info button:drop(active), infobar.question button:hover, +infobar.question button:drop(active), .lock-dialog button:hover, +.lock-dialog button:drop(active), .lightdm-gtk-greeter button:hover, +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:hover, .nemo-window .toolbar button:drop(active), button.flat:hover, toolbar button:drop(active), .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), +popover.background.menu button:drop(active), +popover.background button.model:drop(active), actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), .app-notification button:drop(active), messagedialog.csd .dialog-action-box button:drop(active), filechooser #pathbarbox > stack > box > button:drop(active), +infobar.info button:drop(active), +infobar.question button:drop(active), +.lock-dialog button:drop(active), +.lightdm-gtk-greeter button:drop(active), .nemo-window .toolbar button:drop(active), button.flat:drop(active) { box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -614,9 +626,9 @@ button.flat:drop(active) { modelbutton.flat:active, .menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active, -radio:active, calendar.button:active, button.sidebar-button:active, infobar.info button:active, infobar.question button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .lock-dialog button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, -.path-bar button:active, popover.background.menu button:active, -popover.background button.model:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, .nemo-window .toolbar button:active, +radio:active, calendar.button:active, button.sidebar-button:active, .gedit-search-slider .linked > button:active, popover.messagepopover .popover-action-area button:active, #MatePanelPopupWindow button:active, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, combobox > .linked:not(.vertical) > button:active:not(:only-child), .caja-pathbar button:active, +.path-bar.linked:not(.vertical) > button:active, layouttabbar button:active, .mate-panel-menu-bar button:active, .budgie-panel button:active, .raven stackswitcher.linked > button:active, .xfce4-panel.background button:active, toolbar button:active, .titlebar button:active:not(.suggested-action):not(.destructive-action), popover.background.menu button:active, +popover.background button.model:active, actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action), .app-notification button:active, messagedialog.csd .dialog-action-box button:active, filechooser #pathbarbox > stack > box > button:active, infobar.info button:active, infobar.question button:active, .lock-dialog button:active, .lightdm-gtk-greeter button:active, .nemo-window .toolbar button:active, button.flat:active { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1), background-size 0ms, background-image 0ms; animation: ripple 225ms cubic-bezier(0, 0, 0.2, 1) forwards; @@ -628,9 +640,9 @@ button.flat:active { modelbutton.flat:disabled, .menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, -radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, infobar.info button:disabled, infobar.question button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .lock-dialog button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, -.path-bar button:disabled, popover.background.menu button:disabled, -popover.background button.model:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, .nemo-window .toolbar button:disabled, +radio:disabled, calendar.button:disabled, button.sidebar-button:disabled, .gedit-search-slider .linked > button:disabled, popover.messagepopover .popover-action-area button:disabled, #MatePanelPopupWindow button:disabled, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, combobox > .linked:not(.vertical) > button:disabled:not(:only-child), .caja-pathbar button:disabled, +.path-bar.linked:not(.vertical) > button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar button:disabled, .budgie-panel button:disabled, .raven stackswitcher.linked > button:disabled, .xfce4-panel.background button:disabled, toolbar button:disabled, .titlebar button:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:disabled, +popover.background button.model:disabled, actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:disabled, messagedialog.csd .dialog-action-box button:disabled, filechooser #pathbarbox > stack > box > button:disabled, infobar.info button:disabled, infobar.question button:disabled, .lock-dialog button:disabled, .lightdm-gtk-greeter button:disabled, .nemo-window .toolbar button:disabled, button.flat:disabled { box-shadow: none; background-color: transparent; @@ -638,16 +650,16 @@ button.flat:disabled { } combobox > .linked:not(.vertical) > button:checked:not(:only-child), .caja-pathbar button:checked, -.path-bar button:checked, popover.background.menu button:checked, -popover.background button.model:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background 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 button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, .nemo-window .toolbar button:checked, +.path-bar.linked:not(.vertical) > button:checked, layouttabbar button:checked, .mate-panel-menu-bar button:checked, .budgie-panel button:checked, .raven stackswitcher.linked > button:checked, .xfce4-panel.background button:checked, toolbar button:checked, .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked, +popover.background button.model:checked, actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action), .app-notification button:checked, messagedialog.csd .dialog-action-box button:checked, filechooser #pathbarbox > stack > box > button:checked, infobar.info button:checked, infobar.question button:checked, .lock-dialog button:checked, .lightdm-gtk-greeter button:checked, .nemo-window .toolbar button:checked, button.flat:checked { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.87); } combobox > .linked:not(.vertical) > button:checked:disabled:not(:only-child), .caja-pathbar button:checked:disabled, -.path-bar button:checked:disabled, popover.background.menu button:checked:disabled, -popover.background button.model:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar button:checked:disabled, .budgie-panel button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .xfce4-panel.background 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 button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, .nemo-window .toolbar button:checked:disabled, +.path-bar.linked:not(.vertical) > 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, .xfce4-panel.background button:checked:disabled, toolbar button:checked:disabled, .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:checked:disabled:not(.suggested-action):not(.destructive-action), popover.background.menu button:checked:disabled, +popover.background button.model:checked:disabled, actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action), .app-notification button:checked:disabled, messagedialog.csd .dialog-action-box button:checked:disabled, filechooser #pathbarbox > stack > box > button:checked:disabled, infobar.info button:checked:disabled, infobar.question button:checked:disabled, .lock-dialog button:checked:disabled, .lightdm-gtk-greeter button:checked:disabled, .nemo-window .toolbar button:checked:disabled, button.flat:checked:disabled { background-color: alpha(currentColor, 0.12); color: rgba(0, 0, 0, 0.38); @@ -660,7 +672,8 @@ button.text-button { padding-right: 16px; } -toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, .nemo-window .toolbar button.text-button, +toolbar button.text-button, .titlebar button.text-button:not(.suggested-action):not(.destructive-action), popover.background.menu button.text-button, +popover.background button.text-button.model, actionbar > revealer > box button.text-button:not(.suggested-action):not(.destructive-action), .app-notification button.text-button, messagedialog.csd .dialog-action-box button.text-button, filechooser #pathbarbox > stack > box > button.text-button, infobar.info button.text-button, infobar.question button.text-button, .lock-dialog button.text-button, .lightdm-gtk-greeter button.text-button, .nemo-window .toolbar button.text-button, button.text-button.flat { min-width: 48px; padding-left: 8px; @@ -690,12 +703,12 @@ button.text-button.image-button label:last-child { margin-right: 10px; } -toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, +toolbar button.text-button.image-button label:first-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, popover.background.menu button.text-button.image-button label:first-child, popover.background button.text-button.image-button.model label:first-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:first-child, .app-notification button.text-button.image-button label:first-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:first-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:first-child, infobar.info button.text-button.image-button label:first-child, infobar.question button.text-button.image-button label:first-child, .lock-dialog button.text-button.image-button label:first-child, .lightdm-gtk-greeter button.text-button.image-button label:first-child, .nemo-window .toolbar button.text-button.image-button label:first-child, button.text-button.image-button.flat label:first-child { margin-left: 6px; } -toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, +toolbar button.text-button.image-button label:last-child, .titlebar button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, popover.background.menu button.text-button.image-button label:last-child, popover.background button.text-button.image-button.model label:last-child, actionbar > revealer > box button.text-button.image-button:not(.suggested-action):not(.destructive-action) label:last-child, .app-notification button.text-button.image-button label:last-child, messagedialog.csd .dialog-action-box button.text-button.image-button label:last-child, filechooser #pathbarbox > stack > box > button.text-button.image-button label:last-child, infobar.info button.text-button.image-button label:last-child, infobar.question button.text-button.image-button label:last-child, .lock-dialog button.text-button.image-button label:last-child, .lightdm-gtk-greeter button.text-button.image-button label:last-child, .nemo-window .toolbar button.text-button.image-button label:last-child, button.text-button.image-button.flat label:last-child { margin-right: 6px; } @@ -705,13 +718,20 @@ button.text-button.image-button image:not(:only-child) { margin: 0 4px; } -toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), +toolbar .linked:not(.vertical) > button:not(:only-child), .titlebar .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child), +popover.background .linked:not(.vertical) > button.model:not(:only-child), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child), infobar.info .linked:not(.vertical) > button:not(:only-child), infobar.question .linked:not(.vertical) > button:not(:only-child), .lock-dialog .linked:not(.vertical) > button:not(:only-child), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child), toolbar .linked.vertical > button:not(:only-child), .titlebar .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child), +popover.background .linked.vertical > button.model:not(:only-child), actionbar > revealer > box .linked.vertical > button:not(:only-child):not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > button:not(:only-child), messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child), filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child), +infobar.info .linked.vertical > button:not(:only-child), +infobar.question .linked.vertical > button:not(:only-child), +.lock-dialog .linked.vertical > button:not(:only-child), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child), .nemo-window .toolbar .linked.vertical > button:not(:only-child), .linked:not(.vertical) > button.flat:not(:only-child), .linked.vertical > @@ -719,39 +739,33 @@ button.flat:not(:only-child) { border-radius: 2px; } -toolbar .linked:not(.vertical) > button:not(:only-child).image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button, -toolbar .linked.vertical > button:not(:only-child).image-button, -.titlebar .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button, .linked:not(.vertical) > -button.flat:not(:only-child).image-button, +toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .titlebar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), popover.background.menu .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +popover.background .linked:not(.vertical) > button.model:not(:only-child).image-button:not(.text-button), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.info .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), infobar.question .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lock-dialog .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .lightdm-gtk-greeter .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).image-button:not(.text-button), +toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.titlebar .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +popover.background.menu .linked.vertical > button:not(:only-child).image-button:not(.text-button), +popover.background .linked.vertical > button.model:not(:only-child).image-button:not(.text-button), +actionbar > revealer > box .linked.vertical > button:not(:only-child).image-button:not(.text-button):not(.suggested-action):not(.destructive-action), +.app-notification .linked.vertical > button:not(:only-child).image-button:not(.text-button), +messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).image-button:not(.text-button), +filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.info .linked.vertical > button:not(:only-child).image-button:not(.text-button), +infobar.question .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lock-dialog .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.lightdm-gtk-greeter .linked.vertical > button:not(:only-child).image-button:not(.text-button), +.nemo-window .toolbar .linked.vertical > button:not(:only-child).image-button:not(.text-button), .linked:not(.vertical) > +button.flat:not(:only-child).image-button:not(.text-button), .linked.vertical > -button.flat:not(:only-child).image-button { +button.flat:not(:only-child).image-button:not(.text-button) { border-radius: 9999px; } -toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, .titlebar .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked:not(.vertical) > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), .app-notification .linked:not(.vertical) > button:not(:only-child).text-button.image-button, messagedialog.csd .dialog-action-box .linked:not(.vertical) > button:not(:only-child).text-button.image-button, filechooser #pathbarbox > stack > box.linked:not(.vertical) > button:not(:only-child).text-button.image-button, .nemo-window .toolbar .linked:not(.vertical) > button:not(:only-child).text-button.image-button, -toolbar .linked.vertical > button:not(:only-child).text-button.image-button, -.titlebar .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -actionbar > revealer > box .linked.vertical > button:not(:only-child).text-button.image-button:not(.suggested-action):not(.destructive-action), -.app-notification .linked.vertical > button:not(:only-child).text-button.image-button, -messagedialog.csd .dialog-action-box .linked.vertical > button:not(:only-child).text-button.image-button, -filechooser #pathbarbox > stack > box.linked.vertical > button:not(:only-child).text-button.image-button, -.nemo-window .toolbar .linked.vertical > button:not(:only-child).text-button.image-button, .linked:not(.vertical) > -button.flat:not(:only-child).text-button.image-button, -.linked.vertical > -button.flat:not(:only-child).text-button.image-button { - border-radius: 2px; -} - infobar.error button.flat, .mate-panel-menu-bar button, .budgie-panel button, .raven-mpris button.image-button, .xfce4-panel.background button { color: rgba(255, 255, 255, 0.7); } -infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), +infobar.error button.flat:focus, .mate-panel-menu-bar button:focus, .budgie-panel button:focus, .raven-mpris button.image-button:focus, .xfce4-panel.background button:focus, infobar.error button.flat:hover, infobar.error toolbar button:drop(active), toolbar infobar.error button:drop(active), infobar.error .titlebar button:drop(active):not(.suggested-action):not(.destructive-action), .titlebar infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error popover.background.menu button:drop(active), popover.background.menu infobar.error button:drop(active), +infobar.error popover.background button.model:drop(active), popover.background infobar.error button.model:drop(active), infobar.error actionbar > revealer > box button:drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box infobar.error button:drop(active):not(.suggested-action):not(.destructive-action), infobar.error .app-notification button:drop(active), .app-notification infobar.error button:drop(active), infobar.error messagedialog.csd .dialog-action-box button:drop(active), messagedialog.csd .dialog-action-box infobar.error button:drop(active), infobar.error filechooser #pathbarbox > stack > box > button:drop(active), filechooser infobar.error #pathbarbox > stack > box > button:drop(active), infobar.error infobar.info button:drop(active), infobar.info infobar.error button:drop(active), infobar.error infobar.question button:drop(active), infobar.question infobar.error button:drop(active), infobar.error .lock-dialog button:drop(active), .lock-dialog infobar.error button:drop(active), infobar.error .lightdm-gtk-greeter button:drop(active), .lightdm-gtk-greeter infobar.error button:drop(active), infobar.error .nemo-window .toolbar button:drop(active), .nemo-window .toolbar infobar.error button:drop(active), infobar.error button.flat:drop(active), .mate-panel-menu-bar button:hover, .mate-panel-menu-bar button:drop(active), .budgie-panel button:hover, .budgie-panel button:drop(active), .raven-mpris button.image-button:hover, @@ -785,7 +799,7 @@ button.osd:disabled { button.suggested-action { - background-color: #4285F4; + background-color: #1A73E8; color: white; } @@ -798,13 +812,13 @@ button.suggested-action:disabled { button.suggested-action:checked { - background-color: #7baaf7; + background-color: #5f9def; } button.suggested-action.flat { background-color: transparent; - color: #4285F4; + color: #1A73E8; } @@ -816,12 +830,12 @@ button.suggested-action.flat:disabled { button.suggested-action.flat:checked { - background-color: rgba(66, 133, 244, 0.3); + background-color: rgba(26, 115, 232, 0.3); } button.destructive-action { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -834,13 +848,13 @@ button.destructive-action:disabled { button.destructive-action:checked { - background-color: #f07b72; + background-color: #e46e66; } button.destructive-action.flat { background-color: transparent; - color: #EA4335; + color: #D93025; } @@ -852,7 +866,7 @@ button.destructive-action.flat:disabled { button.destructive-action.flat:checked { - background-color: rgba(234, 67, 53, 0.3); + background-color: rgba(217, 48, 37, 0.3); } .stack-switcher > @@ -882,7 +896,7 @@ button { button.image-button, .inline-toolbar button:not(.text-button), check, -radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked > button.disclosure-button:not(.suggested-action):not(.destructive-action), .nautilus-window headerbar revealer > button, .raven .expander-button, +radio, filechooser #pathbarbox > stack > box > button, button.titlebutton, .linked:not(.vertical) > button.disclosure-button:not(.suggested-action):not(.destructive-action):not(:only-child), .nautilus-window headerbar revealer > button, .raven .expander-button, button.close, button.circular { border-radius: 9999px; @@ -928,31 +942,31 @@ spinbutton:not(.vertical) button, notebook > header tab button.flat, button.side border-bottom-right-radius: 0; } -.linked:not(.vertical) > button.image-button:first-child { +.linked:not(.vertical) > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-bottom-left-radius: 2px; } -.linked:not(.vertical) > button.image-button:last-child { +.linked:not(.vertical) > button.image-button:last-child:not(.text-button) { border-top-right-radius: 2px; border-bottom-right-radius: 2px; } -.linked:not(.vertical) > button.image-button:only-child { +.linked:not(.vertical) > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } -.linked.vertical > button.image-button:first-child { +.linked.vertical > button.image-button:first-child:not(.text-button) { border-top-left-radius: 2px; border-top-right-radius: 2px; } -.linked.vertical > button.image-button:last-child { +.linked.vertical > button.image-button:last-child:not(.text-button) { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } -.linked.vertical > button.image-button:only-child { +.linked.vertical > button.image-button:only-child:not(.text-button) { border-radius: 9999px; } @@ -984,7 +998,7 @@ button.color { *********/ *:link, button.link:link, button.link:link:focus, button.link:link:hover, button.link:link:drop(active), button.link:link:active { - color: #4285F4; + color: #1A73E8; } *:visited, button.link:visited, button.link:visited:focus, button.link:visited:hover, @@ -1018,7 +1032,7 @@ spinbutton:not(.vertical) button { spinbutton:not(.vertical) button:focus:not(:hover):not(:active):not(:disabled) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) { @@ -1047,7 +1061,7 @@ spinbutton.vertical button { spinbutton.vertical button:focus:not(:hover):not(:active) { box-shadow: inset 0 0 0 9999px transparent; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } spinbutton.vertical button.up { @@ -1134,7 +1148,7 @@ button.combo:only-child { border-radius: 2px 2px 0 0; font-weight: normal; transition: all 75ms cubic-bezier(0, 0, 0.2, 1), border-image 225ms cubic-bezier(0, 0, 0.2, 1); - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; box-shadow: inset 0 0 0 9999px transparent, inset 0 -1px rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.87); @@ -1150,7 +1164,7 @@ button.combo:only-child:drop(active) { } button.combo:only-child:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } button.combo:only-child:disabled { @@ -1176,12 +1190,12 @@ toolbar.osd, .app-notification, frame.documents-dropdown { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 6px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown { @@ -1259,8 +1273,8 @@ searchbar > revealer > box { .titlebar { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1), color 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - 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.1); - background-color: #383838; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.1); + background-color: #353535; color: white; } @@ -1269,7 +1283,7 @@ searchbar > revealer > box { } .titlebar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1349,13 +1363,13 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.path-bar-box .nautilus-path-bar button:last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar 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; background-color: transparent; color: white; } -.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 button:not(.suggested-action):not(.destructive-action):checked:disabled { +.path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):checked:disabled { background-color: transparent; color: rgba(255, 255, 255, 0.5); } @@ -1373,11 +1387,11 @@ searchbar > revealer > box { color: rgba(255, 255, 255, 0.3); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked { +.path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked { color: rgba(255, 255, 255, 0.7); } -.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 button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { +.path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):last-child:dir(ltr), .path-bar-box .nautilus-path-bar button:backdrop:disabled:not(.suggested-action):not(.destructive-action):first-child:dir(rtl), .titlebar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled { color: rgba(255, 255, 255, 0.3); } @@ -1399,8 +1413,8 @@ searchbar > revealer > box { .titlebar.selection-mode { transition: background-color 0.1ms 225ms, color 75ms cubic-bezier(0, 0, 0.2, 1); animation: ripple-on-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; + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17), inset 0 1px rgba(255, 255, 255, 0.2); + background-color: #1A73E8; color: white; } @@ -1461,7 +1475,7 @@ searchbar > revealer > box { .titlebar .selection-mode { box-shadow: inset 0 1px rgba(255, 255, 255, 0.2); - background-color: #4285F4; + background-color: #1A73E8; } .tiled .titlebar, @@ -1472,7 +1486,7 @@ searchbar > revealer > box { .maximized .titlebar, .fullscreen .titlebar { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .titlebar.default-decoration { @@ -1500,7 +1514,7 @@ searchbar > revealer > box { .solid-csd .titlebar:dir(rtl), .solid-csd .titlebar:dir(ltr) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } headerbar { @@ -1540,41 +1554,41 @@ headerbar .entry-tag, headerbar .documents-entry-tag, headerbar .photos-entry-ta * Pathbars * ************/ .caja-pathbar button, -.path-bar button { +.path-bar.linked:not(.vertical) > button { padding-left: 6px; padding-right: 6px; - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 2px; } .caja-pathbar button:checked, -.path-bar button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; +.path-bar.linked:not(.vertical) > button:checked { + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; } .caja-pathbar button:checked, .caja-pathbar button:checked:disabled, -.path-bar button:checked, -.path-bar button:checked:disabled { +.path-bar.linked:not(.vertical) > button:checked, +.path-bar.linked:not(.vertical) > button:checked:disabled { background-color: transparent; } .caja-pathbar button label:not(:only-child):first-child, -.path-bar button label:not(:only-child):first-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):first-child { margin-left: 0; } .caja-pathbar button label:not(:only-child):last-child, -.path-bar button label:not(:only-child):last-child { +.path-bar.linked:not(.vertical) > button label:not(:only-child):last-child { margin-right: 0; } .caja-pathbar button.text-button, -.path-bar button.text-button { +.path-bar.linked:not(.vertical) > button.text-button { min-width: 0; } .caja-pathbar button.slider-button, -.path-bar button.slider-button { +.path-bar.linked:not(.vertical) > button.slider-button { padding-left: 4px; padding-right: 4px; } @@ -1598,7 +1612,7 @@ treeview.view { treeview.view:selected { background-color: #FFFFFF; - background-image: image(rgba(66, 133, 244, 0.24)); + background-image: image(rgba(26, 115, 232, 0.24)); } treeview.view:hover, treeview.view:selected { @@ -1627,7 +1641,7 @@ treeview.view:drop(active).before { treeview.view.expander { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view.expander:dir(rtl) { @@ -1647,7 +1661,7 @@ treeview.view.expander:disabled { } treeview.view.progressbar { - border-bottom: 4px solid #4285F4; + border-bottom: 4px solid #1A73E8; box-shadow: none; background-color: transparent; background-image: none; @@ -1678,7 +1692,7 @@ treeview.view header button { } treeview.view header button:not(:focus):not(:hover):not(:active) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view header button, treeview.view header button:disabled { @@ -1699,11 +1713,11 @@ treeview.view header.button.dnd { box-shadow: none; background-color: #FFFFFF; background-clip: border-box; - color: #4285F4; + color: #1A73E8; } treeview.view acceleditor > label { - background-color: #4285F4; + background-color: #1A73E8; } /********* @@ -1713,13 +1727,13 @@ menubar, .menubar { -GtkWidget-window-dragging: true; padding: 0; - background-color: #383838; + background-color: #353535; color: white; } menubar:backdrop, .menubar:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -1835,7 +1849,7 @@ menu > arrow, min-width: 16px; padding: 4px; background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu > arrow.top, @@ -1879,7 +1893,7 @@ menu separator, } menuitem accelerator { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menuitem:disabled accelerator { @@ -1892,12 +1906,12 @@ menuitem:disabled accelerator { popover.background { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); padding: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } popover.background:backdrop { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12); } popover.background, .csd popover.background { @@ -1953,7 +1967,7 @@ notebook.frame > header { } notebook:focus tab:checked { - box-shadow: inset 0 0 0 9999px rgba(66, 133, 244, 0.12); + box-shadow: inset 0 0 0 9999px rgba(26, 115, 232, 0.12); } notebook > header { @@ -1976,7 +1990,7 @@ notebook > header.top > tabs > tab { } notebook > header.top > tabs > tab:checked { - border-image-source: linear-gradient(to top, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to top, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.top > tabs > tab.reorderable-page { @@ -1996,7 +2010,7 @@ notebook > header.bottom > tabs > tab { } notebook > header.bottom > tabs > tab:checked { - border-image-source: linear-gradient(to bottom, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to bottom, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.bottom > tabs > tab.reorderable-page { @@ -2016,7 +2030,7 @@ notebook > header.left > tabs > tab { } notebook > header.left > tabs > tab:checked { - border-image-source: linear-gradient(to left, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to left, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.left > tabs > tab.reorderable-page { @@ -2036,7 +2050,7 @@ notebook > header.right > tabs > tab { } notebook > header.right > tabs > tab:checked { - border-image-source: linear-gradient(to right, #4285F4 2px, rgba(0, 0, 0, 0.12) 2px); + border-image-source: linear-gradient(to right, #1A73E8 2px, rgba(0, 0, 0, 0.12) 2px); } notebook > header.right > tabs > tab.reorderable-page { @@ -2103,12 +2117,12 @@ notebook > header tab { border-width: 1px; border-color: transparent; outline: none; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; background-clip: border-box; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -2199,7 +2213,6 @@ notebook > stack:not(:only-child) { scrollbar { transition: all 75ms cubic-bezier(0, 0, 0.2, 1); background-color: #FFFFFF; - background-clip: padding-box; } * { @@ -2234,7 +2247,7 @@ scrollbar slider { } scrollbar slider:hover { - background-color: rgba(0, 0, 0, 0.54); + background-color: rgba(0, 0, 0, 0.6); } scrollbar slider:active { @@ -2355,7 +2368,7 @@ switch { } switch:checked { - background-color: rgba(66, 133, 244, 0.5); + background-color: rgba(26, 115, 232, 0.5); } switch:disabled { @@ -2374,25 +2387,25 @@ switch slider { 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); + box-shadow: 0 0 0 10px transparent, 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); background-color: #FFFFFF; } switch:focus slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.08), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:focus:hover slider { - box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 0 0 10px alpha(currentColor, 0.16), 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } switch:checked slider { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } /************************* @@ -2407,13 +2420,13 @@ switch:checked slider { box-shadow: none; background-color: transparent; background-image: none; - -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list):hover, .view.content-view.check:not(list):active, .content-view .tile check:not(list):hover, .content-view .tile check:not(list):active { - -gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + -gtk-icon-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 3px rgba(0, 0, 0, 0.14), 0 1px 6px rgba(0, 0, 0, 0.12); } .view.content-view.check:not(list), @@ -2452,7 +2465,7 @@ radio { check:checked, check:indeterminate, radio:checked, radio:indeterminate { - color: #4285F4; + color: #1A73E8; } check:checked:disabled, check:indeterminate:disabled, @@ -2475,7 +2488,7 @@ radio:disabled { popover modelbutton.flat check:not(:checked):not(:indeterminate):not(:disabled), popover modelbutton.flat radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover modelbutton.flat check.left:dir(rtl), popover modelbutton.flat @@ -2509,7 +2522,7 @@ radio:dir(rtl) { menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem radio:not(:checked):not(:indeterminate):not(:disabled) { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem @@ -2548,12 +2561,12 @@ radio:indeterminate { radio { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#1A73E8), to(transparent)); } radio:checked:not(:indeterminate) { - border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#4285F4), to(transparent)); + border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#1A73E8), to(transparent)); } @@ -2561,7 +2574,7 @@ radio:checked:not(:indeterminate):disabled { border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(0, 0, 0, 0.26)), to(transparent)); } -window.background:not(.csd) > widget > checkbutton > check, +#MozillaGtkWidget > widget > checkbutton > check, menu menuitem check { min-height: 16px; min-width: 16px; @@ -2569,17 +2582,17 @@ menu menuitem check { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:checked, +#MozillaGtkWidget > widget > checkbutton > check:checked, menu menuitem check:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")); } -window.background:not(.csd) > widget > checkbutton > check:indeterminate, +#MozillaGtkWidget > widget > checkbutton > check:indeterminate, menu menuitem check:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio, +#MozillaGtkWidget > widget > radiobutton > radio, menu menuitem radio { min-height: 16px; min-width: 16px; @@ -2587,12 +2600,12 @@ menu menuitem radio { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:checked, +#MozillaGtkWidget > widget > radiobutton > radio:checked, menu menuitem radio:checked { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")); } -window.background:not(.csd) > widget > radiobutton > radio:indeterminate, +#MozillaGtkWidget > widget > radiobutton > radio:indeterminate, menu menuitem radio:indeterminate { -gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")); } @@ -2611,7 +2624,7 @@ treeview.view radio:selected { treeview.view check, treeview.view radio { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } treeview.view check:hover, treeview.view check:active, @@ -2628,7 +2641,7 @@ treeview.view radio:disabled { treeview.view check:checked, treeview.view check:indeterminate, treeview.view radio:checked, treeview.view radio:indeterminate { - color: #4285F4; + color: #1A73E8; } treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled, @@ -2692,7 +2705,7 @@ scale trough:disabled { scale highlight { transition: background-image 75ms cubic-bezier(0, 0, 0.2, 1); - background-image: image(#4285F4); + background-image: image(#1A73E8); } scale highlight:disabled { @@ -2715,7 +2728,7 @@ scale slider { background-position: center; background-size: auto, 1000% 1000%; border-radius: 50%; - color: #4285F4; + color: #1A73E8; } scale slider { @@ -2748,7 +2761,7 @@ scale slider:active { scale marks, scale value { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } scale indicator { @@ -2890,7 +2903,7 @@ scale.color.vertical:dir(rtl) slider { * Progress bars * *****************/ progressbar { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } @@ -2909,7 +2922,7 @@ progressbar trough { } progressbar progress { - background-color: #4285F4; + background-color: #1A73E8; } progressbar trough.empty progress { @@ -2944,15 +2957,15 @@ levelbar.vertical.discrete block:not(:last-child) { } levelbar block.low { - background-color: #FBBC05; + background-color: #F4B400; } levelbar block.high, levelbar block:not(.empty) { - background-color: #4285F4; + background-color: #1A73E8; } levelbar block.full { - background-color: #34A853; + background-color: #0F9D58; } levelbar block.empty { @@ -3007,7 +3020,7 @@ scrolledwindow viewport.frame { } overshoot.top { - background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center top; background-color: transparent; @@ -3016,7 +3029,7 @@ overshoot.top { } overshoot.bottom { - background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: center bottom; background-color: transparent; @@ -3025,7 +3038,7 @@ overshoot.bottom { } overshoot.left { - background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: left center; background-color: transparent; @@ -3034,7 +3047,7 @@ overshoot.left { } overshoot.right { - background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(66, 133, 244, 0.24)), to(transparent)); + background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(26, 115, 232, 0.24)), to(transparent)); background-repeat: no-repeat; background-position: right center; background-color: transparent; @@ -3044,7 +3057,7 @@ overshoot.right { undershoot.top { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-top: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3054,7 +3067,7 @@ undershoot.top { undershoot.bottom { background-color: transparent; - background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to left, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-bottom: 1px; background-size: 12px 1px; background-repeat: repeat-x; @@ -3064,7 +3077,7 @@ undershoot.bottom { undershoot.left { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-left: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3074,7 +3087,7 @@ undershoot.left { undershoot.right { background-color: transparent; - background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%); + background-image: linear-gradient(to top, transparent 50%, rgba(0, 0, 0, 0.26) 50%); padding-right: 1px; background-size: 1px 12px; background-repeat: repeat-y; @@ -3135,7 +3148,8 @@ row.activatable:focus, treeview.view header button:focus, .budgie-popover.budgie } row.activatable:hover, treeview.view header button:hover, -treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), +treeview.view header button:drop(active), placessidebar.sidebar row.activatable:drop(active), .budgie-popover.budgie-menu button.flat:hover:not(.image-button), .budgie-popover.budgie-menu toolbar button:not(.image-button):drop(active), toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .titlebar button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu popover.background.menu button:not(.image-button):drop(active), popover.background.menu .budgie-popover.budgie-menu button:not(.image-button):drop(active), +.budgie-popover.budgie-menu popover.background button.model:not(.image-button):drop(active), popover.background .budgie-popover.budgie-menu button.model:not(.image-button):drop(active), .budgie-popover.budgie-menu actionbar > revealer > box button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-popover.budgie-menu button:not(.image-button):drop(active):not(.suggested-action):not(.destructive-action), .budgie-popover.budgie-menu .app-notification button:not(.image-button):drop(active), .app-notification .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu messagedialog.csd .dialog-action-box button:not(.image-button):drop(active), messagedialog.csd .dialog-action-box .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu filechooser #pathbarbox > stack > box > button:not(.image-button):drop(active), filechooser .budgie-popover.budgie-menu #pathbarbox > stack > box > button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.info button:not(.image-button):drop(active), infobar.info .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu infobar.question button:not(.image-button):drop(active), infobar.question .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lock-dialog button:not(.image-button):drop(active), .lock-dialog .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .lightdm-gtk-greeter button:not(.image-button):drop(active), .lightdm-gtk-greeter .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu .nemo-window .toolbar button:not(.image-button):drop(active), .nemo-window .toolbar .budgie-popover.budgie-menu button:not(.image-button):drop(active), .budgie-popover.budgie-menu button.flat:not(.image-button):drop(active) { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), box-shadow 0ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1); box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); @@ -3150,7 +3164,7 @@ row.activatable.has-open-popup, treeview.view header button.has-open-popup, .bud } row:selected { - color: #4285F4; + color: #1A73E8; } row:selected image, @@ -3175,6 +3189,10 @@ row:selected:disabled label { margin: 8px; } +.app-notification button.text-button:not(:disabled) { + color: #1A73E8; +} + .app-notification.frame, .app-notification border { border-style: none; @@ -3189,7 +3207,7 @@ expander title > arrow { min-height: 16px; -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -gtk-icon-transform: rotate(-90deg); - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } expander title > arrow:dir(rtl) { @@ -3232,7 +3250,7 @@ calendar.header { } calendar.highlight { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -3257,7 +3275,7 @@ messagedialog .titlebar { messagedialog .titlebar:backdrop { background-color: #FFFFFF; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } messagedialog.csd.background { @@ -3275,11 +3293,11 @@ messagedialog.csd .dialog-action-box button:not(:last-child) { } messagedialog.csd .dialog-action-box button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } messagedialog.csd .dialog-action-box button.destructive-action:not(:disabled) { - color: #EA4335; + color: #D93025; } filechooser .dialog-action-box { @@ -3330,6 +3348,7 @@ stacksidebar.sidebar row { stacksidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } @@ -3351,7 +3370,12 @@ separator.sidebar { * File chooser * ****************/ row image.sidebar-icon { - color: rgba(0, 0, 0, 0.54); + transition: color 75ms cubic-bezier(0, 0, 0.2, 1); + color: rgba(0, 0, 0, 0.6); +} + +row image.sidebar-icon:disabled { + color: rgba(0, 0, 0, 0.26); } placessidebar.sidebar > viewport.frame { @@ -3375,9 +3399,14 @@ placessidebar.sidebar row > revealer { placessidebar.sidebar row:selected { background-color: alpha(currentColor, 0.12); + color: #1A73E8; font-weight: 500; } +placessidebar.sidebar row:selected image.sidebar-icon { + color: #1A73E8; +} + placessidebar.sidebar row:disabled { color: rgba(0, 0, 0, 0.38); } @@ -3390,6 +3419,10 @@ placessidebar.sidebar row image.sidebar-icon:dir(rtl) { padding-left: 8px; } +placessidebar.sidebar row label.sidebar-label { + color: inherit; +} + placessidebar.sidebar row label.sidebar-label:dir(ltr) { padding-right: 2px; } @@ -3398,17 +3431,16 @@ placessidebar.sidebar row label.sidebar-label:dir(rtl) { padding-left: 2px; } -placessidebar.sidebar row:selected image.sidebar-icon, -placessidebar.sidebar row:selected label.sidebar-label { - color: inherit; -} - placessidebar.sidebar row.sidebar-placeholder-row { background-color: alpha(currentColor, 0.08); } placessidebar.sidebar row.sidebar-new-bookmark-row { - color: #4285F4; + color: #1A73E8; +} + +placessidebar.sidebar row.sidebar-new-bookmark-row image.sidebar-icon { + color: #1A73E8; } placesview .server-list-button > image { @@ -3495,17 +3527,12 @@ infobar.info, infobar.question { background-color: #FFFFFF; } -infobar.info button.text-button, infobar.question button.text-button { - padding-left: 8px; - padding-right: 8px; -} - infobar.info button.text-button:not(:disabled), infobar.question button.text-button:not(:disabled) { - color: #4285F4; + color: #1A73E8; } infobar.warning { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -3514,7 +3541,7 @@ infobar.warning *:link, infobar.warning button.link:link { } infobar.error { - background-color: #EA4335; + background-color: #D93025; color: white; } @@ -3598,15 +3625,15 @@ colorswatch.light { colorswatch overlay { transition: box-shadow 75ms 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); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } colorswatch overlay:hover { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch overlay:drop(active) { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 3px 2.4px 0 rgba(0, 0, 0, 0.14), 0 1px 4.8px 0 rgba(0, 0, 0, 0.12); } colorswatch#add-color-button { @@ -3641,12 +3668,12 @@ colorswatch#editor-color-sample overlay { colorchooser .popover.osd { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } colorchooser .popover.osd:backdrop { - 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.4); + box-shadow: 0 3px 2px -3px rgba(0, 0, 0, 0.3), 0 2px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 3px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); } /******** @@ -3662,12 +3689,12 @@ colorchooser .popover.osd:backdrop { decoration { transition: box-shadow 75ms cubic-bezier(0, 0, 0.2, 1); border-radius: 2px 2px 0 0; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; margin: 8px; } decoration:backdrop { - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 16px 14.4px 2px transparent, 0 6px 18px 5px transparent; } .maximized decoration, @@ -3690,7 +3717,7 @@ decoration:backdrop { .csd.popup decoration { border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); } tooltip.csd decoration { @@ -3706,13 +3733,13 @@ messagedialog.csd decoration { margin: 0; border-radius: 0; box-shadow: none; - background-color: #383838; + background-color: #353535; } .view selection, .view:selected, flowbox flowboxchild:selected, label selection, spinbutton:not(.vertical) selection, entry selection, modelbutton.flat:selected, .menuitem.button.flat:selected, row:selected, calendar:selected, .nautilus-window flowboxchild:selected .icon-item-background, box.vertical > widget > widget:selected, .budgie-popover.budgie-menu button.flat:not(.image-button):checked, calendar.raven-calendar:selected, XfdesktopIconView.view:active, .nemo-window .nemo-window-pane widget.entry:selected { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); } .monospace { @@ -3723,7 +3750,7 @@ entry selection, modelbutton.flat:selected, * Touch Copy & Paste * **********************/ cursor-handle { - color: #4285F4; + color: #1A73E8; -gtk-icon-source: -gtk-recolor(url("assets/scalable/cursor-handle-symbolic.svg")); } @@ -3760,7 +3787,7 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) } :not(decoration):not(window):drop(active) { - caret-color: #4285F4; + caret-color: #1A73E8; } stackswitcher button.text-button { @@ -3801,7 +3828,7 @@ button.emoji-section { } button.emoji-section:checked { - color: #4285F4; + color: #1A73E8; } button.emoji-section:not(:last-child) { @@ -3852,12 +3879,12 @@ popover.emoji-completion .emoji:hover { .nautilus-canvas-item.dim-label, .nautilus-list-dim-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-desktop.nautilus-canvas-item, .caja-desktop.caja-canvas-item, .nemo-desktop.nemo-canvas-item { color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } @keyframes nautilus-operations-button-needs-attention { @@ -3901,20 +3928,24 @@ popover.emoji-completion .emoji:hover { margin-right: 0; } -.path-bar-box .nautilus-path-bar button { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) { padding-left: 6px; padding-right: 6px; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):first-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button { + min-width: 0; +} + +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):first-child { margin-left: 0; } -.path-bar-box .nautilus-path-bar button label:not(:only-child):last-child { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action) label:not(:only-child):last-child { margin-right: 0; } -.path-bar-box .nautilus-path-bar button.text-button.image-button image:not(:only-child) { +.path-bar-box .nautilus-path-bar button:not(.suggested-action):not(.destructive-action).text-button.image-button image:not(:only-child) { margin: 0; } @@ -3926,7 +3957,6 @@ popover.emoji-completion .emoji:hover { border-color: rgba(0, 0, 0, 0.12); border-radius: 3px 3px 0 0; background-color: rgba(255, 255, 255, 0.9); - background-clip: padding-box; } .nautilus-window .floating-bar.bottom.left { @@ -3951,8 +3981,8 @@ popover.emoji-completion .emoji:hover { } .disk-space-display.used { - background-color: #4285F4; - color: #4285F4; + background-color: #1A73E8; + color: #1A73E8; } .disk-space-display.free { @@ -3968,7 +3998,7 @@ popover.emoji-completion .emoji:hover { } .conflict-row:not(:selected) { - background-color: #feebb4; + background-color: #fce9b3; } .nautilus-window flowboxchild .icon-item-background { @@ -4023,23 +4053,23 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: } .nautilus-menu-sort-heading:disabled { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .nautilus-window paned > separator { - background-color: #F2F2F2; + background-color: #FAFAFA; } /********* * gedit * *********/ .open-document-selector-path-label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-size: smaller; } .open-document-selector-match { - background-color: #FBBC05; + background-color: #F4B400; color: rgba(0, 0, 0, 0.87); } @@ -4070,7 +4100,7 @@ dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal: .gedit-search-slider .linked:not(.vertical) > entry .gedit-search-entry-occurrences-tag { all: unset; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .gedit-search-slider .linked:not(.vertical) > entry:dir(ltr) { @@ -4220,7 +4250,7 @@ layouttab { border-style: none solid; border-width: 1px; border-color: rgba(0, 0, 0, 0.12); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: #FFFFFF; } @@ -4240,12 +4270,12 @@ layout { } entry.search-missing { - background-color: #EA4335; + background-color: #D93025; color: white; } window.workbench treeview.image { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.popover-selector list { @@ -4277,7 +4307,7 @@ omnibar.linked:not(.vertical) entry { } omnibar:not(:hover):not(:active) entry { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } popover.omnibar list row:not(:last-child) { @@ -4370,11 +4400,11 @@ docktab { border-width: 1px; border-color: transparent; box-shadow: inset 0 -2px transparent; - background-image: radial-gradient(circle, #4285F4 10%, transparent 0%); + background-image: radial-gradient(circle, #1A73E8 10%, transparent 0%); background-repeat: no-repeat; background-position: center; background-size: 0% 0%; - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); font-weight: 500; } @@ -4385,7 +4415,7 @@ docktab:hover { docktab:checked { transition: all 75ms cubic-bezier(0, 0, 0.2, 1), background-size 225ms cubic-bezier(0, 0, 0.2, 1), background-image 525ms cubic-bezier(0, 0, 0.2, 1); - box-shadow: inset 0 -2px #4285F4; + box-shadow: inset 0 -2px #1A73E8; background-color: transparent; background-image: radial-gradient(circle, transparent 10%, transparent 0%); background-size: 1000% 1000%; @@ -4402,11 +4432,11 @@ dockoverlayedge docktabstrip { } dockoverlayedge.left-edge docktab:checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } dockoverlayedge.right-edge docktab:checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } pillbox { @@ -4490,7 +4520,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button { } ideeditorutilities > dzldockpaned > box > stackswitcher button:active { - background-image: radial-gradient(circle, rgba(66, 133, 244, 0.7) 10%, transparent 0%); + background-image: radial-gradient(circle, rgba(26, 115, 232, 0.7) 10%, transparent 0%); } ideeditorutilities > dzldockpaned > box > stackswitcher button:checked { @@ -4503,7 +4533,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):checked { - box-shadow: inset -2px 0 #4285F4; + box-shadow: inset -2px 0 #1A73E8; } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { @@ -4511,7 +4541,7 @@ ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) { } ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):checked { - box-shadow: inset 2px 0 #4285F4; + box-shadow: inset 2px 0 #1A73E8; } ideeditorsidebar notebook header { @@ -4536,8 +4566,8 @@ GdMainIconView.content-view { .documents-counter { margin: 8px; border-radius: 9999px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); - background-color: #4285F4; + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); + background-color: #1A73E8; color: white; font-weight: bold; } @@ -4566,13 +4596,13 @@ button.photos-filter-preview { } button.photos-filter-preview:checked { - background-color: rgba(66, 133, 244, 0.24); + background-color: rgba(26, 115, 232, 0.24); 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); + -gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) { @@ -4605,11 +4635,11 @@ overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) { } .side-panel .view:selected { - background-image: image(#4285F4); + background-image: image(#1A73E8); } .side-panel .view:selected:hover { - background-image: image(#518ff5); + background-image: image(#2c7eea); } .songs-list:hover { @@ -4735,7 +4765,7 @@ list.categories { min-height: 24px; padding: 0 4px; border-radius: 2px; - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -4773,7 +4803,7 @@ button.title label { overlay > revealer.left > scrolledwindow.frame, overlay > revealer.right > scrolledwindow.frame { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } overlay > revealer.left > scrolledwindow.frame { @@ -4797,6 +4827,15 @@ button.image-button.session-new-button { min-width: 32px; } +notebook.tilix-background tab > box > stack { + margin: -6px; +} + +button.flat.tilix-small-button { + min-height: 20px; + min-width: 16px; +} + /************** * Terminator * **************/ @@ -4836,37 +4875,46 @@ window.background > box.vertical > scrolledwindow > widget toolbar button { * Chromium * ************/ window.background.chromium { - background-color: #F2F2F2; + background-color: #FFFFFF; } window.background.chromium entry, -window.background.chromium > button:not(.suggested-action):not(.destructive-action) { +window.background.chromium > button { border: 1px solid rgba(0, 0, 0, 0.26); } window.background.chromium > button { - box-shadow: none; - background-size: auto; + color: #1A73E8; } -window.background.chromium > button:hover, -window.background.chromium > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +window.background.chromium > button:disabled { + color: rgba(0, 0, 0, 0.26); } -window.background.chromium > button:active { - background-image: image(alpha(currentColor, 0.12)); +window.background.chromium menubar, +window.background.chromium headerbar { + color: rgba(255, 255, 255, 0.7); } window.background.chromium headerbar button:active { - background-size: 1000% 1000%; + background-color: alpha(currentColor, 0.12); } window.background.chromium spinner { - color: #4285F4; + color: #1A73E8; +} + +window.background.chromium textview.view { + background-color: transparent; +} + +window.background.chromium treeview.view.cell:selected:focus { + background-color: #1A73E8; + color: white; } -window.background.chromium textview { +window.background.chromium treeview.view button { + border: 1px solid rgba(0, 0, 0, 0.26); background-color: #FFFFFF; } @@ -4877,103 +4925,106 @@ tooltip.background.chromium { /*********** * Firefox * ***********/ -window.background:not(.csd) > widget > separator { - color: rgba(0, 0, 0, 0.26); +#MozillaGtkWidget > widget text { + background-color: #FFFFFF; } -window.background:not(.csd) > widget > scrollbar { - background-clip: border-box; +#MozillaGtkWidget > widget text:selected { + background-color: #1A73E8; + color: white; +} + +#MozillaGtkWidget > widget > separator { + color: rgba(0, 0, 0, 0.12); } -window.background:not(.csd) > widget > scrollbar, -window.background:not(.csd) > widget > frame > border { +#MozillaGtkWidget > widget > frame > border { border-color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > entry, -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > entry, +#MozillaGtkWidget > widget > button > button { border: 1px solid rgba(0, 0, 0, 0.26); border-radius: 2px; box-shadow: none; } -window.background:not(.csd) > widget > entry { +#MozillaGtkWidget > widget > entry:disabled, +#MozillaGtkWidget > widget > button > button:disabled { + border-color: rgba(0, 0, 0, 0.12); +} + +#MozillaGtkWidget > widget > entry { min-height: 30px; background-color: #FFFFFF; } -window.background:not(.csd) > widget > entry:focus { - border-color: #4285F4; - box-shadow: inset 0 0 0 1px #4285F4; +#MozillaGtkWidget > widget > entry:focus { + border-color: #1A73E8; + box-shadow: inset 0 0 0 1px #1A73E8; } -window.background:not(.csd) > widget > entry:disabled { +#MozillaGtkWidget > widget > entry:disabled { background-color: #FAFAFA; } -window.background:not(.csd) > widget > button > button { +#MozillaGtkWidget > widget > button > button { padding: 4px 8px; background-size: auto; } -window.background:not(.csd) > widget > button > button:hover, -window.background:not(.csd) > widget > button > button:drop(active) { - background-image: image(alpha(currentColor, 0.08)); +#MozillaGtkWidget > widget > button > button:hover, +#MozillaGtkWidget > widget > button > button:drop(active) { + box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08); } -window.background:not(.csd) > widget > button > button:active { +#MozillaGtkWidget > widget > button > button:active { background-image: image(alpha(currentColor, 0.12)); } -window.background:not(.csd) > widget > checkbutton > check:not(:checked), -window.background:not(.csd) > widget > radiobutton > radio:not(:checked) { +#MozillaGtkWidget > widget > checkbutton > check, +#MozillaGtkWidget > widget > radiobutton > radio { + margin: 0; + padding: 0; +} + +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate), +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate) { color: #757575; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):hover, #MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):active, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):hover, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):active { color: #212121; } -window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled, -window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled { +#MozillaGtkWidget > widget > checkbutton > check:not(:checked):not(:indeterminate):disabled, +#MozillaGtkWidget > widget > radiobutton > radio:not(:checked):not(:indeterminate):disabled { color: rgba(117, 117, 117, 0.5); } -window.background:not(.csd) > window > menu, -window.background:not(.csd) > menu > menu { +#MozillaGtkWidget menu { border: none; } -text:selected { - background-color: #4285F4; - color: white; -} - -window.background:not(.csd) > widget > menubar { +#MozillaGtkWidget > widget > menubar { color: rgba(255, 255, 255, 0.7); } -window.background:not(.csd) > widget > menubar:hover { +#MozillaGtkWidget > widget > menubar:hover { color: white; } -window.background:not(.csd) > widget > menubar:disabled { +#MozillaGtkWidget > widget > menubar:disabled { color: rgba(255, 255, 255, 0.3); } -window.background:not(.csd) > widget > frame { +#MozillaGtkWidget > widget > frame { color: rgba(0, 0, 0, 0.26); } -window.background:not(.csd) > widget > checkbutton > check, -window.background:not(.csd) > widget > radiobutton > radio { - margin: 0; - padding: 0; -} - -window.background:not(.csd) > window.background > menu > separator { +#MozillaGtkWidget menu > separator { color: rgba(0, 0, 0, 0.12); } @@ -5069,7 +5120,7 @@ UnityDecoration { -UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32); -UnityDecoration-inactive-shadow-radius: 6px; -UnityDecoration-glow-size: 8px; - -UnityDecoration-glow-color: #4285F4; + -UnityDecoration-glow-color: #1A73E8; -UnityDecoration-title-indent: 4px; -UnityDecoration-title-fade: 32px; -UnityDecoration-title-alignment: 0.0; @@ -5080,12 +5131,12 @@ UnityDecoration .top { border-style: none; border-radius: 2px 2px 0 0; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - background-color: #383838; + background-color: #353535; color: white; } UnityDecoration .top:backdrop { - background-color: #303030; + background-color: #2C2C2C; color: rgba(255, 255, 255, 0.7); } @@ -5101,7 +5152,7 @@ UnityDecoration .menuitem:hover { .background:not(.csd) headerbar:not(.titlebar) { border-radius: 0; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.24), 0 1px 2px -0.6px rgba(0, 0, 0, 0.17); } .background:not(.csd) headerbar:not(.titlebar).inline-toolbar { @@ -5110,7 +5161,7 @@ UnityDecoration .menuitem:hover { UnityPanelWidget, .unity-panel { - background-color: #d6d6d6; + background-color: #1F1F1F; color: white; } @@ -5134,7 +5185,7 @@ UnityPanelWidget:backdrop, .menu IdoPlaybackMenuItem.menuitem:active { -gtk-icon-source: -gtk-icontheme("process-working-symbolic"); animation: spin 1s linear infinite; - color: #4285F4; + color: #1A73E8; } /************** @@ -5146,7 +5197,7 @@ UnityPanelWidget:backdrop, } .mate-panel-menu-bar { - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -5256,7 +5307,7 @@ PanelApplet.wnck-applet .wnck-pager:active { } PanelApplet.wnck-applet .wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } .mate-panel-menu-bar.horizontal #clock-applet-button label { @@ -5352,7 +5403,7 @@ na-tray-applet { #mate-menu button image, #mate-menu button label + label { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } #mate-menu entry { @@ -5400,7 +5451,7 @@ na-tray-applet { } .brisk-menu .categories-list button:checked { - color: #4285F4; + color: #1A73E8; } .brisk-menu .session-button { @@ -5441,6 +5492,10 @@ na-tray-applet { margin: 0 -1px 0 -2px; } +.caja-pathbar button.slider-button { + min-width: 24px; +} + .caja-pathbar button > widget { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); -GtkArrow-arrow-scaling: 1; @@ -5461,6 +5516,35 @@ na-tray-applet { border-style: none; } +.caja-canvas-item { + border-radius: 2px; +} + +.caja-desktop.view .entry, +.caja-navigation-window .view .entry { + border: none; + border-radius: 2px; + background-color: rgba(0, 0, 0, 0.04); + background-image: none; + color: rgba(0, 0, 0, 0.87); +} + +.caja-desktop.view .entry:selected, +.caja-navigation-window .view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + +.caja-desktop.view .entry { + background-color: rgba(0, 0, 0, 0.3); + color: white; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); + caret-color: currentColor; +} + +.caja-desktop.view .entry:selected { + background-color: rgba(26, 115, 232, 0.24); +} + .caja-navigation-window statusbar { margin: 0 -10px; padding: 0 4px; @@ -5539,7 +5623,7 @@ na-tray-applet { .lock-dialog { border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 3px; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -5547,6 +5631,10 @@ na-tray-applet { border-style: none; } +.lock-dialog button:not(:disabled) { + color: #1A73E8; +} + /* multimedia OSD */ MsdOsdWindow.background.osd { border-radius: 2px; @@ -5561,7 +5649,7 @@ MsdOsdWindow.background.osd .trough { MsdOsdWindow.background.osd .progressbar { border-radius: 0; - background-color: #4285F4; + background-color: #1A73E8; } /****************** @@ -5584,7 +5672,7 @@ MsdOsdWindow.background.osd .progressbar { border-width: 1px; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); border-radius: 3px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); background-color: #FFFFFF; } @@ -5780,13 +5868,13 @@ MsdOsdWindow.background.osd .progressbar { .budgie-panel { transition: background-color 75ms cubic-bezier(0, 0, 0.2, 1); - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } .budgie-panel.transparent { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); } .budgie-panel button { @@ -5809,7 +5897,7 @@ MsdOsdWindow.background.osd .progressbar { } .budgie-panel .alert { - color: #EA4335; + color: #D93025; } .budgie-panel .titlebar:not(headerbar) { @@ -5845,7 +5933,8 @@ MsdOsdWindow.background.osd .progressbar { color: rgba(255, 255, 255, 0.5); } -.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel toolbar button.launcher:not(:checked):drop(active), toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .titlebar button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .titlebar .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel popover.background.menu button.launcher:not(:checked):drop(active), popover.background.menu .budgie-panel button.launcher:not(:checked):drop(active), +.budgie-panel popover.background button.launcher.model:not(:checked):drop(active), popover.background .budgie-panel button.launcher.model:not(:checked):drop(active), .budgie-panel actionbar > revealer > box button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .budgie-panel button.launcher:not(:checked):drop(active):not(.suggested-action):not(.destructive-action), .budgie-panel .app-notification button.launcher:not(:checked):drop(active), .app-notification .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel messagedialog.csd .dialog-action-box button.launcher:not(:checked):drop(active), messagedialog.csd .dialog-action-box .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel filechooser #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), filechooser .budgie-panel #pathbarbox > stack > box > button.launcher:not(:checked):drop(active), .budgie-panel infobar.info button.launcher:not(:checked):drop(active), infobar.info .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel infobar.question button.launcher:not(:checked):drop(active), infobar.question .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lock-dialog button.launcher:not(:checked):drop(active), .lock-dialog .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .lightdm-gtk-greeter button.launcher:not(:checked):drop(active), .lightdm-gtk-greeter .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel .nemo-window .toolbar button.launcher:not(:checked):drop(active), .nemo-window .toolbar .budgie-panel button.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):drop(active), .budgie-panel button.flat.launcher:not(:checked):active { color: rgba(255, 255, 255, 0.7); } @@ -5892,7 +5981,7 @@ MsdOsdWindow.background.osd .progressbar { frame.raven-frame > border { border-style: none; - box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); + box-shadow: 0 8px 6px -5px rgba(0, 0, 0, 0.2), 0 16px 14.4px 2px rgba(0, 0, 0, 0.14), 0 6px 18px 5px rgba(0, 0, 0, 0.12); } .top frame.raven-frame > border { @@ -5920,12 +6009,12 @@ frame.raven-frame > border { } .raven stackswitcher.linked > button { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 0%, transparent 0%) 0 0 0/0 0 0px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 0%, transparent 0%) 0 0 0/0 0 0px; border-radius: 0; } .raven stackswitcher.linked > button:checked { - border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #4285F4 100%, transparent 0%) 0 0 2/0 0 2px; + border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #1A73E8 100%, transparent 0%) 0 0 2/0 0 2px; background-color: transparent; } @@ -5991,7 +6080,7 @@ calendar.raven-calendar:selected { } .raven-mpris { - background-color: rgba(0, 0, 0, 0); + background-color: rgba(0, 0, 0, 0.6); color: white; } @@ -6012,7 +6101,7 @@ calendar.raven-calendar:selected { } .budgie-notification .notification-body, .budgie-switcher .notification-body { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-osd .budgie-osd-text { @@ -6023,7 +6112,7 @@ calendar.raven-calendar:selected { margin: 5px 9px; padding: 3px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6061,11 +6150,11 @@ calendar.raven-calendar:selected { } .budgie-polkit-dialog .message { - color: rgba(0, 0, 0, 0.54); + color: rgba(0, 0, 0, 0.6); } .budgie-polkit-dialog .failure { - color: #EA4335; + color: #D93025; } .budgie-run-dialog { @@ -6100,7 +6189,7 @@ calendar.raven-calendar:selected { ***************/ .xfce4-panel.background { border: none; - background-color: #303030; + background-color: #1F1F1F; color: rgba(255, 255, 255, 0.7); font-weight: 500; } @@ -6133,14 +6222,14 @@ wnck-pager:active { } wnck-pager:selected { - background-color: #4285F4; + background-color: #1A73E8; } XfdesktopIconView.view { border-radius: 2px; background-color: transparent; color: white; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.12); } XfdesktopIconView.view:active { @@ -6191,7 +6280,7 @@ XfdesktopIconView.view .rubberband { * LightDM GTK+ Greeter * ************************/ #panel_window { - background-color: rgba(0, 0, 0, 0.6); + background-color: rgba(0, 0, 0, 0.3); color: white; } @@ -6225,7 +6314,7 @@ XfdesktopIconView.view .rubberband { #restart_dialog { margin: 8px; border-radius: 2px; - box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4); + box-shadow: 0 3px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 6px 0 rgba(0, 0, 0, 0.14), 0 1px 10.8px 0 rgba(0, 0, 0, 0.12), inset 0 1px rgba(255, 255, 255, 0.4); background-color: #FFFFFF; } @@ -6233,6 +6322,10 @@ XfdesktopIconView.view .rubberband { padding-bottom: 16px; } +.lightdm-gtk-greeter button:not(:disabled) { + color: #1A73E8; +} + #buttonbox_frame { padding-top: 24px; } @@ -6286,7 +6379,7 @@ XfdesktopIconView.view .rubberband { .places-treeview { -NemoPlacesTreeView-disk-full-bg-color: rgba(182, 182, 182, 0.961); - -NemoPlacesTreeView-disk-full-fg-color: #4285F4; + -NemoPlacesTreeView-disk-full-fg-color: #1A73E8; -NemoPlacesTreeView-disk-full-bar-width: 2px; -NemoPlacesTreeView-disk-full-bar-radius: 0; -NemoPlacesTreeView-disk-full-bottom-padding: 1px; @@ -6310,7 +6403,7 @@ text widgets and the like base background color */ @define-color theme_base_color #FFFFFF; /* base background color of selections */ -@define-color theme_selected_bg_color #4285F4; +@define-color theme_selected_bg_color #1A73E8; /* text/foreground color of selections */ @define-color theme_selected_fg_color white; @@ -6337,7 +6430,7 @@ text widgets and the like base background color on backdrop windows */ @define-color theme_unfocused_base_color #FFFFFF; /* base background color of selections on backdrop windows */ -@define-color theme_unfocused_selected_bg_color #4285F4; +@define-color theme_unfocused_selected_bg_color #1A73E8; /* text/foreground color of selections on backdrop windows */ @define-color theme_unfocused_selected_fg_color white; @@ -6352,18 +6445,18 @@ widgets main borders color on backdrop windows */ @define-color unfocused_borders rgba(0, 0, 0, 0.12); /* these are pretty self explicative */ -@define-color warning_color #FBBC05; -@define-color error_color #EA4335; -@define-color success_color #34A853; +@define-color warning_color #F4B400; +@define-color error_color #D93025; +@define-color success_color #0F9D58; /* these colors are exported for the window manager and shouldn't be used in applications, read if you used those and something break with a version upgrade you're on your own... */ @define-color wm_title white; @define-color wm_unfocused_title rgba(255, 255, 255, 0.7); @define-color wm_highlight rgba(255, 255, 255, 0.1); -@define-color wm_bg #383838; -@define-color wm_unfocused_bg #303030; +@define-color wm_bg #353535; +@define-color wm_unfocused_bg #2C2C2C; /* FIXME this is really an API */ @define-color content_view_bg #FFFFFF; -@define-color placeholder_text_color #757575; +@define-color placeholder_text_color #666666; diff --git a/src/gtk/assets.svg b/src/gtk/assets.svg index 1b5f09a8b..1cae59e2f 100644 --- a/src/gtk/assets.svg +++ b/src/gtk/assets.svg @@ -21,7 +21,7 @@ - + @@ -29,11 +29,11 @@ - + - + @@ -41,7 +41,7 @@ - + diff --git a/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark.png b/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark.png index cc82f0cd7..370c46623 100644 Binary files a/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark.png and b/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark.png differ diff --git a/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark@2.png b/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark@2.png index edad3d56b..f34dfd121 100644 Binary files a/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark@2.png and b/src/gtk/assets/scale-horz-marks-after-slider-disabled-dark@2.png differ diff --git a/src/gtk/assets/scale-horz-marks-after-slider-disabled.png b/src/gtk/assets/scale-horz-marks-after-slider-disabled.png index 98b9d142b..28fe8d995 100644 Binary files a/src/gtk/assets/scale-horz-marks-after-slider-disabled.png and b/src/gtk/assets/scale-horz-marks-after-slider-disabled.png differ diff --git a/src/gtk/assets/scale-horz-marks-after-slider-disabled@2.png b/src/gtk/assets/scale-horz-marks-after-slider-disabled@2.png index 7b679d15e..35cf89462 100644 Binary files a/src/gtk/assets/scale-horz-marks-after-slider-disabled@2.png and b/src/gtk/assets/scale-horz-marks-after-slider-disabled@2.png differ diff --git a/src/gtk/assets/scale-horz-marks-after-slider.png b/src/gtk/assets/scale-horz-marks-after-slider.png index 7c5a39480..b7afd2450 100644 Binary files a/src/gtk/assets/scale-horz-marks-after-slider.png and b/src/gtk/assets/scale-horz-marks-after-slider.png differ diff --git a/src/gtk/assets/scale-horz-marks-after-slider@2.png b/src/gtk/assets/scale-horz-marks-after-slider@2.png index 699e8f8ec..07e397917 100644 Binary files a/src/gtk/assets/scale-horz-marks-after-slider@2.png and b/src/gtk/assets/scale-horz-marks-after-slider@2.png differ diff --git a/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark.png b/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark.png index 68026a53e..831ecf3c9 100644 Binary files a/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark.png and b/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark.png differ diff --git a/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark@2.png b/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark@2.png index 7d00f773c..ec47f7eca 100644 Binary files a/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark@2.png and b/src/gtk/assets/scale-horz-marks-before-slider-disabled-dark@2.png differ diff --git a/src/gtk/assets/scale-horz-marks-before-slider-disabled.png b/src/gtk/assets/scale-horz-marks-before-slider-disabled.png index 11e0dd4e1..af41e7fe9 100644 Binary files a/src/gtk/assets/scale-horz-marks-before-slider-disabled.png and b/src/gtk/assets/scale-horz-marks-before-slider-disabled.png differ diff --git a/src/gtk/assets/scale-horz-marks-before-slider-disabled@2.png b/src/gtk/assets/scale-horz-marks-before-slider-disabled@2.png index b118d5bc5..5c79ee066 100644 Binary files a/src/gtk/assets/scale-horz-marks-before-slider-disabled@2.png and b/src/gtk/assets/scale-horz-marks-before-slider-disabled@2.png differ diff --git a/src/gtk/assets/scale-horz-marks-before-slider.png b/src/gtk/assets/scale-horz-marks-before-slider.png index 4d9fd336a..5080a1697 100644 Binary files a/src/gtk/assets/scale-horz-marks-before-slider.png and b/src/gtk/assets/scale-horz-marks-before-slider.png differ diff --git a/src/gtk/assets/scale-horz-marks-before-slider@2.png b/src/gtk/assets/scale-horz-marks-before-slider@2.png index 8f2ff80c5..859994896 100644 Binary files a/src/gtk/assets/scale-horz-marks-before-slider@2.png and b/src/gtk/assets/scale-horz-marks-before-slider@2.png differ diff --git a/src/gtk/assets/scale-slider-disabled-dark.png b/src/gtk/assets/scale-slider-disabled-dark.png index f7165aee7..efa6f93cd 100644 Binary files a/src/gtk/assets/scale-slider-disabled-dark.png and b/src/gtk/assets/scale-slider-disabled-dark.png differ diff --git a/src/gtk/assets/scale-slider-disabled-dark@2.png b/src/gtk/assets/scale-slider-disabled-dark@2.png index 4da807b57..70d1228a7 100644 Binary files a/src/gtk/assets/scale-slider-disabled-dark@2.png and b/src/gtk/assets/scale-slider-disabled-dark@2.png differ diff --git a/src/gtk/assets/scale-slider-disabled.png b/src/gtk/assets/scale-slider-disabled.png index 1faf77403..d61eeec75 100644 Binary files a/src/gtk/assets/scale-slider-disabled.png and b/src/gtk/assets/scale-slider-disabled.png differ diff --git a/src/gtk/assets/scale-slider-disabled@2.png b/src/gtk/assets/scale-slider-disabled@2.png index dc8927495..89fe2b643 100644 Binary files a/src/gtk/assets/scale-slider-disabled@2.png and b/src/gtk/assets/scale-slider-disabled@2.png differ diff --git a/src/gtk/assets/scale-slider.png b/src/gtk/assets/scale-slider.png index 265d4424d..603e9a2bc 100644 Binary files a/src/gtk/assets/scale-slider.png and b/src/gtk/assets/scale-slider.png differ diff --git a/src/gtk/assets/scale-slider@2.png b/src/gtk/assets/scale-slider@2.png index 590039bf3..bbc609458 100644 Binary files a/src/gtk/assets/scale-slider@2.png and b/src/gtk/assets/scale-slider@2.png differ diff --git a/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark.png b/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark.png index a4af8b419..36310fd72 100644 Binary files a/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark.png and b/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark.png differ diff --git a/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark@2.png b/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark@2.png index e2e626785..34d5a849f 100644 Binary files a/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark@2.png and b/src/gtk/assets/scale-vert-marks-after-slider-disabled-dark@2.png differ diff --git a/src/gtk/assets/scale-vert-marks-after-slider-disabled.png b/src/gtk/assets/scale-vert-marks-after-slider-disabled.png index ec40952a8..8ba36eb80 100644 Binary files a/src/gtk/assets/scale-vert-marks-after-slider-disabled.png and b/src/gtk/assets/scale-vert-marks-after-slider-disabled.png differ diff --git a/src/gtk/assets/scale-vert-marks-after-slider-disabled@2.png b/src/gtk/assets/scale-vert-marks-after-slider-disabled@2.png index 28e4b7a77..4e25409b4 100644 Binary files a/src/gtk/assets/scale-vert-marks-after-slider-disabled@2.png and b/src/gtk/assets/scale-vert-marks-after-slider-disabled@2.png differ diff --git a/src/gtk/assets/scale-vert-marks-after-slider.png b/src/gtk/assets/scale-vert-marks-after-slider.png index 1efe48cbe..1dd15b2bd 100644 Binary files a/src/gtk/assets/scale-vert-marks-after-slider.png and b/src/gtk/assets/scale-vert-marks-after-slider.png differ diff --git a/src/gtk/assets/scale-vert-marks-after-slider@2.png b/src/gtk/assets/scale-vert-marks-after-slider@2.png index 2f5263b1b..01dca0610 100644 Binary files a/src/gtk/assets/scale-vert-marks-after-slider@2.png and b/src/gtk/assets/scale-vert-marks-after-slider@2.png differ diff --git a/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark.png b/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark.png index 95312eadc..3a7ebb88e 100644 Binary files a/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark.png and b/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark.png differ diff --git a/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark@2.png b/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark@2.png index ac1faf389..137187fe4 100644 Binary files a/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark@2.png and b/src/gtk/assets/scale-vert-marks-before-slider-disabled-dark@2.png differ diff --git a/src/gtk/assets/scale-vert-marks-before-slider-disabled.png b/src/gtk/assets/scale-vert-marks-before-slider-disabled.png index 42a5738e5..504c01870 100644 Binary files a/src/gtk/assets/scale-vert-marks-before-slider-disabled.png and b/src/gtk/assets/scale-vert-marks-before-slider-disabled.png differ diff --git a/src/gtk/assets/scale-vert-marks-before-slider-disabled@2.png b/src/gtk/assets/scale-vert-marks-before-slider-disabled@2.png index 580ca53b4..6d5e650fb 100644 Binary files a/src/gtk/assets/scale-vert-marks-before-slider-disabled@2.png and b/src/gtk/assets/scale-vert-marks-before-slider-disabled@2.png differ diff --git a/src/gtk/assets/scale-vert-marks-before-slider.png b/src/gtk/assets/scale-vert-marks-before-slider.png index 8cf9e2645..f6f424629 100644 Binary files a/src/gtk/assets/scale-vert-marks-before-slider.png and b/src/gtk/assets/scale-vert-marks-before-slider.png differ diff --git a/src/gtk/assets/scale-vert-marks-before-slider@2.png b/src/gtk/assets/scale-vert-marks-before-slider@2.png index 6cf815f7c..c1a8cf96c 100644 Binary files a/src/gtk/assets/scale-vert-marks-before-slider@2.png and b/src/gtk/assets/scale-vert-marks-before-slider@2.png differ diff --git a/src/gtk/assets/selectionmode-checkbox-checked.png b/src/gtk/assets/selectionmode-checkbox-checked.png index ddaaec643..2b459b655 100644 Binary files a/src/gtk/assets/selectionmode-checkbox-checked.png and b/src/gtk/assets/selectionmode-checkbox-checked.png differ diff --git a/src/gtk/assets/selectionmode-checkbox-checked@2.png b/src/gtk/assets/selectionmode-checkbox-checked@2.png index 7e9b76935..5eba4086c 100644 Binary files a/src/gtk/assets/selectionmode-checkbox-checked@2.png and b/src/gtk/assets/selectionmode-checkbox-checked@2.png differ diff --git a/src/gtk/assets/selectionmode-checkbox-unchecked-dark.png b/src/gtk/assets/selectionmode-checkbox-unchecked-dark.png index 1a9c03521..54b530c09 100644 Binary files a/src/gtk/assets/selectionmode-checkbox-unchecked-dark.png and b/src/gtk/assets/selectionmode-checkbox-unchecked-dark.png differ diff --git a/src/gtk/assets/selectionmode-checkbox-unchecked-dark@2.png b/src/gtk/assets/selectionmode-checkbox-unchecked-dark@2.png index fccfdd90b..9b721c46d 100644 Binary files a/src/gtk/assets/selectionmode-checkbox-unchecked-dark@2.png and b/src/gtk/assets/selectionmode-checkbox-unchecked-dark@2.png differ diff --git a/src/metacity-1/metacity-theme-2-light.xml b/src/metacity-1/metacity-theme-2-light.xml index b10d63b48..1ebab6947 100644 --- a/src/metacity-1/metacity-theme-2-light.xml +++ b/src/metacity-1/metacity-theme-2-light.xml @@ -21,9 +21,9 @@ - - - + + + @@ -57,10 +57,10 @@ - - - - + + + + diff --git a/src/metacity-1/metacity-theme-2.xml b/src/metacity-1/metacity-theme-2.xml index cb4c25983..ac30bacd2 100644 --- a/src/metacity-1/metacity-theme-2.xml +++ b/src/metacity-1/metacity-theme-2.xml @@ -11,19 +11,19 @@ - - - + + + - + - - - + + + @@ -57,10 +57,10 @@ - - - - + + + + diff --git a/src/metacity-1/metacity-theme-3.xml b/src/metacity-1/metacity-theme-3.xml index 9f0737a24..c9d6b9273 100644 --- a/src/metacity-1/metacity-theme-3.xml +++ b/src/metacity-1/metacity-theme-3.xml @@ -21,9 +21,9 @@ - - - + + + @@ -57,10 +57,10 @@ - - - - + + + + diff --git a/src/unity/assets-light/close_focused.svg b/src/unity/assets-light/close_focused.svg index 0bf726a73..3df383200 100644 --- a/src/unity/assets-light/close_focused.svg +++ b/src/unity/assets-light/close_focused.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/close_unfocused_prelight.svg b/src/unity/assets-light/close_unfocused_prelight.svg index 00c2e8be2..f9121ad6b 100644 --- a/src/unity/assets-light/close_unfocused_prelight.svg +++ b/src/unity/assets-light/close_unfocused_prelight.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/close_unfocused_pressed.svg b/src/unity/assets-light/close_unfocused_pressed.svg index ae3621418..779a6484a 100644 --- a/src/unity/assets-light/close_unfocused_pressed.svg +++ b/src/unity/assets-light/close_unfocused_pressed.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/maximize_focused.svg b/src/unity/assets-light/maximize_focused.svg index 07df8a03c..50546fcee 100644 --- a/src/unity/assets-light/maximize_focused.svg +++ b/src/unity/assets-light/maximize_focused.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/maximize_unfocused_prelight.svg b/src/unity/assets-light/maximize_unfocused_prelight.svg index 021e41964..d48699c17 100644 --- a/src/unity/assets-light/maximize_unfocused_prelight.svg +++ b/src/unity/assets-light/maximize_unfocused_prelight.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/maximize_unfocused_pressed.svg b/src/unity/assets-light/maximize_unfocused_pressed.svg index db8a5357b..d9cdc9c22 100644 --- a/src/unity/assets-light/maximize_unfocused_pressed.svg +++ b/src/unity/assets-light/maximize_unfocused_pressed.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/minimize_focused.svg b/src/unity/assets-light/minimize_focused.svg index b3317da9f..2bf780c91 100644 --- a/src/unity/assets-light/minimize_focused.svg +++ b/src/unity/assets-light/minimize_focused.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/minimize_unfocused_prelight.svg b/src/unity/assets-light/minimize_unfocused_prelight.svg index a2c47c242..e66209c1c 100644 --- a/src/unity/assets-light/minimize_unfocused_prelight.svg +++ b/src/unity/assets-light/minimize_unfocused_prelight.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/minimize_unfocused_pressed.svg b/src/unity/assets-light/minimize_unfocused_pressed.svg index 3d5991d29..b3b774edc 100644 --- a/src/unity/assets-light/minimize_unfocused_pressed.svg +++ b/src/unity/assets-light/minimize_unfocused_pressed.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/unmaximize_focused.svg b/src/unity/assets-light/unmaximize_focused.svg index 3f4444520..26db7ab66 100644 --- a/src/unity/assets-light/unmaximize_focused.svg +++ b/src/unity/assets-light/unmaximize_focused.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/unmaximize_unfocused_prelight.svg b/src/unity/assets-light/unmaximize_unfocused_prelight.svg index d22359b26..1e03d194c 100644 --- a/src/unity/assets-light/unmaximize_unfocused_prelight.svg +++ b/src/unity/assets-light/unmaximize_unfocused_prelight.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/assets-light/unmaximize_unfocused_pressed.svg b/src/unity/assets-light/unmaximize_unfocused_pressed.svg index 43f133e7d..4b52877ec 100644 --- a/src/unity/assets-light/unmaximize_unfocused_pressed.svg +++ b/src/unity/assets-light/unmaximize_unfocused_pressed.svg @@ -1,4 +1,4 @@ - + diff --git a/src/unity/progress_bar_fill.svg b/src/unity/progress_bar_fill.svg index 3e261c6ee..eab4ffaee 100644 --- a/src/unity/progress_bar_fill.svg +++ b/src/unity/progress_bar_fill.svg @@ -1,3 +1,3 @@ - + diff --git a/src/xfwm4/assets-light/border.svg b/src/xfwm4/assets-light/border-active.svg similarity index 100% rename from src/xfwm4/assets-light/border.svg rename to src/xfwm4/assets-light/border-active.svg diff --git a/src/xfwm4/assets-light/border-inactive.svg b/src/xfwm4/assets-light/border-inactive.svg new file mode 100644 index 000000000..35cc0e282 --- /dev/null +++ b/src/xfwm4/assets-light/border-inactive.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/xfwm4/assets-light/close-active.svg b/src/xfwm4/assets-light/close-active.svg index 14ade776e..18e5caa01 100644 --- a/src/xfwm4/assets-light/close-active.svg +++ b/src/xfwm4/assets-light/close-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/close-inactive.svg b/src/xfwm4/assets-light/close-inactive.svg index 048a06f38..1e28cc23e 100644 --- a/src/xfwm4/assets-light/close-inactive.svg +++ b/src/xfwm4/assets-light/close-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/hide-active.svg b/src/xfwm4/assets-light/hide-active.svg index 2dffa84d0..b55c0d7fb 100644 --- a/src/xfwm4/assets-light/hide-active.svg +++ b/src/xfwm4/assets-light/hide-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/hide-inactive.svg b/src/xfwm4/assets-light/hide-inactive.svg index 866828fab..48f1e2476 100644 --- a/src/xfwm4/assets-light/hide-inactive.svg +++ b/src/xfwm4/assets-light/hide-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/maximize-active.svg b/src/xfwm4/assets-light/maximize-active.svg index b734238b3..ebeb7d028 100644 --- a/src/xfwm4/assets-light/maximize-active.svg +++ b/src/xfwm4/assets-light/maximize-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/maximize-inactive.svg b/src/xfwm4/assets-light/maximize-inactive.svg index ff598cebf..d742ba582 100644 --- a/src/xfwm4/assets-light/maximize-inactive.svg +++ b/src/xfwm4/assets-light/maximize-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/maximize-toggled-active.svg b/src/xfwm4/assets-light/maximize-toggled-active.svg index 9bdff1bf0..cdccda941 100644 --- a/src/xfwm4/assets-light/maximize-toggled-active.svg +++ b/src/xfwm4/assets-light/maximize-toggled-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/maximize-toggled-inactive.svg b/src/xfwm4/assets-light/maximize-toggled-inactive.svg index cced82ae8..994472b2c 100644 --- a/src/xfwm4/assets-light/maximize-toggled-inactive.svg +++ b/src/xfwm4/assets-light/maximize-toggled-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/menu-active.svg b/src/xfwm4/assets-light/menu-active.svg index 39b6bb952..2dd0cc220 100644 --- a/src/xfwm4/assets-light/menu-active.svg +++ b/src/xfwm4/assets-light/menu-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/menu-inactive.svg b/src/xfwm4/assets-light/menu-inactive.svg index 90e7fc369..40130d14f 100644 --- a/src/xfwm4/assets-light/menu-inactive.svg +++ b/src/xfwm4/assets-light/menu-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/shade-active.svg b/src/xfwm4/assets-light/shade-active.svg index d5428f63f..59d7e7c3d 100644 --- a/src/xfwm4/assets-light/shade-active.svg +++ b/src/xfwm4/assets-light/shade-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/shade-inactive.svg b/src/xfwm4/assets-light/shade-inactive.svg index 044a3b1e5..7c2558d7f 100644 --- a/src/xfwm4/assets-light/shade-inactive.svg +++ b/src/xfwm4/assets-light/shade-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/shade-toggled-active.svg b/src/xfwm4/assets-light/shade-toggled-active.svg index a3dc7993c..2d91fd7c6 100644 --- a/src/xfwm4/assets-light/shade-toggled-active.svg +++ b/src/xfwm4/assets-light/shade-toggled-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/shade-toggled-inactive.svg b/src/xfwm4/assets-light/shade-toggled-inactive.svg index 02cf377f3..41fe1d91c 100644 --- a/src/xfwm4/assets-light/shade-toggled-inactive.svg +++ b/src/xfwm4/assets-light/shade-toggled-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/stick-active.svg b/src/xfwm4/assets-light/stick-active.svg index 2ed760ba6..e117bbf1f 100644 --- a/src/xfwm4/assets-light/stick-active.svg +++ b/src/xfwm4/assets-light/stick-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/stick-inactive.svg b/src/xfwm4/assets-light/stick-inactive.svg index ff8bb792b..f810abe25 100644 --- a/src/xfwm4/assets-light/stick-inactive.svg +++ b/src/xfwm4/assets-light/stick-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/stick-toggled-active.svg b/src/xfwm4/assets-light/stick-toggled-active.svg index 632d0b213..a1df16e47 100644 --- a/src/xfwm4/assets-light/stick-toggled-active.svg +++ b/src/xfwm4/assets-light/stick-toggled-active.svg @@ -1,7 +1,7 @@ - + diff --git a/src/xfwm4/assets-light/stick-toggled-inactive.svg b/src/xfwm4/assets-light/stick-toggled-inactive.svg index c2d7c72ae..8cc01c8b3 100644 --- a/src/xfwm4/assets-light/stick-toggled-inactive.svg +++ b/src/xfwm4/assets-light/stick-toggled-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets-light/themerc b/src/xfwm4/assets-light/themerc index 205697e35..2ab8b1ef3 100644 --- a/src/xfwm4/assets-light/themerc +++ b/src/xfwm4/assets-light/themerc @@ -5,8 +5,8 @@ active_text_color=#212121 active_text_shadow_color=#212121 -inactive_text_color=#757575 -inactive_text_shadow_color=#757575 +inactive_text_color=#616161 +inactive_text_shadow_color=#616161 title_shadow_active=false title_shadow_inactive=false full_width_title=true diff --git a/src/xfwm4/assets-light/title.svg b/src/xfwm4/assets-light/title-active.svg similarity index 100% rename from src/xfwm4/assets-light/title.svg rename to src/xfwm4/assets-light/title-active.svg diff --git a/src/xfwm4/assets-light/title-inactive.svg b/src/xfwm4/assets-light/title-inactive.svg new file mode 100644 index 000000000..fb5c989aa --- /dev/null +++ b/src/xfwm4/assets-light/title-inactive.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/xfwm4/assets/border-active.svg b/src/xfwm4/assets/border-active.svg index d2b419ca8..d62843117 100644 --- a/src/xfwm4/assets/border-active.svg +++ b/src/xfwm4/assets/border-active.svg @@ -1,3 +1,3 @@ - + diff --git a/src/xfwm4/assets/border-inactive.svg b/src/xfwm4/assets/border-inactive.svg index 2b19b2460..7d66b682b 100644 --- a/src/xfwm4/assets/border-inactive.svg +++ b/src/xfwm4/assets/border-inactive.svg @@ -1,3 +1,3 @@ - + diff --git a/src/xfwm4/assets/close-active.svg b/src/xfwm4/assets/close-active.svg index 4b7a98d03..87cc78aad 100644 --- a/src/xfwm4/assets/close-active.svg +++ b/src/xfwm4/assets/close-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/close-inactive.svg b/src/xfwm4/assets/close-inactive.svg index 388bfe9b6..a0a0689c0 100644 --- a/src/xfwm4/assets/close-inactive.svg +++ b/src/xfwm4/assets/close-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/close-prelight.svg b/src/xfwm4/assets/close-prelight.svg index 422e4c9d4..6a9d29005 100644 --- a/src/xfwm4/assets/close-prelight.svg +++ b/src/xfwm4/assets/close-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/close-pressed.svg b/src/xfwm4/assets/close-pressed.svg index a340048c9..11b3fe19a 100644 --- a/src/xfwm4/assets/close-pressed.svg +++ b/src/xfwm4/assets/close-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/hide-active.svg b/src/xfwm4/assets/hide-active.svg index d4fbfeace..6bf647898 100644 --- a/src/xfwm4/assets/hide-active.svg +++ b/src/xfwm4/assets/hide-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/hide-inactive.svg b/src/xfwm4/assets/hide-inactive.svg index 26774a976..3f2b44259 100644 --- a/src/xfwm4/assets/hide-inactive.svg +++ b/src/xfwm4/assets/hide-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/hide-prelight.svg b/src/xfwm4/assets/hide-prelight.svg index 07452fcd8..fce9df617 100644 --- a/src/xfwm4/assets/hide-prelight.svg +++ b/src/xfwm4/assets/hide-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/hide-pressed.svg b/src/xfwm4/assets/hide-pressed.svg index 7b90f93ea..04b4106f0 100644 --- a/src/xfwm4/assets/hide-pressed.svg +++ b/src/xfwm4/assets/hide-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-active.svg b/src/xfwm4/assets/maximize-active.svg index 589a22278..b17dd3c55 100644 --- a/src/xfwm4/assets/maximize-active.svg +++ b/src/xfwm4/assets/maximize-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-inactive.svg b/src/xfwm4/assets/maximize-inactive.svg index eaefab624..aaf4ba9f8 100644 --- a/src/xfwm4/assets/maximize-inactive.svg +++ b/src/xfwm4/assets/maximize-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-prelight.svg b/src/xfwm4/assets/maximize-prelight.svg index c5ebeec79..856e47233 100644 --- a/src/xfwm4/assets/maximize-prelight.svg +++ b/src/xfwm4/assets/maximize-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-pressed.svg b/src/xfwm4/assets/maximize-pressed.svg index 4a88713c8..41ed99092 100644 --- a/src/xfwm4/assets/maximize-pressed.svg +++ b/src/xfwm4/assets/maximize-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-toggled-active.svg b/src/xfwm4/assets/maximize-toggled-active.svg index 5f5edced5..3167064bc 100644 --- a/src/xfwm4/assets/maximize-toggled-active.svg +++ b/src/xfwm4/assets/maximize-toggled-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-toggled-inactive.svg b/src/xfwm4/assets/maximize-toggled-inactive.svg index 99200499d..31dd41255 100644 --- a/src/xfwm4/assets/maximize-toggled-inactive.svg +++ b/src/xfwm4/assets/maximize-toggled-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-toggled-prelight.svg b/src/xfwm4/assets/maximize-toggled-prelight.svg index ccc615f28..9f8558cce 100644 --- a/src/xfwm4/assets/maximize-toggled-prelight.svg +++ b/src/xfwm4/assets/maximize-toggled-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/maximize-toggled-pressed.svg b/src/xfwm4/assets/maximize-toggled-pressed.svg index e4a3cbc42..6c1a79573 100644 --- a/src/xfwm4/assets/maximize-toggled-pressed.svg +++ b/src/xfwm4/assets/maximize-toggled-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/menu-active.svg b/src/xfwm4/assets/menu-active.svg index 67643fe47..3b62a8144 100644 --- a/src/xfwm4/assets/menu-active.svg +++ b/src/xfwm4/assets/menu-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/menu-inactive.svg b/src/xfwm4/assets/menu-inactive.svg index ccb1e4ce9..63e97e74c 100644 --- a/src/xfwm4/assets/menu-inactive.svg +++ b/src/xfwm4/assets/menu-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/menu-prelight.svg b/src/xfwm4/assets/menu-prelight.svg index eabeb05f8..301b2f73d 100644 --- a/src/xfwm4/assets/menu-prelight.svg +++ b/src/xfwm4/assets/menu-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/menu-pressed.svg b/src/xfwm4/assets/menu-pressed.svg index a0de695a5..a4d47b492 100644 --- a/src/xfwm4/assets/menu-pressed.svg +++ b/src/xfwm4/assets/menu-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-active.svg b/src/xfwm4/assets/shade-active.svg index 44c1e251d..45c9d935c 100644 --- a/src/xfwm4/assets/shade-active.svg +++ b/src/xfwm4/assets/shade-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-inactive.svg b/src/xfwm4/assets/shade-inactive.svg index 2caede52c..bed7464e7 100644 --- a/src/xfwm4/assets/shade-inactive.svg +++ b/src/xfwm4/assets/shade-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-prelight.svg b/src/xfwm4/assets/shade-prelight.svg index 64f4c1919..e43ac2ed9 100644 --- a/src/xfwm4/assets/shade-prelight.svg +++ b/src/xfwm4/assets/shade-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-pressed.svg b/src/xfwm4/assets/shade-pressed.svg index 69e3dc3eb..8098bb8f7 100644 --- a/src/xfwm4/assets/shade-pressed.svg +++ b/src/xfwm4/assets/shade-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-toggled-active.svg b/src/xfwm4/assets/shade-toggled-active.svg index 4b26949dc..044b49081 100644 --- a/src/xfwm4/assets/shade-toggled-active.svg +++ b/src/xfwm4/assets/shade-toggled-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-toggled-inactive.svg b/src/xfwm4/assets/shade-toggled-inactive.svg index de973e8e6..ceab5cc48 100644 --- a/src/xfwm4/assets/shade-toggled-inactive.svg +++ b/src/xfwm4/assets/shade-toggled-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-toggled-prelight.svg b/src/xfwm4/assets/shade-toggled-prelight.svg index bb36b1fc8..c74b2e0e4 100644 --- a/src/xfwm4/assets/shade-toggled-prelight.svg +++ b/src/xfwm4/assets/shade-toggled-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/shade-toggled-pressed.svg b/src/xfwm4/assets/shade-toggled-pressed.svg index 43577c163..0760efaa2 100644 --- a/src/xfwm4/assets/shade-toggled-pressed.svg +++ b/src/xfwm4/assets/shade-toggled-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-active.svg b/src/xfwm4/assets/stick-active.svg index 9d63d2e1a..99b7b9be9 100644 --- a/src/xfwm4/assets/stick-active.svg +++ b/src/xfwm4/assets/stick-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-inactive.svg b/src/xfwm4/assets/stick-inactive.svg index 74c9b5a11..c56155ab1 100644 --- a/src/xfwm4/assets/stick-inactive.svg +++ b/src/xfwm4/assets/stick-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-prelight.svg b/src/xfwm4/assets/stick-prelight.svg index a675f7f04..3387491cc 100644 --- a/src/xfwm4/assets/stick-prelight.svg +++ b/src/xfwm4/assets/stick-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-pressed.svg b/src/xfwm4/assets/stick-pressed.svg index c62a4c8b1..32b60a1a0 100644 --- a/src/xfwm4/assets/stick-pressed.svg +++ b/src/xfwm4/assets/stick-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-toggled-active.svg b/src/xfwm4/assets/stick-toggled-active.svg index 0019c7b88..cb1abbb30 100644 --- a/src/xfwm4/assets/stick-toggled-active.svg +++ b/src/xfwm4/assets/stick-toggled-active.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-toggled-inactive.svg b/src/xfwm4/assets/stick-toggled-inactive.svg index d2fcced1d..45819f200 100644 --- a/src/xfwm4/assets/stick-toggled-inactive.svg +++ b/src/xfwm4/assets/stick-toggled-inactive.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-toggled-prelight.svg b/src/xfwm4/assets/stick-toggled-prelight.svg index 2b323afb9..f5dbeb0a1 100644 --- a/src/xfwm4/assets/stick-toggled-prelight.svg +++ b/src/xfwm4/assets/stick-toggled-prelight.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/stick-toggled-pressed.svg b/src/xfwm4/assets/stick-toggled-pressed.svg index c19c55af3..e01c703bf 100644 --- a/src/xfwm4/assets/stick-toggled-pressed.svg +++ b/src/xfwm4/assets/stick-toggled-pressed.svg @@ -1,5 +1,5 @@ - + diff --git a/src/xfwm4/assets/title-active.svg b/src/xfwm4/assets/title-active.svg index a03d81ab2..796b9b362 100644 --- a/src/xfwm4/assets/title-active.svg +++ b/src/xfwm4/assets/title-active.svg @@ -1,4 +1,4 @@ - + diff --git a/src/xfwm4/assets/title-inactive.svg b/src/xfwm4/assets/title-inactive.svg index 9dff3d834..b2f28222d 100644 --- a/src/xfwm4/assets/title-inactive.svg +++ b/src/xfwm4/assets/title-inactive.svg @@ -1,4 +1,4 @@ - +