diff --git a/parse-sass.sh b/parse-sass.sh index b629cdb1..45d8fa6d 100755 --- a/parse-sass.sh +++ b/parse-sass.sh @@ -45,6 +45,8 @@ for color in "${_COLOR_VARIANTS[@]}"; do echo "==> Generating the 44.0 gnome-shell${color}.css..." sassc $SASSC_OPT src/main/gnome-shell/shell-46-0/gnome-shell${color}.{scss,css} echo "==> Generating the 46.0 gnome-shell${color}.css..." + sassc $SASSC_OPT src/main/gnome-shell/shell-47-0/gnome-shell${color}.{scss,css} + echo "==> Generating the 47.0 gnome-shell${color}.css..." sassc $SASSC_OPT src/main/cinnamon/cinnamon${color}.{scss,css} echo "==> Generating the cinnamon${color}.css..." done diff --git a/shell/lib-core.sh b/shell/lib-core.sh index 92d2506b..5c763424 100755 --- a/shell/lib-core.sh +++ b/shell/lib-core.sh @@ -26,7 +26,9 @@ MY_HOME=$(getent passwd "${MY_USERNAME}" | cut -d: -f6) if command -v gnome-shell &> /dev/null; then SHELL_VERSION="$(gnome-shell --version | cut -d ' ' -f 3 | cut -d . -f -1)" - if [[ "${SHELL_VERSION:-}" -ge "46" ]]; then + if [[ "${SHELL_VERSION:-}" -ge "47" ]]; then + GNOME_VERSION="47-0" + elif [[ "${SHELL_VERSION:-}" -ge "46" ]]; then GNOME_VERSION="46-0" elif [[ "${SHELL_VERSION:-}" -ge "44" ]]; then GNOME_VERSION="44-0" @@ -38,7 +40,7 @@ if command -v gnome-shell &> /dev/null; then GNOME_VERSION="3-28" fi else - GNOME_VERSION="46-0" + GNOME_VERSION="47-0" fi #----------Program options-------------# diff --git a/src/main/gnome-shell/shell-47-0/gnome-shell-Dark.scss b/src/main/gnome-shell/shell-47-0/gnome-shell-Dark.scss new file mode 100644 index 00000000..9036a1d0 --- /dev/null +++ b/src/main/gnome-shell/shell-47-0/gnome-shell-Dark.scss @@ -0,0 +1,7 @@ +$variant: 'dark'; + +@import '../../../sass/variables'; +@import '../../../sass/colors'; +@import '../../../sass/gnome-shell/drawing'; +@import '../../../sass/gnome-shell/widgets-47-0'; +@import '../../../sass/gnome-shell/extensions-46-0'; diff --git a/src/main/gnome-shell/shell-47-0/gnome-shell-Light.scss b/src/main/gnome-shell/shell-47-0/gnome-shell-Light.scss new file mode 100644 index 00000000..f1ec5ecf --- /dev/null +++ b/src/main/gnome-shell/shell-47-0/gnome-shell-Light.scss @@ -0,0 +1,7 @@ +$variant: 'light'; + +@import '../../../sass/variables'; +@import '../../../sass/colors'; +@import '../../../sass/gnome-shell/drawing'; +@import '../../../sass/gnome-shell/widgets-47-0'; +@import '../../../sass/gnome-shell/extensions-46-0'; diff --git a/src/sass/gnome-shell/_widgets-47-0.scss b/src/sass/gnome-shell/_widgets-47-0.scss new file mode 100644 index 00000000..b1ddeeea --- /dev/null +++ b/src/sass/gnome-shell/_widgets-47-0.scss @@ -0,0 +1,45 @@ +@import 'common'; +@import 'common/a11y'; +@import 'common/app-grid'; +@import 'common/base'; +@import 'common/buttons'; +@import 'common/calendar'; +@import 'common/corner-ripple'; +@import 'common/dash'; +@import 'common/entries'; +@import 'common/hotplug'; +@import 'common/ibus-popup'; +@import 'common/keyboard'; +@import 'common/login-dialog'; +@import 'common/looking-glass'; +@import 'common/misc'; +@import 'common/network-dialog'; +@import 'common/osd'; +@import 'common/overview'; +@import 'common/panel'; +@import 'common/popovers'; +@import 'common/screen-shield'; +@import 'common/scrollbars'; +@import 'common/search-entry'; +@import 'common/search-results'; +@import 'common/switcher-popup'; +@import 'common/tiled-previews'; +@import 'common/workspace-switcher'; +@import 'widgets-46-0/app-grid'; +@import 'widgets-47-0/check-box'; +@import 'widgets-46-0/dash'; +@import 'widgets-47-0/dialogs'; +@import 'widgets-46-0/message-list'; +@import 'widgets-46-0/notifications'; +@import 'widgets-40-0/overview'; +@import 'widgets-42-0/osd'; +@import 'widgets-40-0/panel'; +@import 'widgets-42-0/popovers'; +@import 'widgets-44-0/quick-settings'; +@import 'widgets-40-0/screen-shield'; +@import 'widgets-42-0/screenshot'; +@import 'widgets-40-0/search-entry'; +@import 'widgets-47-0/slider'; +@import 'widgets-47-0/switches'; +@import 'widgets-40-0/window-picker'; +@import 'widgets-40-0/workspace-thumbnails'; diff --git a/src/sass/gnome-shell/widgets-47-0/_check-box.scss b/src/sass/gnome-shell/widgets-47-0/_check-box.scss new file mode 100644 index 00000000..313496de --- /dev/null +++ b/src/sass/gnome-shell/widgets-47-0/_check-box.scss @@ -0,0 +1,42 @@ +/* Check Boxes */ + +.check-box { + StBoxLayout { spacing: .8em; } + StBin { + width: 24px; + height: 24px; + padding: ($medium_size - 24px) / 2; + border-radius: 100px; + background-image: url("assets/checkbox-off.svg"); + } + &:focus StBin { + background-image: url("assets/checkbox-off.svg"); + background-color: transparent; + box-shadow: none; + } + &:hover StBin { + background-color: $divider_color; + } + &:active StBin { + background-color: $track_color; + } + &:checked StBin { + background-image: url("assets/checkbox.svg"); + } + &:focus:checked StBin { + background-image: url("assets/checkbox.svg"); + } + &:hover:checked StBin { + background-color: rgba($primary_color, $lower_opacity / 2); + } + &:active:checked StBin { + background-color: rgba($primary_color, $lower_opacity); + } + StIcon { + icon-size: 0 !important; + padding: 0 !important; + color: transparent !important; + border: none !important; + background-color: transparent !important; + } +} diff --git a/src/sass/gnome-shell/widgets-47-0/_dialogs.scss b/src/sass/gnome-shell/widgets-47-0/_dialogs.scss new file mode 100644 index 00000000..07511bb4 --- /dev/null +++ b/src/sass/gnome-shell/widgets-47-0/_dialogs.scss @@ -0,0 +1,253 @@ +/* Modal Dialogs */ + +%theme_dialogs { + background-color: $dialog_bg_color; + border-radius: $modal_radius; + border: solid rgba(black, 0.75); + border-width: if($variant=='light', 0, 1px); + box-shadow: 0 3px 6px 0 rgba(black, if($variant=='light', 0.25, 0.35)); +} + +%last_dialog_button { + color: white !important; + background-color: $primary_color; + box-shadow: inset 0 1px 0 0 rgba(white,0.1); + background-gradient-direction: none !important; + + &:hover { + color: white !important; + background-color: lighten($primary_color, 9%); + background-gradient-direction: none !important; + } + + &:active { + color: white !important; + background-color: darken($primary_color, 5%); + background-gradient-direction: none !important; + } + + &:insensitive { + background-color: rgba($primary_color, 0.05); + color: rgba($primary_color, 0.35) !important; + background-gradient-direction: none !important; + } +} + +.headline { + @extend %title_4; +} + +// modal dialog +.modal-dialog { + color: $fg_color; + padding: $base_padding * 2; + @extend %theme_dialogs !optional; + + &-linked-button { + min-height: 40px; + padding: 0 16px; + margin: 0 !important; + border: none !important; + border-radius: $modal_radius - $base_padding * 2; + + @include font(button); + @include button(flat-normal); + &:hover { @include button(flat-hover); } + &:active { @include button(flat-active); } + &:insensitive { @include button(flat-insensitive); } + &:focus { @include button(flat-focus); } + } + + &-linked-button:first-child { + background: $entry_bg; + &:hover { @include button(flat-hover); } + &:active { @include button(flat-active); } + } + + &-linked-button:last-child { + @extend %last_dialog_button; + } + + .modal-dialog-content-box { + margin: 32px 40px; + spacing: 32px; + max-width: 28em; + } +} + +// End Session Dialog +.end-session-dialog { + width: 30em; + // border: none; + + .end-session-dialog-battery-warning, + .dialog-list-title { + color: $warning_color; + } +} + +// Message Dialog +.message-dialog-content { + spacing: 18px; + + .message-dialog-title { + text-align: center; + @extend %title_2; + + &.lightweight { + @extend %title_4; + } + } + + .message-dialog-description { text-align: center; } +} + +// Dialog List +.dialog-list { + spacing: 18px; + + .dialog-list-title { + text-align: center; + @extend %heading; + } + + .dialog-list-scrollview { max-height: 200px; } + .dialog-list-box { + spacing: 1em; + + .dialog-list-item { + spacing: 1em; + + .dialog-list-item-title { font-weight: bold; } + .dialog-list-item-description { + color: $alt_fg_color; + @extend %caption; + } + } + } +} + +// Run Dialog +.run-dialog { + .modal-dialog-content-box { + margin-top: 24px; + margin-bottom: 14px; + } + + .run-dialog-entry { width: 20em; } + .run-dialog-description { + text-align: center; + color: $alt_fg_color; + @extend %caption; + } +} + +// Password or Authentication Dialog +.prompt-dialog { + //this is the width of the entire modal popup + width: 28em; + // border: none; + + .modal-dialog-content-box { + margin-bottom: 24px; + } +} + +.prompt-dialog-password-grid { + spacing-rows: 8px; + spacing-columns: 4px; + + .prompt-dialog-password-entry { + width: auto; + + // 4px (spacing) + 16px (spinner-width) + &:ltr { margin-left: 20px; } + &:rtl { margin-right: 20px; } + } +} + +.prompt-dialog-password-grid { + spacing-rows: 8px; + spacing-columns: 4px; + + .prompt-dialog-password-entry { + width: auto; + + // 4px (spacing) + 16px (spinner-width) + &:ltr { margin-left: 20px; } + &:rtl { margin-right: 20px; } + } +} + +.prompt-dialog-password-layout { + spacing: 8px; +} + +.prompt-dialog-password-entry { + width: 20em; +} + +.prompt-dialog-error-label, +.prompt-dialog-info-label, +.prompt-dialog-null-label { + text-align: center; + @extend %caption; +} + +.prompt-dialog-error-label { + color: $error_color; +} + +.prompt-dialog-info-label, +.prompt-dialog-null-label { + color: $hint_fg_color; +} + +// Polkit Dialog +.polkit-dialog-user-layout { + text-align: center; + spacing: 8px; + margin-bottom: 6px; + + .polkit-dialog-user-root-label { + color: $warning_color; + } +} + +// Audio selection dialog +.audio-device-selection-dialog { + .modal-dialog-content-box { margin-bottom: 28px; } + .audio-selection-box { spacing: 20px; } +} + +.audio-selection-device { + border: 1px solid $borders_color; + border-radius: $bt_radius; + &:hover, &:focus { background-color: $visit_color; } + &:active { + background-color: $selected_bg_color; + color: $selected_fg_color; + } +} + +.audio-selection-device-box { + padding: 20px; + spacing: 20px; +} + +.audio-selection-device-icon { + icon-size: $base_icon_size * 4; +} + +// Welcome dialog +.welcome-dialog-image { + background-image: url("resource:///org/gnome/shell/theme/gnome-shell-start.svg"); + background-size: contain; + height: 300px; + width: 300px; +} + +/* Access portal dialog */ +.access-dialog { + text-align: center; +} diff --git a/src/sass/gnome-shell/widgets-47-0/_slider.scss b/src/sass/gnome-shell/widgets-47-0/_slider.scss new file mode 100644 index 00000000..f1d449e9 --- /dev/null +++ b/src/sass/gnome-shell/widgets-47-0/_slider.scss @@ -0,0 +1,25 @@ +/* Slider */ + +$slider_color: if($variant == 'light', white, white); +$barlevel_bg_color: if($variant == 'light', rgba(black, 0.06), rgba(white, 0.1)); +$barlevel_active_bg_color: if($variant == 'light', rgba(black, 0.15), rgba(white, 0.35)); +$slider_size: 22px; + +.slider { + height: $slider_size; + color: $slider_color; + border-radius: 16px; + + -slider-handle-radius: $slider_size * 0.5; + + // barlevels are for >= 3.29.90 + -barlevel-height: $slider_size; + -barlevel-background-color: $barlevel_bg_color; + -barlevel-active-background-color: $barlevel_active_bg_color; + -barlevel-overdrive-color: $destructive_color; + -barlevel-overdrive-separator-width: 1px; + + &:hover { + color: $slider_color; + } +} diff --git a/src/sass/gnome-shell/widgets-47-0/_switches.scss b/src/sass/gnome-shell/widgets-47-0/_switches.scss new file mode 100644 index 00000000..e43718dc --- /dev/null +++ b/src/sass/gnome-shell/widgets-47-0/_switches.scss @@ -0,0 +1,43 @@ +/* Switches */ + +.toggle-switch { + width: 40px; + height: 24px; + background-size: contain; + background-image: url("assets/toggle-off.svg"); + + &:checked { background-image: url("assets/toggle-on.svg"); } + + .popup-menu-item.selected & { + background-image: url("assets/toggle-off.svg"); + + &:checked { background-image: url("assets/toggle-on.svg"); } + } + + StIcon { + icon-size: 0; + } + + .handle { + margin: 0; + width: 0; + height: 0; + background: none; + box-shadow: none; + transition-duration: 0; + } + + &:checked { + background-color: transparent; + color: transparent; + + &:hover { + background-color: transparent; + color: transparent; + } + + .handle { + background: none; + } + } +} diff --git a/src/sass/gtk/_common-4.0.scss b/src/sass/gtk/_common-4.0.scss index db28e034..ab90436a 100644 --- a/src/sass/gtk/_common-4.0.scss +++ b/src/sass/gtk/_common-4.0.scss @@ -1868,6 +1868,11 @@ searchbar { button.flat { @extend %circular_button; } + + .top-bar &:not(.inline) > revealer > box, + .bottom-bar &:not(.inline) > revealer > box { + background-color: transparent; + } } actionbar > revealer > box { @@ -4474,14 +4479,17 @@ list.boxed-list { } list.boxed-list-separate { - background: none; color: $fg_color; + @extend %circular_list; > row { - @extend %boxed_list_row; border: none; margin-bottom: 12px; outline: none; + box-shadow: none; + background-color: transparent; + @extend %boxed_list_row; + @extend %circular_row; &:selected { background-color: $visit_color;