[gtk+] Adwaita: proper message dialog style.
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Adwaita: proper message dialog style.
- Date: Sat, 5 Jul 2014 14:32:42 +0000 (UTC)
commit d648a2c7acb1d992346bfe9cba158df14a41f462
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Sat Jul 5 16:30:43 2014 +0200
Adwaita: proper message dialog style.
Rounded bottom border added, custom style for csd versione only
[read: non csd version looks right now].
gtk/resources/theme/Adwaita/_common.scss | 80 +++++++------
gtk/resources/theme/Adwaita/gtk-contained-dark.css | 123 ++++++++++---------
gtk/resources/theme/Adwaita/gtk-contained.css | 119 ++++++++++---------
3 files changed, 173 insertions(+), 149 deletions(-)
---
diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss
index 16fbc72..08cef54 100644
--- a/gtk/resources/theme/Adwaita/_common.scss
+++ b/gtk/resources/theme/Adwaita/_common.scss
@@ -1822,48 +1822,55 @@ GtkCalendar {
* Dialogs *
***********/
-.message-dialog {
- // no spacing in message dialogs and the likes
+.message-dialog { // Message Dialog styling
-GtkDialog-button-spacing: 0;
-}
-
-GtkMessageDialog .titlebar {
- border-style: none;
- box-shadow: inset 0 1px $borders_edge;
-}
-
-.dialog-action-area.linked {
- & .button {
- padding: 6px;
- border-radius: 0;
- @include button(normal, $noedge: true);
- @extend %middle_button;
- &:hover {
- @include button(hover, $noedge: true);
- @extend %middle_button;
- }
- &:active {
- @include button(active, $noedge: true);
- @extend %middle_button;
+ .titlebar {
+ border-style: none;
+ box-shadow: inset 0 1px $borders_edge;
+ }
+ &.csd { // rounded bottom border styling for csd version
+ &.background {
+ border-bottom-left-radius: 7px;
+ border-bottom-right-radius: 7px;
}
- &:insensitive {
- @include button(insensitive, $noedge: true);
+ .dialog-action-area .button {
+ padding: 8px;
+ border-radius: 0;
+ @include button(normal, $noedge: true);
@extend %middle_button;
+ &:hover {
+ @include button(hover, $noedge: true);
+ @extend %middle_button;
+ }
+ &:active {
+ @include button(active, $noedge: true);
+ @extend %middle_button;
+ }
+ &:insensitive {
+ @include button(insensitive, $noedge: true);
+ @extend %middle_button;
+ }
+ &:backdrop {
+ @include button(backdrop, $noedge: true);
+ @extend %middle_button;
+ }
+ &:backdrop:insensitive {
+ @include button(backdrop-insensitive, $noedge: true);
+ @extend %middle_button;
+ }
+ &:first-child{ @extend %first_button; }
+ &:last-child { @extend %last_button; }
}
- &:backdrop {
- @include button(backdrop, $noedge: true);
- @extend %middle_button;
+ %middle_button {
+ border-right-style: none;
+ border-bottom-style: none;
}
- &:backdrop:insensitive {
- @include button(backdrop-insensitive, $noedge: true);
- @extend %middle_button;
+ %last_button { border-bottom-right-radius: 7px; }
+ %first_button {
+ border-left-style: none;
+ border-bottom-left-radius: 7px;
}
- &:first-child{ @extend %first_button; }
}
- %middle_button {
- border-style: solid none none solid;
- }
- %first_button { border-style: solid none none none; }
}
GtkFileChooserDialog .dialog-action-box {
@@ -2081,6 +2088,9 @@ GtkColorChooserWidget #add-color-button {
border-radius: 5px;
box-shadow: none;
}
+ &.message-dialog {
+ border-radius: 7px;
+ }
}
}
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index b1ef1b7..193d5b7 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -2391,69 +2391,74 @@ GtkCalendar {
***********/
.message-dialog {
-GtkDialog-button-spacing: 0; }
-
-GtkMessageDialog .titlebar {
- border-style: none;
- box-shadow: inset 0 1px rgba(238, 238, 236, 0.1); }
-
-.dialog-action-area.linked .button {
- padding: 6px;
- border-radius: 0;
- border-width: 1px;
- border-style: solid;
- color: #eeeeec;
- background-image: linear-gradient(to bottom, #454c4c, #393f3f 40%, #2d3232);
- border-color: #1c1f1f;
- text-shadow: 0 -1px rgba(0, 0, 0, 0.81176);
- icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
- .dialog-action-area.linked .button:hover {
+ .message-dialog .titlebar {
+ border-style: none;
+ box-shadow: inset 0 1px rgba(238, 238, 236, 0.1); }
+ .message-dialog.csd.background {
+ border-bottom-left-radius: 7px;
+ border-bottom-right-radius: 7px; }
+ .message-dialog.csd .dialog-action-area .button {
+ padding: 8px;
+ border-radius: 0;
border-width: 1px;
border-style: solid;
color: #eeeeec;
+ background-image: linear-gradient(to bottom, #454c4c, #393f3f 40%, #2d3232);
border-color: #1c1f1f;
- background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f);
- text-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
- icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
+ text-shadow: 0 -1px rgba(0, 0, 0, 0.81176);
+ icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
- .dialog-action-area.linked .button:active {
- border-width: 1px;
- border-style: solid;
- color: #eeeeec;
- border-color: #1c1f1f;
- background-image: linear-gradient(to bottom, #212424, #2d3232 3%);
- text-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
- icon-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
- box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
- .dialog-action-area.linked .button:insensitive {
- border-width: 1px;
- border-style: solid;
- color: #939695;
- border-color: #1c1f1f;
- background-image: linear-gradient(to bottom, #323636);
- text-shadow: none;
- icon-shadow: none;
- box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
- .dialog-action-area.linked .button:backdrop {
- border-width: 1px;
- border-style: solid;
- color: #c9cbc9;
- border-color: #1e2222;
- background-image: linear-gradient(to bottom, #393f3f);
- text-shadow: none;
- icon-shadow: none;
- box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
- .dialog-action-area.linked .button:backdrop:insensitive {
- border-width: 1px;
- border-style: solid;
- color: #454c4c;
- border-color: #1e2222;
- background-image: linear-gradient(to bottom, #393f3f);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
-.dialog-action-area.linked .button, .dialog-action-area.linked .button:hover, .dialog-action-area.linked
.button:active, .dialog-action-area.linked .button:insensitive, .dialog-action-area.linked .button:backdrop,
.dialog-action-area.linked .button:backdrop:insensitive {
- border-style: solid none none solid; }
-.dialog-action-area.linked .button:first-child {
- border-style: solid none none none; }
+ .message-dialog.csd .dialog-action-area .button:hover {
+ border-width: 1px;
+ border-style: solid;
+ color: #eeeeec;
+ border-color: #1c1f1f;
+ background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f);
+ text-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
+ icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+ .message-dialog.csd .dialog-action-area .button:active {
+ border-width: 1px;
+ border-style: solid;
+ color: #eeeeec;
+ border-color: #1c1f1f;
+ background-image: linear-gradient(to bottom, #212424, #2d3232 3%);
+ text-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
+ icon-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
+ box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
+ .message-dialog.csd .dialog-action-area .button:insensitive {
+ border-width: 1px;
+ border-style: solid;
+ color: #939695;
+ border-color: #1c1f1f;
+ background-image: linear-gradient(to bottom, #323636);
+ text-shadow: none;
+ icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+ .message-dialog.csd .dialog-action-area .button:backdrop {
+ border-width: 1px;
+ border-style: solid;
+ color: #c9cbc9;
+ border-color: #1e2222;
+ background-image: linear-gradient(to bottom, #393f3f);
+ text-shadow: none;
+ icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
+ .message-dialog.csd .dialog-action-area .button:backdrop:insensitive {
+ border-width: 1px;
+ border-style: solid;
+ color: #454c4c;
+ border-color: #1e2222;
+ background-image: linear-gradient(to bottom, #393f3f);
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+ .message-dialog.csd .dialog-action-area .button, .message-dialog.csd .dialog-action-area .button:hover,
.message-dialog.csd .dialog-action-area .button:active, .message-dialog.csd .dialog-action-area
.button:insensitive, .message-dialog.csd .dialog-action-area .button:backdrop, .message-dialog.csd
.dialog-action-area .button:backdrop:insensitive {
+ border-right-style: none;
+ border-bottom-style: none; }
+ .message-dialog.csd .dialog-action-area .button:last-child {
+ border-bottom-right-radius: 7px; }
+ .message-dialog.csd .dialog-action-area .button:first-child {
+ border-left-style: none;
+ border-bottom-left-radius: 7px; }
GtkFileChooserDialog .dialog-action-box {
border-top: 1px solid #1c1f1f; }
@@ -2677,6 +2682,8 @@ GtkColorChooserWidget #add-color-button {
.window-frame.csd.tooltip {
border-radius: 5px;
box-shadow: none; }
+ .window-frame.csd.message-dialog {
+ border-radius: 7px; }
.button.titlebutton {
padding: 8px;
diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index c0672ce..b5d9c67 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -2383,69 +2383,74 @@ GtkCalendar {
***********/
.message-dialog {
-GtkDialog-button-spacing: 0; }
-
-GtkMessageDialog .titlebar {
- border-style: none;
- box-shadow: inset 0 1px white; }
-
-.dialog-action-area.linked .button {
- padding: 6px;
- border-radius: 0;
- border-width: 1px;
- border-style: solid;
- color: #2e3436;
- background-image: linear-gradient(to bottom, #fafafa, #ededed 40%, #e0e0e0);
- border-color: #a1a1a1;
- text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
- icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
- box-shadow: inset 0 1px white; }
- .dialog-action-area.linked .button:hover {
- border-width: 1px;
- border-style: solid;
- color: #2e3436;
- border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
- text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
- icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
+ .message-dialog .titlebar {
+ border-style: none;
box-shadow: inset 0 1px white; }
- .dialog-action-area.linked .button:active {
+ .message-dialog.csd.background {
+ border-bottom-left-radius: 7px;
+ border-bottom-right-radius: 7px; }
+ .message-dialog.csd .dialog-action-area .button {
+ padding: 8px;
+ border-radius: 0;
border-width: 1px;
border-style: solid;
color: #2e3436;
+ background-image: linear-gradient(to bottom, #fafafa, #ededed 40%, #e0e0e0);
border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, #c7c7c7, #d1d1d1 3%, lightgray);
text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
- box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
- .dialog-action-area.linked .button:insensitive {
- border-width: 1px;
- border-style: solid;
- color: #8d9091;
- border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, #f4f4f4);
- text-shadow: none;
- icon-shadow: none;
- box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
- .dialog-action-area.linked .button:backdrop {
- border-width: 1px;
- border-style: solid;
- color: #54595a;
- border-color: #a8a8a8;
- background-image: linear-gradient(to bottom, #ededed);
- text-shadow: none;
- icon-shadow: none;
- box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
- .dialog-action-area.linked .button:backdrop:insensitive {
- border-width: 1px;
- border-style: solid;
- color: #c7c7c7;
- border-color: #a8a8a8;
- background-image: linear-gradient(to bottom, #ededed);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
-.dialog-action-area.linked .button, .dialog-action-area.linked .button:hover, .dialog-action-area.linked
.button:active, .dialog-action-area.linked .button:insensitive, .dialog-action-area.linked .button:backdrop,
.dialog-action-area.linked .button:backdrop:insensitive {
- border-style: solid none none solid; }
-.dialog-action-area.linked .button:first-child {
- border-style: solid none none none; }
+ box-shadow: inset 0 1px white; }
+ .message-dialog.csd .dialog-action-area .button:hover {
+ border-width: 1px;
+ border-style: solid;
+ color: #2e3436;
+ border-color: #a1a1a1;
+ background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
+ text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
+ icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
+ box-shadow: inset 0 1px white; }
+ .message-dialog.csd .dialog-action-area .button:active {
+ border-width: 1px;
+ border-style: solid;
+ color: #2e3436;
+ border-color: #a1a1a1;
+ background-image: linear-gradient(to bottom, #c7c7c7, #d1d1d1 3%, lightgray);
+ text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
+ icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
+ box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
+ .message-dialog.csd .dialog-action-area .button:insensitive {
+ border-width: 1px;
+ border-style: solid;
+ color: #8d9091;
+ border-color: #a1a1a1;
+ background-image: linear-gradient(to bottom, #f4f4f4);
+ text-shadow: none;
+ icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+ .message-dialog.csd .dialog-action-area .button:backdrop {
+ border-width: 1px;
+ border-style: solid;
+ color: #54595a;
+ border-color: #a8a8a8;
+ background-image: linear-gradient(to bottom, #ededed);
+ text-shadow: none;
+ icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
+ .message-dialog.csd .dialog-action-area .button:backdrop:insensitive {
+ border-width: 1px;
+ border-style: solid;
+ color: #c7c7c7;
+ border-color: #a8a8a8;
+ background-image: linear-gradient(to bottom, #ededed);
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+ .message-dialog.csd .dialog-action-area .button, .message-dialog.csd .dialog-action-area .button:hover,
.message-dialog.csd .dialog-action-area .button:active, .message-dialog.csd .dialog-action-area
.button:insensitive, .message-dialog.csd .dialog-action-area .button:backdrop, .message-dialog.csd
.dialog-action-area .button:backdrop:insensitive {
+ border-right-style: none;
+ border-bottom-style: none; }
+ .message-dialog.csd .dialog-action-area .button:last-child {
+ border-bottom-right-radius: 7px; }
+ .message-dialog.csd .dialog-action-area .button:first-child {
+ border-left-style: none;
+ border-bottom-left-radius: 7px; }
GtkFileChooserDialog .dialog-action-box {
border-top: 1px solid #a1a1a1; }
@@ -2669,6 +2674,8 @@ GtkColorChooserWidget #add-color-button {
.window-frame.csd.tooltip {
border-radius: 5px;
box-shadow: none; }
+ .window-frame.csd.message-dialog {
+ border-radius: 7px; }
.button.titlebutton {
padding: 8px;
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]