callisto-debian/gtk3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adwaita: message dialog, destructive and suggested action buttons.

Browse Source 
...and generic linked destructive and suggested action button fix.
This commit is contained in:
Lapo Calamandrei 2014-07-05 18:18:44 +02:00
parent d648a2c7ac
commit f99f52ff4a
4 changed files with 244 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
gtk/resources/theme/Adwaita/_common.scss
View File

@ -334,7 +334,10 @@ GtkLabel {
// -GtkWidget-wide-separators: true; // -GtkWidget-wide-separators: true;
// -GtkWidget-horizontal-separator: 0; // -GtkWidget-horizontal-separator: 0;
// } // }
.linked &, .linked &:backdrop { .linked &,
.linked &:hover,
.linked &:active,
.linked &:backdrop {
@extend %linked_buttons; @extend %linked_buttons;
} }
} }
@ -1858,6 +1861,33 @@ GtkCalendar {
@include button(backdrop-insensitive, $noedge: true); @include button(backdrop-insensitive, $noedge: true);
@extend %middle_button; @extend %middle_button;
} }
@each $b_type, $b_color in (suggested-action, $selected_bg_color),
(destructive-action, $destructive_color) {
&.#{$b_type} {
@include button(normal, $b_color, white, $noedge: true);
@extend %middle_button;
&:hover {
@include button(hover, $b_color, white, $noedge: true);
@extend %middle_button;
}
&:active {
@include button(active, $b_color, white, $noedge: true);
@extend %middle_button;
}
&:backdrop {
@include button(backdrop, $b_color, white);
@extend %middle_button;
&:insensitive {
@include button(backdrop-insensitive);
@extend %middle_button;
}
}
&:insensitive {
@include button(insensitive);
@extend %middle_button;
}
}
}
&:first-child{ @extend %first_button; } &:first-child{ @extend %first_button; }
&:last-child { @extend %last_button; } &:last-child { @extend %last_button; }
} }

2
gtk/resources/theme/Adwaita/_drawing.scss
View File

