Adwaita: first round at osd revamp

...buttons, gtkscale and toolbars, more to follow...
This commit is contained in:
Lapo Calamandrei 2014-08-22 12:55:30 +02:00
parent 683a7f1429
commit 565d65c907
5 changed files with 624 additions and 195 deletions

View File

@ -20,9 +20,10 @@ $error_color: #cc0000;
$success_color: if($variant =='light', #73d216, darken(#73d216,10%));
$destructive_color: if($variant =='light', #ef2929, darken(#ef2929,10%));
$osd_fg_color: #fff;
$osd_bg_color: transparentize(#000,0.4);
$osd_borders_color: transparentize(#666,0.2);
$osd_fg_color: #eeeeec;
$osd_bg_color: #2e3436;
$osd_borders_color: transparentize(black, 0.3);
$osd_outer_borders_color: transparentize(white, 0.9);
//insensitive state derived colors
$insensitive_fg_color: mix($fg_color, $bg_color, 50%);

View File

@ -135,12 +135,12 @@ GtkLabel {
&:selected,
&:selected:focus,
&:selected:hover,
&:backdrop:selected {
@extend %selected_items;
}
&:insensitive {
color: $insensitive_fg_color;
}
&:backdrop:selected {
@extend %selected_items;
}
}
.dim-label {
@ -160,6 +160,11 @@ GtkAssistant {
}
}
.osd {
color: $osd_fg_color;
text-shadow: 0 1px black;
&:backdrop { text-shadow: none; }
}
/*********************
* Spinner Animation *
@ -322,10 +327,6 @@ $_dot_color: if($variant=='light', $selected_bg_color,
@include button(backdrop-insensitive-active);
}
}
//&:selected, &.flat:selected, Why this?
//&:selected:focus, &.flat:focus {
// @extend %selected_items;
//}
&:insensitive {
@include button(insensitive);
&:active, &.flat:active,
@ -338,36 +339,52 @@ $_dot_color: if($variant=='light', $selected_bg_color,
}
// big standalone buttons like in Documents pager
&.osd {
border-radius: 6px;
padding: 12px;
border-width: 1px 1px 2px 1px;
&.image-button { padding: 13px; }
color: $osd_fg_color;
text-shadow: none;
icon-shadow: none;
border-radius: 6px;
outline-color: transparentize($osd_fg_color, 0.8);
@include button(osd);
&:hover { @include button(osd-hover); }
&:active, &:checked { @include button(osd-active); }
&:insensitive { @include button(osd-insensitive); }
&:backdrop { @include button(osd-backdrop); }
border-color: $osd_outer_borders_color;
box-shadow: none;
&:hover {
@include button(osd-hover);
border-color: $osd_outer_borders_color;
box-shadow: none;
}
&:active, &:checked {
@include button(osd-active);
border-color: $osd_outer_borders_color;
box-shadow: none
}
&:insensitive, &:backdrop:insensitive {
@include button(osd-insensitive);
border-color: $osd_outer_borders_color;
// FIXME: if this state actually exists we should probably make the button
// disappear
}
&:backdrop {
@include button(osd-backdrop);
border-color: $osd_outer_borders_color;
}
}
//overlay / OSD style
.osd & {
padding: 6px;
border-width: 1px 1px 2px 1px;
// FIXME: for some reason I can't figure out the bookmark button in gnome documents
// gets borders radius 0, when they get backdrop and another state
border-width: 1px;
color: $osd_fg_color;
outline-color: transparentize($osd_fg_color, 0.8);
@include button(osd);
text-shadow: none;
icon-shadow: none;
@extend %linked;
&:hover {
@include button(osd-hover);
@extend %linked;
}
&:active, &:checked {
&:active, &:checked, &:backdrop:active, &:backdrop:checked {
@include button(osd-active);
@extend %linked;
}
&:insensitive {
&:insensitive, &:backdrop:insensitive {
@include button(osd-insensitive);
@extend %linked;
}
@ -397,6 +414,26 @@ $_dot_color: if($variant=='light', $selected_bg_color,
&:insensitive {
@include button(insensitive);
}
.osd & {
@include button(osd, $b_color);
@extend %linked;
&:hover {
@include button(osd-hover, $b_color);
@extend %linked;
}
&:active, &:checked, &:backdrop:active, &:backdrop:checked {
@include button(osd-active, $b_color);
@extend %linked;
}
&:insensitive, &:backdrop:insensitive {
@include button(osd-insensitive, $b_color);
@extend %linked;
}
&:backdrop {
@include button(osd-backdrop, $b_color);
@extend %linked;
}
}
}
}
&.image-button,
@ -490,7 +527,6 @@ $_dot_color: if($variant=='light', $selected_bg_color,
.linked.vertical &:active,
.linked.vertical &:checked,
.linked.vertical &:backdrop { @extend %linked_vertical; }
}
// all the following is for the +|- buttons on inline toolbars, that way
@ -806,10 +842,12 @@ GtkComboBox {
-GtkWidget-window-dragging: true;
padding: 4px;
background-color: $bg_color;
.osd & {
background-color: $osd_bg_color;
.osd &, &.osd {
padding: 13px;
border: $osd_outer_borders_color;
border-radius: 6px;
padding: 12px;
background-color: transparentize($osd_bg_color, 0.3);
background-clip: padding-box;
}
}
@ -1200,14 +1238,6 @@ GtkTreeView.view.progressbar { //Progressbar in treeview cells
border-style: none;
background-color: transparent;
}
// .separator { Those props doesn't seem to do anything
// font-size: 80%; I'll comment these out for now and I'll
// font-weight: bold; delete if nobody blames me :-)
// text-shadow: none;
// background-color: transparent;
// icon-shadow: none;
// border: 0;
// }
.button.flat,
.button.flat:hover {
text-shadow: none;
@ -1808,13 +1838,11 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
}
//OSD sliders
.osd & {
background-image: none;
background-color: opacify($osd_borders_color,1);
border-width: 1px;
box-shadow: none;
border-color: $osd_borders_color;
&:hover { border-color: lighten($osd_borders_color,10%); }
&:active { border-color: lighten($osd_borders_color,30%); }
@include button(osd);
background-color: $osd_bg_color;
&:hover { @include button(osd-hover); }
&:active { @include button(osd-active); }
&:backdrop { @include button(osd-backdrop); }
}
}
&.trough {
@ -1848,16 +1876,32 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
background-color: mix($backdrop_bg_color,$borders_color);
box-shadow: none;
}
&:backdrop:insensitive, .hilight:backdrop:insensitive {
&:backdrop:insensitive, .highlight:backdrop:insensitive {
border-color: $backdrop_borders_color;
background-color: $insensitive_bg_color;
}
//OSD troughs
.osd & {
background-image: none;
border-width: 0;
//background-color: $osd_borders_color;
border-color: $osd_borders_color;
box-shadow: none;
margin: 9px;
&.fine-tune { margin: 7px; }
background-color: transparentize($osd_borders_color, 0.2);
outline-color: transparentize($osd_fg_color, 0.8);
outline-offset: -8px;
&.highlight {
background-image: none;
background-color: $selected_bg_color;
}
&:insensitive, &:backdrop:insensitive {
border-color: transparent;
background-color: transparent;
}
&:backdrop {
border-color: $osd_borders_color;
background-color: none;
background-image: none;
}
}
}
}

View File

@ -139,7 +139,7 @@ $widget_edge: 0 1px $borders_edge; //outer hilight "used" on
// possible $t values:
// normal, hover, active, insensitive, insensitive-active,
// backdrop, backdrop-active, backdrop-insensitive, backdrop-insensitive-active,
// osd, osd-hover, osd-active, osd-insensitive, undecorated
// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
//
border-style: solid;
@ -299,32 +299,62 @@ $widget_edge: 0 1px $borders_edge; //outer hilight "used" on
//
// normal osd button
//
background-image: linear-gradient(to bottom, $osd_bg_color);
$_bg: if($c!=$bg_color, transparentize($c, 0.5),
transparentize($osd_bg_color, 0.3));
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, $_bg);
border-color: $osd_borders_color;
box-shadow: none;
box-shadow: inset 0 -1px transparentize(black, 0.7),
inset 0 1px transparentize(white, 0.9);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
}
@else if $t==osd-hover {
//
// active osd button
//
background-image: linear-gradient(to bottom, lighten($osd_bg_color,10%));
$_bg: if($c!=$bg_color, transparentize($c, 0.3),
transparentize(lighten($osd_bg_color, 20%), 0.3));
color: white;
border-color: $osd_borders_color;
box-shadow: none;
background-image: linear-gradient(to bottom, $_bg);
}
@else if $t==osd-active {
//
// active osd button
//
background-image: linear-gradient(to bottom, lighten($osd_bg_color,20%));
$_bg: if($c!=$bg_color, $c, $selected_bg_color);
color: white;
border-color: $osd_borders_color;
background-image: linear-gradient(to bottom, $_bg);
box-shadow: none;
text-shadow: none;
icon-shadow: none;
}
@else if $t==osd-insensitive {
//
// insensitive osd button
//
border-color: $osd_borders_color;
$_bg: transparentize(mix($insensitive_fg_color,$osd_bg_color,20%),0.3);
color: $insensitive_fg_color;
border-color: $osd_borders_color;
background-image: linear-gradient(to bottom, $_bg);
box-shadow: none;
text-shadow: none;
icon-shadow: none;
}
@else if $t==osd-backdrop {
//
// backdrop osd button
//
$_bg: if($c!=$bg_color, transparentize($c, 0.5),
transparentize($osd_bg_color, 0.3));
background-image: linear-gradient(to bottom, $_bg);
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none;
}
@else if $t==undecorated {
//

View File

@ -116,7 +116,7 @@
.overshoot {
background-color: rgba(33, 93, 156, 0.2); }
GtkLabel:insensitive {
GtkLabel:selected, GtkLabel:selected:focus, GtkLabel:selected:hover, GtkLabel:insensitive {
color: #939695; }
.dim-label, .titlebar .subtitle, GtkCalendar.header .subtitle,
@ -131,6 +131,12 @@ GtkAssistant .sidebar GtkLabel {
GtkAssistant .sidebar GtkLabel.highlight {
background-color: #212424; }
.osd {
color: #eeeeec;
text-shadow: 0 1px black; }
.osd:backdrop {
text-shadow: none; }
/*********************
* Spinner Animation *
*********************/
@ -360,58 +366,95 @@ GtkAssistant .sidebar GtkLabel.highlight {
background-image: linear-gradient(to bottom, #2f3333, #323636);
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0.1); }
.button.osd {
color: #eeeeec;
border-radius: 6px;
padding: 12px;
border-width: 1px 1px 2px 1px;
color: white;
text-shadow: none;
icon-shadow: none;
outline-color: rgba(238, 238, 236, 0.2);
border-style: solid;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6));
border-color: rgba(102, 102, 102, 0.8);
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: none; }
.button.osd.image-button {
padding: 13px; }
.button.osd:hover {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.6));
border-color: rgba(102, 102, 102, 0.8);
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7));
border-color: rgba(255, 255, 255, 0.1);
box-shadow: none; }
.button.osd:active, .button.osd:checked {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0.6));
border-color: rgba(102, 102, 102, 0.8);
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #215d9c);
box-shadow: none;
text-shadow: none;
icon-shadow: none;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: none; }
.button.osd:insensitive {
.button.osd:insensitive, .button.osd:backdrop:insensitive {
border-style: solid;
border-color: rgba(102, 102, 102, 0.8);
color: #939695; }
color: #939695;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(66, 71, 73, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none;
border-color: rgba(255, 255, 255, 0.1); }
.button.osd:backdrop {
border-style: solid; }
border-style: solid;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none;
border-color: rgba(255, 255, 255, 0.1); }
.osd .button {
padding: 6px;
border-width: 1px 1px 2px 1px;
color: white;
border-width: 1px;
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.2);
border-style: solid;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.osd .button:hover {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
.osd .button:active, .osd .button:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7)); }
.osd .button:active, .osd .button:checked, .osd .button:backdrop:active, .osd .button:backdrop:checked {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
.osd .button:insensitive {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #215d9c);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button:insensitive, .osd .button:backdrop:insensitive {
border-style: solid;
border-color: rgba(102, 102, 102, 0.8);
color: #939695; }
color: #939695;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(66, 71, 73, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button:backdrop {
border-style: solid; }
border-style: solid;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.button.suggested-action {
border-style: solid;
border-width: 1px;
@ -462,6 +505,43 @@ GtkAssistant .sidebar GtkLabel.highlight {
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0.1); }
.osd .button.suggested-action {
border-style: solid;
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0.5));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.osd .button.suggested-action:hover {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0.7)); }
.osd .button.suggested-action:active, .osd .button.suggested-action:checked, .osd .button.suggested-action:backdrop:active, .osd .button.suggested-action:backdrop:checked {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #215d9c);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.suggested-action:insensitive, .osd .button.suggested-action:backdrop:insensitive {
border-style: solid;
color: #939695;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(66, 71, 73, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.suggested-action:backdrop {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.button.destructive-action {
border-style: solid;
border-width: 1px;
@ -512,6 +592,43 @@ GtkAssistant .sidebar GtkLabel.highlight {
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0.1); }
.osd .button.destructive-action {
border-style: solid;
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(213, 16, 16, 0.5));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.osd .button.destructive-action:hover {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(213, 16, 16, 0.7)); }
.osd .button.destructive-action:active, .osd .button.destructive-action:checked, .osd .button.destructive-action:backdrop:active, .osd .button.destructive-action:backdrop:checked {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #d51010);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.destructive-action:insensitive, .osd .button.destructive-action:backdrop:insensitive {
border-style: solid;
color: #939695;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(66, 71, 73, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.destructive-action:backdrop {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(213, 16, 16, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.button.image-button, .button.image-button {
padding: 8px; }
.button.text-button {
@ -652,23 +769,23 @@ GtkAssistant .sidebar GtkLabel.highlight {
.inline-toolbar GtkToolButton > .button.flat, .inline-toolbar.search-bar GtkToolButton > .button.flat,
.inline-toolbar GtkToolButton:backdrop > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop > .button.flat, .osd .button, .osd .button:hover, .osd .button:active, .osd .button:checked, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:checked, .linked .button:backdrop, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop, .linked > GtkComboBox > .button:dir(ltr) {
.inline-toolbar.search-bar GtkToolButton:backdrop > .button.flat, .osd .button, .osd .button:hover, .osd .button:active, .osd .button:checked, .osd .button:backdrop:active, .osd .button:backdrop:checked, .osd .button:insensitive, .osd .button:backdrop:insensitive, .osd .button:backdrop, .osd .button.suggested-action, .osd .button.suggested-action:hover, .osd .button.suggested-action:active, .osd .button.suggested-action:checked, .osd .button.suggested-action:backdrop:active, .osd .button.suggested-action:backdrop:checked, .osd .button.suggested-action:insensitive, .osd .button.suggested-action:backdrop:insensitive, .osd .button.suggested-action:backdrop, .osd .button.destructive-action, .osd .button.destructive-action:hover, .osd .button.destructive-action:active, .osd .button.destructive-action:checked, .osd .button.destructive-action:backdrop:active, .osd .button.destructive-action:backdrop:checked, .osd .button.destructive-action:insensitive, .osd .button.destructive-action:backdrop:insensitive, .osd .button.destructive-action:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:checked, .linked .button:backdrop, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop, .linked > GtkComboBox > .button:dir(ltr) {
border-radius: 0;
border-left-style: none; }
.inline-toolbar GtkToolButton > .button.flat:dir(rtl),
.inline-toolbar GtkToolButton:backdrop > .button.flat:dir(rtl), .inline-toolbar GtkToolButton:dir(rtl) > .button.flat, .inline-toolbar.search-bar GtkToolButton:dir(rtl) > .button.flat,
.inline-toolbar GtkToolButton:backdrop:dir(rtl) > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:dir(rtl) > .button.flat, .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl), GtkComboBox.combobox-entry .entry:dir(rtl), GtkComboBox.combobox-entry .button:dir(rtl), .linked > GtkComboBox > .button:dir(rtl) {
.inline-toolbar.search-bar GtkToolButton:backdrop:dir(rtl) > .button.flat, .osd .button:dir(rtl), .osd .button.suggested-action:dir(rtl):hover, .osd .button.suggested-action:dir(rtl):active, .osd .button.suggested-action:dir(rtl):checked, .osd .button.suggested-action:dir(rtl):insensitive, .osd .button.suggested-action:dir(rtl):backdrop, .osd .button.destructive-action:dir(rtl):hover, .osd .button.destructive-action:dir(rtl):active, .osd .button.destructive-action:dir(rtl):checked, .osd .button.destructive-action:dir(rtl):insensitive, .osd .button.destructive-action:dir(rtl):backdrop, .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl), GtkComboBox.combobox-entry .entry:dir(rtl), GtkComboBox.combobox-entry .button:dir(rtl), .linked > GtkComboBox > .button:dir(rtl) {
border-radius: 0;
border-right-style: none;
border-left-style: solid; }
.osd .button:first-child, .inline-toolbar .button:first-child, .linked .button:first-child, .inline-toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:first-child > .button.flat,
.osd .button:first-child, .osd .button.suggested-action:first-child:hover, .osd .button.suggested-action:first-child:active, .osd .button.suggested-action:first-child:checked, .osd .button.suggested-action:first-child:insensitive, .osd .button.suggested-action:first-child:backdrop, .osd .button.destructive-action:first-child:hover, .osd .button.destructive-action:first-child:active, .osd .button.destructive-action:first-child:checked, .osd .button.destructive-action:first-child:insensitive, .osd .button.destructive-action:first-child:backdrop, .inline-toolbar .button:first-child, .linked .button:first-child, .inline-toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:first-child > .button.flat,
.inline-toolbar GtkToolButton:backdrop:first-child > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:first-child > .button.flat, GtkComboBox.combobox-entry .entry:first-child, GtkComboBox.combobox-entry .button:first-child, .linked > GtkComboBox:first-child > .button {
border-radius: 3px 0 0 3px;
border-left-style: solid; }
.osd .button:last-child, .inline-toolbar .button:last-child, .linked .button:last-child, .inline-toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child > .button.flat,
.osd .button:last-child, .osd .button.suggested-action:last-child:hover, .osd .button.suggested-action:last-child:active, .osd .button.suggested-action:last-child:checked, .osd .button.suggested-action:last-child:insensitive, .osd .button.suggested-action:last-child:backdrop, .osd .button.destructive-action:last-child:hover, .osd .button.destructive-action:last-child:active, .osd .button.destructive-action:last-child:checked, .osd .button.destructive-action:last-child:insensitive, .osd .button.destructive-action:last-child:backdrop, .inline-toolbar .button:last-child, .linked .button:last-child, .inline-toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child > .button.flat,
.inline-toolbar GtkToolButton:backdrop:last-child > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:last-child > .button.flat, GtkComboBox.combobox-entry .entry:last-child, GtkComboBox.combobox-entry .button:last-child, .linked > GtkComboBox:last-child > .button {
border-radius: 0 3px 3px 0; }
@ -677,7 +794,7 @@ GtkAssistant .sidebar GtkLabel.highlight {
.inline-toolbar GtkToolButton:backdrop:last-child:dir(rtl) > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:last-child:dir(rtl) > .button.flat, GtkComboBox.combobox-entry .entry:last-child:dir(rtl), GtkComboBox.combobox-entry .button:last-child:dir(rtl), .linked > GtkComboBox:last-child > .button:dir(rtl) {
border-right-style: solid; }
.osd .button:only-child, .inline-toolbar .button:only-child, .linked .button:only-child, .inline-toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:only-child > .button.flat,
.osd .button:only-child, .osd .button.suggested-action:only-child:hover, .osd .button.suggested-action:only-child:active, .osd .button.suggested-action:only-child:checked, .osd .button.suggested-action:only-child:insensitive, .osd .button.suggested-action:only-child:backdrop, .osd .button.destructive-action:only-child:hover, .osd .button.destructive-action:only-child:active, .osd .button.destructive-action:only-child:checked, .osd .button.destructive-action:only-child:insensitive, .osd .button.destructive-action:only-child:backdrop, .inline-toolbar .button:only-child, .linked .button:only-child, .inline-toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:only-child > .button.flat,
.inline-toolbar GtkToolButton:backdrop:only-child > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:only-child > .button.flat, GtkComboBox.combobox-entry .entry:only-child, GtkComboBox.combobox-entry .button:only-child, .linked > GtkComboBox:only-child > .button {
border-radius: 3px;
@ -919,10 +1036,12 @@ GtkComboBox {
-GtkWidget-window-dragging: true;
padding: 4px;
background-color: #393f3f; }
.osd .toolbar, .osd .inline-toolbar, .osd .search-bar {
background-color: rgba(0, 0, 0, 0.6);
.osd .toolbar, .osd .inline-toolbar, .osd .search-bar, .toolbar.osd, .osd.inline-toolbar, .osd.search-bar {
padding: 13px;
border: rgba(255, 255, 255, 0.1);
border-radius: 6px;
padding: 12px; }
background-color: rgba(46, 52, 54, 0.7);
background-clip: padding-box; }
.inline-toolbar {
border-width: 0 1px 1px;
@ -1320,30 +1439,41 @@ GtkTreeView.view.progressbar {
transition: none; }
.popover.osd {
background-image: none;
background-color: rgba(0, 0, 0, 0.6);
background-color: #2e3436;
border: 1px solid #1c1f1f;
color: white; }
color: #eeeeec; }
.popover.osd .button {
color: white;
text-shadow: none;
border-style: solid;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.popover.osd .button:hover {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7)); }
.popover.osd .button:active {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #215d9c);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.popover.osd .button:insensitive {
border-style: solid;
border-color: rgba(102, 102, 102, 0.8);
color: #939695; }
color: #939695;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(66, 71, 73, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.entry.cursor-handle,
.cursor-handle {
@ -2088,19 +2218,41 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
.osd .scale.slider, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider {
background-image: none;
background-color: #666666;
border-width: 1px;
box-shadow: none;
border-color: rgba(102, 102, 102, 0.8); }
border-style: solid;
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
background-color: #2e3436; }
.osd .scale.slider:hover, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider:hover, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:hover {
border-color: rgba(128, 128, 128, 0.8); }
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7)); }
.osd .scale.slider:active, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider:active, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:active {
border-color: rgba(179, 179, 179, 0.8); }
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #215d9c);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .scale.slider:backdrop, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider:backdrop, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:backdrop {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.scale.trough,
.scale.scale-has-marks-above.scale-has-marks-below.trough,
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough {
@ -2141,19 +2293,44 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
border-color: #1e2222;
background-color: #2a2f2f;
box-shadow: none; }
.scale.trough:backdrop:insensitive, .scale.trough .hilight:backdrop:insensitive,
.scale.trough:backdrop:insensitive, .scale.trough .highlight:backdrop:insensitive,
.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive,
.scale.scale-has-marks-above.scale-has-marks-below.trough .hilight:backdrop:insensitive,
.scale.scale-has-marks-above.scale-has-marks-below.trough .highlight:backdrop:insensitive,
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive,
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .hilight:backdrop:insensitive {
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .highlight:backdrop:insensitive {
border-color: #1e2222;
background-color: #323636; }
.osd .scale.trough, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough {
background-image: none;
border-width: 0;
box-shadow: none; }
border-color: rgba(0, 0, 0, 0.7);
box-shadow: none;
margin: 9px;
background-color: rgba(0, 0, 0, 0.5);
outline-color: rgba(238, 238, 236, 0.2);
outline-offset: -8px; }
.osd .scale.trough.fine-tune, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough.fine-tune, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.fine-tune {
margin: 7px; }
.osd .scale.trough.highlight, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight {
background-image: none;
background-color: #215d9c; }
.osd .scale.trough:insensitive, .osd .scale.trough:backdrop:insensitive, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough:insensitive, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:insensitive, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive {
border-color: transparent;
background-color: transparent; }
.osd .scale.trough:backdrop, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop {
border-color: rgba(0, 0, 0, 0.7);
background-color: none;
background-image: none; }
.scale.scale-has-marks-below {
-GtkScale-slider-length: 20;
@ -2510,7 +2687,7 @@ GtkLevelBar.vertical {
.level-bar.fill-block.empty-fill-block:backdrop {
border-color: rgba(201, 203, 201, 0.15); }
.view:selected, .view:selected:focus, .view:selected:hover, GtkLabel:selected, GtkLabel:selected:focus, GtkLabel:selected:hover, GtkLabel:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:selected {
.view:selected, .view:selected:focus, .view:selected:hover, GtkLabel:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:selected {
background-color: #215d9c;
color: white; }
.view:backdrop:selected, GtkLabel:backdrop:selected, .entry:backdrop:selected, .menuitem.button.flat:backdrop:selected {

View File

@ -116,7 +116,7 @@
.overshoot {
background-color: rgba(74, 144, 217, 0.2); }
GtkLabel:insensitive {
GtkLabel:selected, GtkLabel:selected:focus, GtkLabel:selected:hover, GtkLabel:insensitive {
color: #8d9091; }
.dim-label, .titlebar .subtitle, GtkCalendar.header .subtitle,
@ -131,6 +131,12 @@ GtkAssistant .sidebar GtkLabel {
GtkAssistant .sidebar GtkLabel.highlight {
background-color: lightgray; }
.osd {
color: #eeeeec;
text-shadow: 0 1px black; }
.osd:backdrop {
text-shadow: none; }
/*********************
* Spinner Animation *
*********************/
@ -352,58 +358,95 @@ GtkAssistant .sidebar GtkLabel.highlight {
background-image: linear-gradient(to bottom, #ebebeb, #f4f4f4);
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px white; }
.button.osd {
color: #eeeeec;
border-radius: 6px;
padding: 12px;
border-width: 1px 1px 2px 1px;
color: white;
text-shadow: none;
icon-shadow: none;
outline-color: rgba(238, 238, 236, 0.2);
border-style: solid;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6));
border-color: rgba(102, 102, 102, 0.8);
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: none; }
.button.osd.image-button {
padding: 13px; }
.button.osd:hover {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.6));
border-color: rgba(102, 102, 102, 0.8);
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7));
border-color: rgba(255, 255, 255, 0.1);
box-shadow: none; }
.button.osd:active, .button.osd:checked {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0.6));
border-color: rgba(102, 102, 102, 0.8);
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #4a90d9);
box-shadow: none;
text-shadow: none;
icon-shadow: none;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: none; }
.button.osd:insensitive {
.button.osd:insensitive, .button.osd:backdrop:insensitive {
border-style: solid;
border-color: rgba(102, 102, 102, 0.8);
color: #8d9091; }
color: #8d9091;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(65, 70, 72, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none;
border-color: rgba(255, 255, 255, 0.1); }
.button.osd:backdrop {
border-style: solid; }
border-style: solid;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none;
border-color: rgba(255, 255, 255, 0.1); }
.osd .button {
padding: 6px;
border-width: 1px 1px 2px 1px;
color: white;
border-width: 1px;
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.2);
border-style: solid;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.osd .button:hover {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
.osd .button:active, .osd .button:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7)); }
.osd .button:active, .osd .button:checked, .osd .button:backdrop:active, .osd .button:backdrop:checked {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
.osd .button:insensitive {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #4a90d9);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button:insensitive, .osd .button:backdrop:insensitive {
border-style: solid;
border-color: rgba(102, 102, 102, 0.8);
color: #8d9091; }
color: #8d9091;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(65, 70, 72, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button:backdrop {
border-style: solid; }
border-style: solid;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.button.suggested-action {
border-style: solid;
border-width: 1px;
@ -454,6 +497,43 @@ GtkAssistant .sidebar GtkLabel.highlight {
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px white; }
.osd .button.suggested-action {
border-style: solid;
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0.5));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.osd .button.suggested-action:hover {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0.7)); }
.osd .button.suggested-action:active, .osd .button.suggested-action:checked, .osd .button.suggested-action:backdrop:active, .osd .button.suggested-action:backdrop:checked {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #4a90d9);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.suggested-action:insensitive, .osd .button.suggested-action:backdrop:insensitive {
border-style: solid;
color: #8d9091;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(65, 70, 72, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.suggested-action:backdrop {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.button.destructive-action {
border-style: solid;
border-width: 1px;
@ -504,6 +584,43 @@ GtkAssistant .sidebar GtkLabel.highlight {
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px white; }
.osd .button.destructive-action {
border-style: solid;
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(239, 41, 41, 0.5));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.osd .button.destructive-action:hover {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(239, 41, 41, 0.7)); }
.osd .button.destructive-action:active, .osd .button.destructive-action:checked, .osd .button.destructive-action:backdrop:active, .osd .button.destructive-action:backdrop:checked {
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #ef2929);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.destructive-action:insensitive, .osd .button.destructive-action:backdrop:insensitive {
border-style: solid;
color: #8d9091;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(65, 70, 72, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .button.destructive-action:backdrop {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(239, 41, 41, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.button.image-button, .button.image-button {
padding: 8px; }
.button.text-button {
@ -644,23 +761,23 @@ GtkAssistant .sidebar GtkLabel.highlight {
.inline-toolbar GtkToolButton > .button.flat, .inline-toolbar.search-bar GtkToolButton > .button.flat,
.inline-toolbar GtkToolButton:backdrop > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop > .button.flat, .osd .button, .osd .button:hover, .osd .button:active, .osd .button:checked, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:checked, .linked .button:backdrop, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop, .linked > GtkComboBox > .button:dir(ltr) {
.inline-toolbar.search-bar GtkToolButton:backdrop > .button.flat, .osd .button, .osd .button:hover, .osd .button:active, .osd .button:checked, .osd .button:backdrop:active, .osd .button:backdrop:checked, .osd .button:insensitive, .osd .button:backdrop:insensitive, .osd .button:backdrop, .osd .button.suggested-action, .osd .button.suggested-action:hover, .osd .button.suggested-action:active, .osd .button.suggested-action:checked, .osd .button.suggested-action:backdrop:active, .osd .button.suggested-action:backdrop:checked, .osd .button.suggested-action:insensitive, .osd .button.suggested-action:backdrop:insensitive, .osd .button.suggested-action:backdrop, .osd .button.destructive-action, .osd .button.destructive-action:hover, .osd .button.destructive-action:active, .osd .button.destructive-action:checked, .osd .button.destructive-action:backdrop:active, .osd .button.destructive-action:backdrop:checked, .osd .button.destructive-action:insensitive, .osd .button.destructive-action:backdrop:insensitive, .osd .button.destructive-action:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:checked, .linked .button:backdrop, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop, .linked > GtkComboBox > .button:dir(ltr) {
border-radius: 0;
border-left-style: none; }
.inline-toolbar GtkToolButton > .button.flat:dir(rtl),
.inline-toolbar GtkToolButton:backdrop > .button.flat:dir(rtl), .inline-toolbar GtkToolButton:dir(rtl) > .button.flat, .inline-toolbar.search-bar GtkToolButton:dir(rtl) > .button.flat,
.inline-toolbar GtkToolButton:backdrop:dir(rtl) > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:dir(rtl) > .button.flat, .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl), GtkComboBox.combobox-entry .entry:dir(rtl), GtkComboBox.combobox-entry .button:dir(rtl), .linked > GtkComboBox > .button:dir(rtl) {
.inline-toolbar.search-bar GtkToolButton:backdrop:dir(rtl) > .button.flat, .osd .button:dir(rtl), .osd .button.suggested-action:dir(rtl):hover, .osd .button.suggested-action:dir(rtl):active, .osd .button.suggested-action:dir(rtl):checked, .osd .button.suggested-action:dir(rtl):insensitive, .osd .button.suggested-action:dir(rtl):backdrop, .osd .button.destructive-action:dir(rtl):hover, .osd .button.destructive-action:dir(rtl):active, .osd .button.destructive-action:dir(rtl):checked, .osd .button.destructive-action:dir(rtl):insensitive, .osd .button.destructive-action:dir(rtl):backdrop, .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl), GtkComboBox.combobox-entry .entry:dir(rtl), GtkComboBox.combobox-entry .button:dir(rtl), .linked > GtkComboBox > .button:dir(rtl) {
border-radius: 0;
border-right-style: none;
border-left-style: solid; }
.osd .button:first-child, .inline-toolbar .button:first-child, .linked .button:first-child, .inline-toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:first-child > .button.flat,
.osd .button:first-child, .osd .button.suggested-action:first-child:hover, .osd .button.suggested-action:first-child:active, .osd .button.suggested-action:first-child:checked, .osd .button.suggested-action:first-child:insensitive, .osd .button.suggested-action:first-child:backdrop, .osd .button.destructive-action:first-child:hover, .osd .button.destructive-action:first-child:active, .osd .button.destructive-action:first-child:checked, .osd .button.destructive-action:first-child:insensitive, .osd .button.destructive-action:first-child:backdrop, .inline-toolbar .button:first-child, .linked .button:first-child, .inline-toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:first-child > .button.flat,
.inline-toolbar GtkToolButton:backdrop:first-child > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:first-child > .button.flat, GtkComboBox.combobox-entry .entry:first-child, GtkComboBox.combobox-entry .button:first-child, .linked > GtkComboBox:first-child > .button {
border-radius: 3px 0 0 3px;
border-left-style: solid; }
.osd .button:last-child, .inline-toolbar .button:last-child, .linked .button:last-child, .inline-toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child > .button.flat,
.osd .button:last-child, .osd .button.suggested-action:last-child:hover, .osd .button.suggested-action:last-child:active, .osd .button.suggested-action:last-child:checked, .osd .button.suggested-action:last-child:insensitive, .osd .button.suggested-action:last-child:backdrop, .osd .button.destructive-action:last-child:hover, .osd .button.destructive-action:last-child:active, .osd .button.destructive-action:last-child:checked, .osd .button.destructive-action:last-child:insensitive, .osd .button.destructive-action:last-child:backdrop, .inline-toolbar .button:last-child, .linked .button:last-child, .inline-toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child > .button.flat,
.inline-toolbar GtkToolButton:backdrop:last-child > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:last-child > .button.flat, GtkComboBox.combobox-entry .entry:last-child, GtkComboBox.combobox-entry .button:last-child, .linked > GtkComboBox:last-child > .button {
border-radius: 0 3px 3px 0; }
@ -669,7 +786,7 @@ GtkAssistant .sidebar GtkLabel.highlight {
.inline-toolbar GtkToolButton:backdrop:last-child:dir(rtl) > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:last-child:dir(rtl) > .button.flat, GtkComboBox.combobox-entry .entry:last-child:dir(rtl), GtkComboBox.combobox-entry .button:last-child:dir(rtl), .linked > GtkComboBox:last-child > .button:dir(rtl) {
border-right-style: solid; }
.osd .button:only-child, .inline-toolbar .button:only-child, .linked .button:only-child, .inline-toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:only-child > .button.flat,
.osd .button:only-child, .osd .button.suggested-action:only-child:hover, .osd .button.suggested-action:only-child:active, .osd .button.suggested-action:only-child:checked, .osd .button.suggested-action:only-child:insensitive, .osd .button.suggested-action:only-child:backdrop, .osd .button.destructive-action:only-child:hover, .osd .button.destructive-action:only-child:active, .osd .button.destructive-action:only-child:checked, .osd .button.destructive-action:only-child:insensitive, .osd .button.destructive-action:only-child:backdrop, .inline-toolbar .button:only-child, .linked .button:only-child, .inline-toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:only-child > .button.flat,
.inline-toolbar GtkToolButton:backdrop:only-child > .button.flat,
.inline-toolbar.search-bar GtkToolButton:backdrop:only-child > .button.flat, GtkComboBox.combobox-entry .entry:only-child, GtkComboBox.combobox-entry .button:only-child, .linked > GtkComboBox:only-child > .button {
border-radius: 3px;
@ -911,10 +1028,12 @@ GtkComboBox {
-GtkWidget-window-dragging: true;
padding: 4px;
background-color: #ededed; }
.osd .toolbar, .osd .inline-toolbar, .osd .search-bar {
background-color: rgba(0, 0, 0, 0.6);
.osd .toolbar, .osd .inline-toolbar, .osd .search-bar, .toolbar.osd, .osd.inline-toolbar, .osd.search-bar {
padding: 13px;
border: rgba(255, 255, 255, 0.1);
border-radius: 6px;
padding: 12px; }
background-color: rgba(46, 52, 54, 0.7);
background-clip: padding-box; }
.inline-toolbar {
border-width: 0 1px 1px;
@ -1314,30 +1433,41 @@ GtkTreeView.view.progressbar {
transition: none; }
.popover.osd {
background-image: none;
background-color: rgba(0, 0, 0, 0.6);
background-color: #2e3436;
border: 1px solid #a1a1a1;
color: white; }
color: #eeeeec; }
.popover.osd .button {
color: white;
text-shadow: none;
border-style: solid;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black; }
.popover.osd .button:hover {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7)); }
.popover.osd .button:active {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(51, 51, 51, 0.6));
border-color: rgba(102, 102, 102, 0.8);
box-shadow: none; }
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #4a90d9);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.popover.osd .button:insensitive {
border-style: solid;
border-color: rgba(102, 102, 102, 0.8);
color: #8d9091; }
color: #8d9091;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(65, 70, 72, 0.7));
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.entry.cursor-handle,
.cursor-handle {
@ -2083,19 +2213,41 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
.osd .scale.slider, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider {
background-image: none;
background-color: #666666;
border-width: 1px;
box-shadow: none;
border-color: rgba(102, 102, 102, 0.8); }
border-style: solid;
background-color: transparent;
background-clip: padding-box;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
border-color: rgba(0, 0, 0, 0.7);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
background-color: #2e3436; }
.osd .scale.slider:hover, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider:hover, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:hover {
border-color: rgba(128, 128, 128, 0.8); }
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(93, 105, 109, 0.7)); }
.osd .scale.slider:active, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider:active, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:active {
border-color: rgba(179, 179, 179, 0.8); }
border-style: solid;
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, #4a90d9);
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .scale.slider:backdrop, .osd
.scale.scale-has-marks-above.scale-has-marks-below.slider:backdrop, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:backdrop {
border-style: solid;
background-image: linear-gradient(to bottom, rgba(46, 52, 54, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.scale.trough,
.scale.scale-has-marks-above.scale-has-marks-below.trough,
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough {
@ -2136,19 +2288,44 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
border-color: #a8a8a8;
background-color: #c7c7c7;
box-shadow: none; }
.scale.trough:backdrop:insensitive, .scale.trough .hilight:backdrop:insensitive,
.scale.trough:backdrop:insensitive, .scale.trough .highlight:backdrop:insensitive,
.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive,
.scale.scale-has-marks-above.scale-has-marks-below.trough .hilight:backdrop:insensitive,
.scale.scale-has-marks-above.scale-has-marks-below.trough .highlight:backdrop:insensitive,
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive,
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .hilight:backdrop:insensitive {
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .highlight:backdrop:insensitive {
border-color: #a8a8a8;
background-color: #f4f4f4; }
.osd .scale.trough, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough {
background-image: none;
border-width: 0;
box-shadow: none; }
border-color: rgba(0, 0, 0, 0.7);
box-shadow: none;
margin: 9px;
background-color: rgba(0, 0, 0, 0.5);
outline-color: rgba(238, 238, 236, 0.2);
outline-offset: -8px; }
.osd .scale.trough.fine-tune, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough.fine-tune, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.fine-tune {
margin: 7px; }
.osd .scale.trough.highlight, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight {
background-image: none;
background-color: #4a90d9; }
.osd .scale.trough:insensitive, .osd .scale.trough:backdrop:insensitive, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough:insensitive, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:insensitive, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive {
border-color: transparent;
background-color: transparent; }
.osd .scale.trough:backdrop, .osd
.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop, .osd
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop {
border-color: rgba(0, 0, 0, 0.7);
background-color: none;
background-image: none; }
.scale.scale-has-marks-below {
-GtkScale-slider-length: 20;
@ -2505,7 +2682,7 @@ GtkLevelBar.vertical {
.level-bar.fill-block.empty-fill-block:backdrop {
border-color: rgba(84, 89, 90, 0.15); }
.view:selected, .view:selected:focus, .view:selected:hover, GtkLabel:selected, GtkLabel:selected:focus, GtkLabel:selected:hover, GtkLabel:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:selected {
.view:selected, .view:selected:focus, .view:selected:hover, GtkLabel:backdrop:selected, .entry:selected, .entry:selected:focus, .menuitem.button.flat:selected {
background-color: #4a90d9;
color: white;
outline-color: rgba(255, 255, 255, 0.3); }