Adwaita: osd spinbutton fixes

This commit is contained in:
Lapo Calamandrei 2015-10-10 17:42:40 +02:00
parent b2d379a340
commit 74e02842bb
3 changed files with 137 additions and 15 deletions

View File

@ -825,7 +825,9 @@ GtkColorButton.button {
}
}
}
.osd & {
// OSD horizontal
.osd &:not(.vertical) {
.button {
@include button(undecorated);
color: $osd_fg_color;
@ -861,6 +863,8 @@ GtkColorButton.button {
&:dir(rtl):first-child { border-radius: 3px 0 0 3px; }
}
}
// Vertical
&.vertical {
.button {
padding-top: 8px; // Same vertical padding as image-buttons
@ -883,6 +887,7 @@ GtkColorButton.button {
&:backdrop {
@extend %top_button;
@include button(backdrop, $edge:none);
&:insensitive { @include button(backdrop-insensitive, $edge:none); }
}
}
&:last-child { @extend %bottom_button; }
@ -903,6 +908,17 @@ GtkColorButton.button {
border-style: none solid solid solid;
}
}
// OSD vertical
.osd &.vertical .button:first-child {
@include button(osd);
&:hover { @include button(osd-hover);}
&:active { @include button(osd-active); }
&:insensitive { @include button(osd-insensitive); }
&:backdrop { @include button(osd-backdrop); }
}
// Misc
GtkTreeView & {
&.entry, &.entry:focus {
padding: 1px;

View File

@ -1269,7 +1269,7 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-style: none none none solid; }
.spinbutton:not(.vertical) .button:backdrop:insensitive:dir(rtl) {
border-style: none solid none none; }
.osd .spinbutton .button {
.osd .spinbutton:not(.vertical) .button {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1282,9 +1282,9 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-radius: 0;
box-shadow: none;
icon-shadow: 0 1px black; }
.osd .spinbutton .button:dir(rtl) {
.osd .spinbutton:not(.vertical) .button:dir(rtl) {
border-style: none solid none none; }
.osd .spinbutton .button:hover {
.osd .spinbutton:not(.vertical) .button:hover {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1296,7 +1296,7 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
background-color: rgba(238, 238, 236, 0.1);
icon-shadow: 0 1px black;
box-shadow: none; }
.osd .spinbutton .button:backdrop {
.osd .spinbutton:not(.vertical) .button:backdrop {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1307,7 +1307,7 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-color: rgba(0, 0, 0, 0.5);
icon-shadow: none;
box-shadow: none; }
.osd .spinbutton .button:insensitive {
.osd .spinbutton:not(.vertical) .button:insensitive {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1318,9 +1318,9 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-color: rgba(0, 0, 0, 0.5);
icon-shadow: none;
box-shadow: none; }
.osd .spinbutton .button:last-child {
.osd .spinbutton:not(.vertical) .button:last-child {
border-radius: 0 3px 3px 0; }
.osd .spinbutton .button:dir(rtl):first-child {
.osd .spinbutton:not(.vertical) .button:dir(rtl):first-child {
border-radius: 3px 0 0 3px; }
.spinbutton.vertical .button {
padding-top: 8px;
@ -1366,6 +1366,16 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
.spinbutton.vertical .button:first-child:backdrop:insensitive {
color: #5d6767;
border-color: #1f2222;
background-image: linear-gradient(to bottom, #333636);
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
.spinbutton.vertical .button:first-child:backdrop:insensitive > .label, .spinbutton.vertical .header-bar .button.titlebutton:first-child:backdrop:insensitive > .label,
.spinbutton.vertical .titlebar .button.titlebutton:first-child:backdrop:insensitive > .label {
color: inherit; }
.spinbutton.vertical.entry {
border-radius: 0;
padding-left: 3px;
@ -1376,6 +1386,49 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
.spinbutton.vertical .button:last-child {
border-radius: 0 0 3px 3px;
border-style: none solid solid solid; }
.osd .spinbutton.vertical .button:first-child {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd .spinbutton.vertical .button:first-child:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.7));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd .spinbutton.vertical .button:first-child:active {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none;
outline-color: rgba(238, 238, 236, 0.3); }
.osd .spinbutton.vertical .button:first-child:insensitive {
color: #878a89;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .spinbutton.vertical .button:first-child:backdrop {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
GtkTreeView .spinbutton.entry, GtkTreeView .spinbutton.entry:focus {
padding: 1px;
border-width: 1px 0;

View File

@ -1269,7 +1269,7 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-style: none none none solid; }
.spinbutton:not(.vertical) .button:backdrop:insensitive:dir(rtl) {
border-style: none solid none none; }
.osd .spinbutton .button {
.osd .spinbutton:not(.vertical) .button {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1282,9 +1282,9 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-radius: 0;
box-shadow: none;
icon-shadow: 0 1px black; }
.osd .spinbutton .button:dir(rtl) {
.osd .spinbutton:not(.vertical) .button:dir(rtl) {
border-style: none solid none none; }
.osd .spinbutton .button:hover {
.osd .spinbutton:not(.vertical) .button:hover {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1296,7 +1296,7 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
background-color: rgba(238, 238, 236, 0.1);
icon-shadow: 0 1px black;
box-shadow: none; }
.osd .spinbutton .button:backdrop {
.osd .spinbutton:not(.vertical) .button:backdrop {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1307,7 +1307,7 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-color: rgba(0, 0, 0, 0.5);
icon-shadow: none;
box-shadow: none; }
.osd .spinbutton .button:insensitive {
.osd .spinbutton:not(.vertical) .button:insensitive {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -1318,9 +1318,9 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
border-color: rgba(0, 0, 0, 0.5);
icon-shadow: none;
box-shadow: none; }
.osd .spinbutton .button:last-child {
.osd .spinbutton:not(.vertical) .button:last-child {
border-radius: 0 3px 3px 0; }
.osd .spinbutton .button:dir(rtl):first-child {
.osd .spinbutton:not(.vertical) .button:dir(rtl):first-child {
border-radius: 3px 0 0 3px; }
.spinbutton.vertical .button {
padding-top: 8px;
@ -1366,6 +1366,16 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
text-shadow: none;
icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
.spinbutton.vertical .button:first-child:backdrop:insensitive {
color: #c7c7c7;
border-color: darkgray;
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:insensitive > .label, .spinbutton.vertical .header-bar .button.titlebutton:first-child:backdrop:insensitive > .label,
.spinbutton.vertical .titlebar .button.titlebutton:first-child:backdrop:insensitive > .label {
color: inherit; }
.spinbutton.vertical.entry {
border-radius: 0;
padding-left: 3px;
@ -1376,6 +1386,49 @@ GtkColorButton.button, .header-bar GtkColorButton.button.titlebutton,
.spinbutton.vertical .button:last-child {
border-radius: 0 0 3px 3px;
border-style: none solid solid solid; }
.osd .spinbutton.vertical .button:first-child {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd .spinbutton.vertical .button:first-child:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.7));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd .spinbutton.vertical .button:first-child:active {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none;
outline-color: rgba(238, 238, 236, 0.3); }
.osd .spinbutton.vertical .button:first-child:insensitive {
color: #878a89;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
.osd .spinbutton.vertical .button:first-child:backdrop {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
icon-shadow: none; }
GtkTreeView .spinbutton.entry, GtkTreeView .spinbutton.entry:focus {
padding: 1px;
border-width: 1px 0;