diff --git a/data/theme/gnome-shell-sass/widgets/_dialogs.scss b/data/theme/gnome-shell-sass/widgets/_dialogs.scss index c08eb91ba..4136bfce5 100644 --- a/data/theme/gnome-shell-sass/widgets/_dialogs.scss +++ b/data/theme/gnome-shell-sass/widgets/_dialogs.scss @@ -1,57 +1,34 @@ /* Modal Dialogs */ -.headline { - @extend %title_4; -} - +// style for all dialogs .modal-dialog { background-color: $bg_color; border-radius: $alert_radius; - box-shadow: inset 0 0 0 1px $outer_borders_color; padding: $base_padding * 4; + spacing: $base_padding * 3; + box-shadow: 0 12px 8px 12px rgba(0,0,0,0.03); .modal-dialog-content-box { - spacing: $base_margin * 8; - margin-top: $base_margin * 2; - margin-bottom: $base_margin * 4; + padding-top: $base_padding * 2; + spacing: $base_padding * 3; max-width: 28em; } - .modal-dialog-linked-button { - @extend %dialog_button; + .modal-dialog-button-box { + padding-top: $base_padding; + .modal-dialog-button { + @extend %dialog_button; + } } } -/* End Session Dialog */ -.end-session-dialog { - width: 24em; - - .end-session-dialog-battery-warning, - .dialog-list-title { - color: $warning_color; - } -} - -/* Message Dialog */ -.message-dialog-content { - spacing: $base_padding * 3; - - .message-dialog-title { - text-align: center; - @extend %title_2; - - &.lightweight { @extend %title_4;} - } - .message-dialog-description { text-align: center; } -} - -/* Dialog List */ +// lists in dialogs .dialog-list { spacing: $base_padding * 3; .dialog-list-title { - text-align: center; @extend %heading; + text-align: center; } .dialog-list-scrollview { max-height: 200px; } @@ -63,104 +40,134 @@ .dialog-list-item-title { font-weight: bold; } .dialog-list-item-description { - color: darken($fg_color,5%); @extend %caption; + color: darken($fg_color,5%); } } } } +/* End Session Dialog */ +.end-session-dialog { + width: 24em; + + // special style for session warnings + .end-session-dialog-battery-warning, + .dialog-list-title { + color: $warning_color; + background-color: transparentize($warning_color, 0.9); + padding: $base_padding * 1.5; + border-radius: $base_border_radius; + margin: $base_margin 0; + } +} + +/* Message Dialog */ +.message-dialog-content { + spacing: $base_padding * 3; + + .message-dialog-title { + text-align: center; + @extend %title_2; + + &.lightweight { + @extend %title_4; + } + } + .message-dialog-description { + text-align: center; + } +} + /* Run Dialog */ .run-dialog { - .modal-dialog-content-box { - margin-top: $base_padding * 4; - margin-bottom: $base_padding * 2; + width: 24em; + + // run dialog needs to override bottom padding + // to account for inexplicable extra padding + padding-bottom: $base_padding; + + .run-dialog-entry { + padding: $base_padding * 2 $base_padding * 1.5; } - .run-dialog-entry { width: 20em; } .run-dialog-description { @extend %caption; - text-align: center; color: darken($fg_color, 20%); } } /* Password or Authentication Dialog */ - .prompt-dialog { width: 28em; - .modal-dialog-content-box { - margin-bottom: $base_margin * 6; + .prompt-dialog-password-grid { + spacing-rows: $base_margin * 2; + spacing-columns: $base_margin; + + .prompt-dialog-password-entry { + width: auto; + padding: $base_padding * 2 $base_padding * 1.5; + // 4px (spacing) + 16px (spinner-width) + &:ltr { margin-left: $base_margin+$base_icon_size; } + &:rtl { margin-right: $base_margin+$base_icon_size; } + } + } + + .prompt-dialog-password-layout { + spacing: $base_margin * 2; + } + + .prompt-dialog-error-label, + .prompt-dialog-info-label, + .prompt-dialog-null-label { + @extend %caption; + text-align: center; + } + + .prompt-dialog-error-label { + color: $warning_color; } } -.prompt-dialog-password-grid { - spacing-rows: $base_margin * 2; - spacing-columns: $base_margin; - - .prompt-dialog-password-entry { - width: auto; - - // 4px (spacing) + 16px (spinner-width) - &:ltr { margin-left: $base_margin+$base_icon_size; } - &:rtl { margin-right: $base_margin+$base_icon_size; } - } -} - -.prompt-dialog-password-layout { - spacing: $base_margin * 2; -} - -.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: $warning_color; -} - - /* Polkit Dialog */ - .polkit-dialog-user-layout { text-align: center; spacing: $base_margin * 2; margin-bottom: $base_padding; - .polkit-dialog-user-root-label { color: $warning_color; } + .polkit-dialog-user-label, + .polkit-dialog-user-root-label { + @extend %title_4; + } + + .polkit-dialog-user-root-label { + color: $warning_color; + } } /* Audio selection dialog */ .audio-device-selection-dialog { - .modal-dialog-content-box { margin-bottom: $base_margin * 7; } - .audio-selection-box { spacing: $base_margin * 5; } -} + min-width: 24em; -.audio-selection-device { - border-radius: $base_border_radius * 2; - &:hover,&:focus { background-color: $hover_bg_color; } - &:active { - background-color: -st-accent-color; - color: -st-accent-fg-color; + .audio-selection-box { + spacing: $base_padding * 2; + + // styled similar to switcher-popup + .audio-selection-device { + @include tile_button($fg:$osd_fg_color, $bg:$osd_bg_color); + + .audio-selection-device-box { + padding: $base_padding * 2; + spacing: $base_padding * 2; + } + + .audio-selection-device-icon { + icon-size: $base_icon_size * 4; + } + } } } -.audio-selection-device-box { - padding: $base_margin * 5; - spacing: $base_margin * 5; -} - -.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"); @@ -173,4 +180,9 @@ /* Access portal dialog */ .access-dialog { text-align: center; -} \ No newline at end of file +} + +// specific label style for restart message +.restart-message { + @extend %title_4; +} diff --git a/js/ui/audioDeviceSelection.js b/js/ui/audioDeviceSelection.js index d4d5e12ab..bc6b263b7 100644 --- a/js/ui/audioDeviceSelection.js +++ b/js/ui/audioDeviceSelection.js @@ -55,17 +55,18 @@ const AudioDeviceSelectionDialog = GObject.registerClass({ this.contentLayout.add_child(content); + this.addButton({ + action: () => this.close(), + label: _('Cancel'), + key: Clutter.KEY_Escape, + }); + if (Main.sessionMode.allowSettings) { this.addButton({ action: this._openSettings.bind(this), label: _('Sound Settings'), }); } - this.addButton({ - action: () => this.close(), - label: _('Cancel'), - key: Clutter.KEY_Escape, - }); } _getDeviceLabel(device) { diff --git a/js/ui/components/polkitAgent.js b/js/ui/components/polkitAgent.js index 10ac3563f..fbee70230 100644 --- a/js/ui/components/polkitAgent.js +++ b/js/ui/components/polkitAgent.js @@ -21,7 +21,7 @@ const DialogMode = { CONFIRM: 1, }; -const DIALOG_ICON_SIZE = 64; +const DIALOG_ICON_SIZE = 96; const DELAYED_RESET_TIMEOUT = 200; diff --git a/js/ui/dialog.js b/js/ui/dialog.js index 3f918981c..8db4eb5ce 100644 --- a/js/ui/dialog.js +++ b/js/ui/dialog.js @@ -56,6 +56,7 @@ class Dialog extends St.Widget { this._dialog.add_child(this.contentLayout); this.buttonLayout = new St.Widget({ + style_class: 'modal-dialog-button-box', layout_manager: new Clutter.BoxLayout({ spacing: 12, homogeneous: true, @@ -124,7 +125,7 @@ class Dialog extends St.Widget { keys = []; let button = new St.Button({ - style_class: 'modal-dialog-linked-button', + style_class: 'modal-dialog-button', button_mask: St.ButtonMask.ONE | St.ButtonMask.THREE, reactive: true, can_focus: true, diff --git a/js/ui/main.js b/js/ui/main.js index a854fa04c..25c28b240 100644 --- a/js/ui/main.js +++ b/js/ui/main.js @@ -988,7 +988,7 @@ class RestartMessage extends ModalDialog.ModalDialog { _init(message) { super._init({ shellReactive: true, - styleClass: 'restart-message headline', + styleClass: 'restart-message', shouldFadeIn: false, destroyOnClose: true, });