diff --git a/install.sh b/install.sh index a31e00c..49ec60c 100755 --- a/install.sh +++ b/install.sh @@ -175,7 +175,7 @@ else elif (is_my_distro "solus") && (is_running "gnome-session"); then msg="GNOME: you may need to disable 'User Themes' extension to fix your dock." # elif (is_running "gnome-session") && [[ "${GNOME_VERSION}" == "3-28" ]]; then - # msg="GNOME: you may need to disable 'User Themes' extension to fix your logout and authentication dialog." + # msg="GNOME: you may need to disable 'User Themes' extension to fix your logout and authentication dialog." fi if [[ "${msg}" ]]; then diff --git a/src/sass/gnome-shell/_widgets-42-0.scss b/src/sass/gnome-shell/_widgets-42-0.scss index 42b8ba2..173181e 100644 --- a/src/sass/gnome-shell/_widgets-42-0.scss +++ b/src/sass/gnome-shell/_widgets-42-0.scss @@ -38,6 +38,7 @@ @import 'widgets-40-0/panel'; @import 'widgets-42-0/popovers'; @import 'widgets-40-0/screen-shield'; +@import 'widgets-42-0/screenshot'; @import 'widgets-40-0/search-entry'; @import 'widgets-40-0/window-picker'; @import 'widgets-40-0/workspace-thumbnails'; diff --git a/src/sass/gnome-shell/common/_buttons.scss b/src/sass/gnome-shell/common/_buttons.scss index fcb8cd5..2c2f975 100644 --- a/src/sass/gnome-shell/common/_buttons.scss +++ b/src/sass/gnome-shell/common/_buttons.scss @@ -14,3 +14,26 @@ border: none; } } + +%osd_button { + background-color: transparent; + border: none; + box-shadow: none; + outline: none; + color: rgba(white, 0.75); + + &:hover { + background-color: rgba(white, 0.1); + color: white; + } + + &:active { + background-color: rgba(white, 0.25); + color: white; + } + + &:insensitive { + background-color: transparent; + color: rgba(white, 0.35); + } +} diff --git a/src/sass/gnome-shell/widgets-42-0/_screenshot.scss b/src/sass/gnome-shell/widgets-42-0/_screenshot.scss new file mode 100644 index 0000000..8f5cfc8 --- /dev/null +++ b/src/sass/gnome-shell/widgets-42-0/_screenshot.scss @@ -0,0 +1,208 @@ +// Screenshot UI +.icon-label-button-container { + spacing: $base_padding; + @include font(caption); + + StIcon { icon-size: 32px; } +} + +$screenshot_ui_panel_padding: $base_padding * 3; +$screenshot_ui_shot_cast_margin: $base_padding * 3; +$screenshot_ui_panel_border_radius: $base_padding * 7; +$screenshot_ui_shot_cast_spacing: $base_padding / 2; + +$screenshot_ui_button_red: $error_color; + +.screenshot-ui-panel { + border-radius: $screenshot_ui_panel_border_radius; + padding: $screenshot_ui_panel_padding; + // Reduce the bottom padding a little to accommodate the large capture button. + margin-bottom: 4em; + spacing: $base_padding * 2; + color: $osd_fg_color; + background-color: $osd_bg_color; + border: 1px solid rgba(black, 0.75); + box-shadow: 0 3px 8px 0 rgba(black, 0.25); +} + +.screenshot-ui-close-button { + @extend .window-close; // copy window close button + padding: $base_padding !important; // but with more padding + + &.left { margin-left: $base_padding + 2px; } + &.right { margin-right: $base_padding + 2px; } +} + +.screenshot-ui-type-button { + @extend %osd_button; + min-width: 48px; + padding: $base_padding * 2 $base_padding * 3 !important; + border-radius: $screenshot_ui_panel_border_radius - $screenshot_ui_panel_padding; +} + +.screenshot-ui-capture-button { + width: 36px; + height: 36px; + border-radius: $circular_radius; + border: 4px white; + padding: $base_margin; + + .screenshot-ui-capture-button-circle { + background-color: white; + transition-duration: 200ms; + + &:hover, &:focus { background-color: $divider_color; } + border-radius: $circular_radius; + } + + &:hover, &:focus { + .screenshot-ui-capture-button-circle { + background-color: darken(white, 15%); + } + } + + &:active { + .screenshot-ui-capture-button-circle { + background-color: darken(white, 50%); + } + } + + &:cast { + .screenshot-ui-capture-button-circle { + background-color: $screenshot_ui_button_red; + } + + &:hover, &:focus { + .screenshot-ui-capture-button-circle { + background-color: lighten($screenshot_ui_button_red, 5%); + } + } + + &:active { + .screenshot-ui-capture-button-circle { + background-color: darken($screenshot_ui_button_red, 7%); + } + } + } +} + +.screenshot-ui-shot-cast-container { + background-color: rgba(white, 0.06); + border-radius: $bt_radius; + padding: $screenshot_ui_shot_cast_spacing; + spacing: $screenshot_ui_shot_cast_spacing; + + &:ltr { margin-left: $screenshot_ui_shot_cast_margin - $screenshot_ui_panel_padding; } + &:rtl { margin-right: $screenshot_ui_shot_cast_margin - $screenshot_ui_panel_padding; } +} + +.screenshot-ui-shot-cast-button { + padding: $base_padding $base_padding * 2; + background-color: transparent; + border-radius: $bt_radius - $screenshot_ui_shot_cast_spacing; + + &:hover, &:focus { background-color: rgba(white, 0.1); } + &:active { background-color: rgba(white, 0.2); } + &:checked { background-color: white; color: black; } + + StIcon { icon-size: 16px; } +} + +.screenshot-ui-show-pointer-button { + @extend %osd_button; + border-radius: $circular_radius; + padding: $base_padding * 2 !important; + + StIcon { icon-size: 16px; } +} + +.screenshot-ui-area-indicator-shade { + background-color: rgba(0,0,0,.3); +} + +.screenshot-ui-area-selector { + .screenshot-ui-area-indicator-shade { + background-color: rgba(0,0,0,.5); + } + + .screenshot-ui-area-indicator-selection { + border: 2px white; + } +} + +.screenshot-ui-area-selector-handle { + border-radius: $circular_radius; + background-color: white; + box-shadow: 0 1px 3px 2px rgba(0,0,0,0.2); + width: 24px; + height: 24px; +} + +.screenshot-ui-window-selector { + background-color: $osd_bg_color; + + .screenshot-ui-window-selector-window-container { + margin: 100px; + } + + &:primary-monitor { + .screenshot-ui-window-selector-window-container { + // Make some room for the panel. + margin-bottom: 200px; + } + } +} + +.screenshot-ui-window-selector-window-border { + transition-duration: 200ms; + border-radius: $bt_radius; + border: 6px transparent; +} + +.screenshot-ui-window-selector-check { + transition-duration: 200ms; + color: transparent; + border-radius: $circular_radius; + border-width: 12px; + icon-size: 24px; +} + +.screenshot-ui-window-selector-window { + &:hover { + .screenshot-ui-window-selector-window-border { + border-color: darken($primary_color, 15%); + } + } + &:checked { + .screenshot-ui-window-selector-window-border { + border-color: $primary_color; + background-color: transparentize($primary_color, 0.8); + } + + .screenshot-ui-window-selector-check { + color: white; + background-color: $primary_color; + } + } +} + +.screenshot-ui-screen-selector { + transition-duration: 200ms; + background-color: rgba(0,0,0,.5); + + &:hover { background-color: rgba(0,0,0,.3);} + &:active { background-color: rgba(0,0,0,.7);} + &:checked { + background-color: transparent; + border: 2px white; + } +} + +.screenshot-ui-tooltip { + color: $osd_fg_color; + background-color: $osd_bg_color; + border-radius: $circular_radius; + padding: $base_padding $base_padding * 2; + text-align: center; + -y-offset: 24px; +}