AuroraMiddleware/gtk
1
0
Fork 1
mirror of https://gitlab.gnome.org/GNOME/gtk.git synced 2024-11-16 21:50:34 +00:00
Code Issues Projects Releases Wiki Activity

Adwaita: initial flat entry styling.

Browse Source
This commit is contained in:
Lapo Calamandrei 2014-06-27 14:24:53 +02:00
parent 6e7e1ebf46
commit 8b1e52cbd6
3 changed files with 285 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -153,6 +153,12 @@
border-radius: 3px;
transition: all 200ms ease-out;
@include entry(normal);
&.flat, &.flat:focus {
padding: 2px;
@include entry(normal, $noedge:true);
border: none;
border-radius: 0;
}
&:focus { @include entry(focus); }
&:insensitive { @include entry(insensitive); }
&:backdrop { @include entry(backdrop); }
@ -494,6 +500,17 @@ GtkColorButton.button { padding: 4px; } // Uniform padding on the GtkColorButton
border-top-width: 0;
}
}
/* This is to fix spinbuttons in entries, but I feel like hiding code issues
* hence it's commented atm.
* GtkTreeView & {
* &.entry, &.entry:focus {
* padding: 1px;
* border-width: 1px 0;
* border-color: $selected_bg_color;
* border-radius: 0;
* box-shadow: none;
* }
* } */
}
/**************

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

@ -139,6 +139,16 @@
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
box-shadow: inset 0 2px 2px -2px #141414, 0 1px rgba(238, 238, 236, 0.1); }
.entry.flat, .entry.flat:focus {
padding: 2px;
background-color: transparent;
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #212121, #292929 90%);
border-color: #1c1f1f;
box-shadow: inset 0 2px 2px -2px #141414;
border: none;
border-radius: 0; }
.entry:focus {
background-color: transparent;
border-style: solid;
@ -499,136 +509,148 @@ GtkColorButton.button {
/*****************
* GtkSpinButton *
*****************/
.spinbutton .button {
background-image: none;
border-width: 0 0 0 1px;
border-color: rgba(28, 31, 31, 0.3);
color: #e4e4e2;
border-radius: 0;
box-shadow: none; }
.spinbutton .button:dir(rtl) {
border-width: 0 1px 0 0; }
.spinbutton .button:hover {
color: #eeeeec;
background-color: rgba(0, 0, 0, 0.05); }
.spinbutton .button:insensitive {
color: rgba(147, 150, 149, 0.3); }
.spinbutton .button:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
background-color: rgba(0, 0, 0, 0.1); }
.spinbutton .button:backdrop {
border-color: rgba(30, 34, 34, 0.3); }
.spinbutton .button:backdrop:insensitive {
.spinbutton {
/* This is to fix spinbuttons in entries, but I feel like hiding code issues
* hence it's commented atm.
* GtkTreeView & {
* &.entry, &.entry:focus {
* padding: 1px;
* border-width: 1px 0;
* border-color: $selected_bg_color;
* border-radius: 0;
* box-shadow: none;
* }
* } */ }
.spinbutton .button {
background-image: none;
color: rgba(69, 76, 76, 0.3);
border-width: 0 0 0 1px; }
.spinbutton .button:backdrop:insensitive:dir(rtl) {
border-width: 0 0 0 1px;
border-color: rgba(28, 31, 31, 0.3);
color: #e4e4e2;
border-radius: 0;
box-shadow: none; }
.spinbutton .button:dir(rtl) {
border-width: 0 1px 0 0; }
.spinbutton.vertical .button:first-child {
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); }
.spinbutton.vertical .button:first-child:active {
.spinbutton .button:hover {
color: #eeeeec;
background-color: rgba(0, 0, 0, 0.05); }
.spinbutton .button:insensitive {
color: rgba(147, 150, 149, 0.3); }
.spinbutton .button:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
background-color: rgba(0, 0, 0, 0.1); }
.spinbutton .button:backdrop {
border-color: rgba(30, 34, 34, 0.3); }
.spinbutton .button:backdrop:insensitive {
background-image: none;
color: rgba(69, 76, 76, 0.3);
border-width: 0 0 0 1px; }
.spinbutton .button:backdrop:insensitive:dir(rtl) {
border-width: 0 1px 0 0; }
.spinbutton.vertical .button:first-child {
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, #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); }
.spinbutton.vertical .button:first-child: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);
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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:last-child {
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), 0 1px rgba(238, 238, 236, 0.1); }
.spinbutton.vertical .button:last-child:active {
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:last-child {
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, #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), 0 1px rgba(238, 238, 236, 0.1); }
.spinbutton.vertical .button:last-child: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);
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), 0 1px rgba(238, 238, 236, 0.1); }
.spinbutton.vertical .button:last-child:insensitive {
.spinbutton.vertical .button:last-child: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), 0 1px rgba(238, 238, 236, 0.1); }
.spinbutton.vertical .button:last-child: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), 0 1px rgba(238, 238, 236, 0.1); }
.spinbutton.vertical .button:last-child: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); }
.spinbutton.vertical .button:last-child: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); }
.spinbutton.vertical .button:backdrop: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); }
.spinbutton.vertical .button:last-child:backdrop {
border-width: 1px;
border-style: solid;
color: #c9cbc9;
color: #454c4c;
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); }
.spinbutton.vertical .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); }
.spinbutton.vertical.entry {
border-radius: 0; }
.spinbutton.vertical .button:first-child, .spinbutton.vertical .button:first-child:active, .spinbutton.vertical .button:first-child:hover, .spinbutton.vertical .button:first-child:insensitive, .spinbutton.vertical .button:first-child:backdrop {
border-radius: 3px 3px 0 0;
border-bottom-width: 0; }
.spinbutton.vertical .button:last-child, .spinbutton.vertical .button:last-child:active, .spinbutton.vertical .button:last-child:hover, .spinbutton.vertical .button:last-child:insensitive, .spinbutton.vertical .button:last-child:backdrop {
border-radius: 0 0 3px 3px;
border-top-width: 0; }
box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
.spinbutton.vertical.entry {
border-radius: 0; }
.spinbutton.vertical .button:first-child, .spinbutton.vertical .button:first-child:active, .spinbutton.vertical .button:first-child:hover, .spinbutton.vertical .button:first-child:insensitive, .spinbutton.vertical .button:first-child:backdrop {
border-radius: 3px 3px 0 0;
border-bottom-width: 0; }
.spinbutton.vertical .button:last-child, .spinbutton.vertical .button:last-child:active, .spinbutton.vertical .button:last-child:hover, .spinbutton.vertical .button:last-child:insensitive, .spinbutton.vertical .button:last-child:backdrop {
border-radius: 0 0 3px 3px;
border-top-width: 0; }
/**************
* ComboBoxes *

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

@ -139,6 +139,16 @@
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
border-color: #a1a1a1;
box-shadow: inset 0 2px 2px -2px #7f7f7f, 0 1px white; }
.entry.flat, .entry.flat:focus {
padding: 2px;
background-color: transparent;
border-style: solid;
border-width: 1px;
background-image: linear-gradient(to bottom, #f7f7f7, white 90%);
border-color: #a1a1a1;
box-shadow: inset 0 2px 2px -2px #7f7f7f;
border: none;
border-radius: 0; }
.entry:focus {
background-color: transparent;
border-style: solid;
@ -499,136 +509,148 @@ GtkColorButton.button {
/*****************
* GtkSpinButton *
*****************/
.spinbutton .button {
background-image: none;
border-width: 0 0 0 1px;
border-color: rgba(161, 161, 161, 0.3);
color: #383e40;
border-radius: 0;
box-shadow: none; }
.spinbutton .button:dir(rtl) {
border-width: 0 1px 0 0; }
.spinbutton .button:hover {
color: #2e3436;
background-color: rgba(0, 0, 0, 0.05); }
.spinbutton .button:insensitive {
color: rgba(141, 144, 145, 0.3); }
.spinbutton .button:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
background-color: rgba(0, 0, 0, 0.1); }
.spinbutton .button:backdrop {
border-color: rgba(168, 168, 168, 0.3); }
.spinbutton .button:backdrop:insensitive {
.spinbutton {
/* This is to fix spinbuttons in entries, but I feel like hiding code issues
* hence it's commented atm.
* GtkTreeView & {
* &.entry, &.entry:focus {
* padding: 1px;
* border-width: 1px 0;
* border-color: $selected_bg_color;
* border-radius: 0;
* box-shadow: none;
* }
* } */ }
.spinbutton .button {
background-image: none;
color: rgba(199, 199, 199, 0.3);
border-width: 0 0 0 1px; }
.spinbutton .button:backdrop:insensitive:dir(rtl) {
border-width: 0 0 0 1px;
border-color: rgba(161, 161, 161, 0.3);
color: #383e40;
border-radius: 0;
box-shadow: none; }
.spinbutton .button:dir(rtl) {
border-width: 0 1px 0 0; }
.spinbutton.vertical .button:first-child {
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; }
.spinbutton.vertical .button:first-child:active {
.spinbutton .button:hover {
color: #2e3436;
background-color: rgba(0, 0, 0, 0.05); }
.spinbutton .button:insensitive {
color: rgba(141, 144, 145, 0.3); }
.spinbutton .button:active {
box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
background-color: rgba(0, 0, 0, 0.1); }
.spinbutton .button:backdrop {
border-color: rgba(168, 168, 168, 0.3); }
.spinbutton .button:backdrop:insensitive {
background-image: none;
color: rgba(199, 199, 199, 0.3);
border-width: 0 0 0 1px; }
.spinbutton .button:backdrop:insensitive:dir(rtl) {
border-width: 0 1px 0 0; }
.spinbutton.vertical .button:first-child {
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); }
.spinbutton.vertical .button:first-child: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; }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:last-child {
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, 0 1px white; }
.spinbutton.vertical .button:last-child:active {
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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; }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:first-child: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); }
.spinbutton.vertical .button:last-child {
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), 0 1px white; }
.spinbutton.vertical .button:last-child: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, 0 1px white; }
.spinbutton.vertical .button:last-child:insensitive {
.spinbutton.vertical .button:last-child: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), 0 1px white; }
.spinbutton.vertical .button:last-child: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, 0 1px white; }
.spinbutton.vertical .button:last-child: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; }
.spinbutton.vertical .button:last-child: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); }
.spinbutton.vertical .button:backdrop: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; }
.spinbutton.vertical .button:last-child:backdrop {
border-width: 1px;
border-style: solid;
color: #54595a;
color: #c7c7c7;
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); }
.spinbutton.vertical .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); }
.spinbutton.vertical.entry {
border-radius: 0; }
.spinbutton.vertical .button:first-child, .spinbutton.vertical .button:first-child:active, .spinbutton.vertical .button:first-child:hover, .spinbutton.vertical .button:first-child:insensitive, .spinbutton.vertical .button:first-child:backdrop {
border-radius: 3px 3px 0 0;
border-bottom-width: 0; }
.spinbutton.vertical .button:last-child, .spinbutton.vertical .button:last-child:active, .spinbutton.vertical .button:last-child:hover, .spinbutton.vertical .button:last-child:insensitive, .spinbutton.vertical .button:last-child:backdrop {
border-radius: 0 0 3px 3px;
border-top-width: 0; }
box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
.spinbutton.vertical.entry {
border-radius: 0; }
.spinbutton.vertical .button:first-child, .spinbutton.vertical .button:first-child:active, .spinbutton.vertical .button:first-child:hover, .spinbutton.vertical .button:first-child:insensitive, .spinbutton.vertical .button:first-child:backdrop {
border-radius: 3px 3px 0 0;
border-bottom-width: 0; }
.spinbutton.vertical .button:last-child, .spinbutton.vertical .button:last-child:active, .spinbutton.vertical .button:last-child:hover, .spinbutton.vertical .button:last-child:insensitive, .spinbutton.vertical .button:last-child:backdrop {
border-radius: 0 0 3px 3px;
border-top-width: 0; }
/**************
* ComboBoxes *