@ -46,7 +46,7 @@ $widget_edge: 0 1px $borders_edge; //outer hilight "used" on
@if $variant == 'light' { @if $variant == 'light' {
border-color: $fc; border-color: $fc;
@include _shadows(inset 0 2px 2px -2px mix(black, $base_color, 50%), @include _shadows(inset 0 2px 2px -2px mix(black, $base_color, 50%),
inset 0 0 2px 1px mix($fc,$base_color,20%), inset 0 0 2px 1px mix($fc,$base_color,20%),
$_entry_edge); $_entry_edge);
} }
@else { @else {

108
gtk/resources/theme/Adwaita/gtk-contained-dark.css
View File

@ -550,7 +550,7 @@
border-radius: 3px; border-radius: 3px;
border-style: solid; } border-style: solid; }
.osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:backdrop { .osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:backdrop {
border-radius: 0; border-radius: 0;
border-left-style: none; } border-left-style: none; }
.osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl) { .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl) {
@ -2451,7 +2451,111 @@ GtkCalendar {
border-color: #1e2222; border-color: #1e2222;
background-image: linear-gradient(to bottom, #393f3f); background-image: linear-gradient(to bottom, #393f3f);
box-shadow: inset 0 1px rgba(255, 255, 255, 0); } 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 { .message-dialog.csd .dialog-action-area .button.suggested-action {
border-width: 1px;
border-style: solid;
color: white;
background-image: linear-gradient(to bottom, #256ab1, #215d9c 40%, #1c5187);
border-color: #0b1e33;
text-shadow: 0 -1px rgba(0, 0, 0, 0.70353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.70353);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.suggested-action:hover {
border-width: 1px;
border-style: solid;
color: white;
border-color: #0b1e33;
background-image: linear-gradient(to bottom, #3180d4, #2467ad 40%, #215d9c);
text-shadow: 0 -1px rgba(0, 0, 0, 0.67153);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.67153);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.suggested-action:active {
border-width: 1px;
border-style: solid;
color: white;
border-color: #0b1e33;
background-image: linear-gradient(to bottom, #184472, #1c5187 3%);
text-shadow: 0 -1px rgba(0, 0, 0, 0.78353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.78353);
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
.message-dialog.csd .dialog-action-area .button.suggested-action:backdrop {
border-width: 1px;
border-style: solid;
color: white;
border-color: #215d9c;
background-image: linear-gradient(to bottom, #215d9c);
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.suggested-action: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.suggested-action: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), 0 1px rgba(238, 238, 236, 0.1); }
.message-dialog.csd .dialog-action-area .button.destructive-action {
border-width: 1px;
border-style: solid;
color: white;
background-image: linear-gradient(to bottom, #ed1212, #d51010 40%, #bd0e0e);
border-color: #5e0707;
text-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.destructive-action:hover {
border-width: 1px;
border-style: solid;
color: white;
border-color: #5e0707;
background-image: linear-gradient(to bottom, #f03c3c, #e81111 40%, #d51010);
text-shadow: 0 -1px rgba(0, 0, 0, 0.60878);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.60878);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.destructive-action:active {
border-width: 1px;
border-style: solid;
color: white;
border-color: #5e0707;
background-image: linear-gradient(to bottom, #a60c0c, #bd0e0e 3%);
text-shadow: 0 -1px rgba(0, 0, 0, 0.72078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.72078);
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
.message-dialog.csd .dialog-action-area .button.destructive-action:backdrop {
border-width: 1px;
border-style: solid;
color: white;
border-color: #d51010;
background-image: linear-gradient(to bottom, #d51010);
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.destructive-action: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.destructive-action: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), 0 1px rgba(238, 238, 236, 0.1); }
.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, .message-dialog.csd .dialog-action-area .button.suggested-action, .message-dialog.csd .dialog-action-area .button.suggested-action:hover, .message-dialog.csd .dialog-action-area .button.suggested-action:active, .message-dialog.csd .dialog-action-area .button.suggested-action:backdrop, .message-dialog.csd .dialog-action-area .button.suggested-action:backdrop:insensitive, .message-dialog.csd .dialog-action-area .button.suggested-action:insensitive, .message-dialog.csd .dialog-action-area .button.destructive-action, .message-dialog.csd .dialog-action-area .button.destructive-action:hover, .message-dialog.csd .dialog-action-area .button.destructive-action:active, .message-dialog.csd .dialog-action-area .button.destructive-action:backdrop, .message-dialog.csd .dialog-action-area .button.destructive-action:backdrop:insensitive, .message-dialog.csd .dialog-action-area .button.destructive-action:insensitive {
border-right-style: none; border-right-style: none;
border-bottom-style: none; } border-bottom-style: none; }
.message-dialog.csd .dialog-action-area .button:last-child { .message-dialog.csd .dialog-action-area .button:last-child {

108
gtk/resources/theme/Adwaita/gtk-contained.css
View File

@ -542,7 +542,7 @@
border-radius: 3px; border-radius: 3px;
border-style: solid; } border-style: solid; }
.osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:backdrop { .osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:backdrop {
border-radius: 0; border-radius: 0;
border-left-style: none; } border-left-style: none; }
.osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl) { .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl) {
@ -2443,7 +2443,111 @@ GtkCalendar {
border-color: #a8a8a8; border-color: #a8a8a8;
background-image: linear-gradient(to bottom, #ededed); background-image: linear-gradient(to bottom, #ededed);
box-shadow: inset 0 1px rgba(255, 255, 255, 0); } 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 { .message-dialog.csd .dialog-action-area .button.suggested-action {
border-width: 1px;
border-style: solid;
color: white;
background-image: linear-gradient(to bottom, #5f9ddd, #4a90d9 40%, #3583d5);
border-color: #1c5187;
text-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.54353);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.suggested-action:hover {
border-width: 1px;
border-style: solid;
color: white;
border-color: #1c5187;
background-image: linear-gradient(to bottom, #85b4e5, #5b9add 40%, #4a90d9);
text-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.51153);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.suggested-action:active {
border-width: 1px;
border-style: solid;
color: white;
border-color: #1c5187;
background-image: linear-gradient(to bottom, #256ab1, #2974c2 3%, #2a76c6);
text-shadow: 0 -1px rgba(0, 0, 0, 0.62353);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.62353);
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
.message-dialog.csd .dialog-action-area .button.suggested-action:backdrop {
border-width: 1px;
border-style: solid;
color: white;
border-color: #4a90d9;
background-image: linear-gradient(to bottom, #4a90d9);
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.suggested-action: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.suggested-action: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), 0 1px white; }
.message-dialog.csd .dialog-action-area .button.destructive-action {
border-width: 1px;
border-style: solid;
color: white;
background-image: linear-gradient(to bottom, #f14141, #ef2929 40%, #ed1212);
border-color: #8e0b0b;
text-shadow: 0 -1px rgba(0, 0, 0, 0.56078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.56078);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.destructive-action:hover {
border-width: 1px;
border-style: solid;
color: white;
border-color: #8e0b0b;
background-image: linear-gradient(to bottom, #f46b6b, #f03c3c 40%, #ef2929);
text-shadow: 0 -1px rgba(0, 0, 0, 0.52878);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.52878);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
.message-dialog.csd .dialog-action-area .button.destructive-action:active {
border-width: 1px;
border-style: solid;
color: white;
border-color: #8e0b0b;
background-image: linear-gradient(to bottom, #bd0e0e, #d01010 3%, #d51010);
text-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
icon-shadow: 0 -1px rgba(0, 0, 0, 0.64078);
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
.message-dialog.csd .dialog-action-area .button.destructive-action:backdrop {
border-width: 1px;
border-style: solid;
color: white;
border-color: #ef2929;
background-image: linear-gradient(to bottom, #ef2929);
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.destructive-action: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.destructive-action: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), 0 1px white; }
.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, .message-dialog.csd .dialog-action-area .button.suggested-action, .message-dialog.csd .dialog-action-area .button.suggested-action:hover, .message-dialog.csd .dialog-action-area .button.suggested-action:active, .message-dialog.csd .dialog-action-area .button.suggested-action:backdrop, .message-dialog.csd .dialog-action-area .button.suggested-action:backdrop:insensitive, .message-dialog.csd .dialog-action-area .button.suggested-action:insensitive, .message-dialog.csd .dialog-action-area .button.destructive-action, .message-dialog.csd .dialog-action-area .button.destructive-action:hover, .message-dialog.csd .dialog-action-area .button.destructive-action:active, .message-dialog.csd .dialog-action-area .button.destructive-action:backdrop, .message-dialog.csd .dialog-action-area .button.destructive-action:backdrop:insensitive, .message-dialog.csd .dialog-action-area .button.destructive-action:insensitive {
border-right-style: none; border-right-style: none;
border-bottom-style: none; } border-bottom-style: none; }
.message-dialog.csd .dialog-action-area .button:last-child { .message-dialog.csd .dialog-action-area .button:last-child {