Spin button styling

pull/224/head
Satyajit Sahoo 2014-12-09 01:38:40 +05:30
parent 4680d4f189
commit fbca03b4a1
2 changed files with 82 additions and 108 deletions

View File

@ -172,5 +172,87 @@
@include button($bg_color, $fg_color); @include button($bg_color, $fg_color);
&.default { @include button($selected_bg_color, $selected_fg_color); } &.default { @include button($selected_bg_color, $selected_fg_color); }
.spinbutton & {
color: mix($text_color, $base_color, 0.4);
padding: 2px 4px;
border-width: 0;
border-radius: 0;
border-style: none;
background-color: transparent;
background-image: none;
box-shadow: inset 1px 0 shade($base_color, 0.9);
&:insensitive {
color: mix($text_color, $base_color, 0.7);
box-shadow: inset 1px 0 shade($base_color, 0.95);
}
&:active, &:checked, &:hover { color: $text_color; }
&:first-child {
border-radius: $roundness 0 0 $roundness;
box-shadow: none;
}
&:last-child { border-radius: 0 $roundness $roundness 0; }
&:dir(rtl) { box-shadow: inset -1px 0 shade($base_color, 0.9); }
}
.spinbutton.vertical & {
border: 1px solid shade($bg_color, 0.8);
border-radius: $roundness;
background-color: shade($bg_color, 1.08);
background-image: none;
color: $fg_color;
box-shadow: none;
&:hover {
border-color: shade($bg_color, 0.7);
background-color: shade($bg_color, 1.10);
background-image: none;
}
&:active, &:checked {
border-color: shade($bg_color, 0.8);
background-color: shade($bg_color, 0.95);
background-image: none;
}
&:active:hover, &:checked:hover {
border-color: shade($bg_color, 0.7);
}
&:focus, &:hover:focus, &:active:focus, &:active:hover:focus { border-color: shade($bg_color, 0.7); }
&:insensitive {
border-color: shade($bg_color, 0.85);
background-color: shade($bg_color, 0.9);
background-image: none;
}
&:first-child {
border-width: 1px;
border-bottom-width: 0;
border-radius: $roundness;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-width: 1px;
border-top-width: 0;
border-radius: $roundness;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
}
.spinbutton.vertical.entry {
border-width: 1px;
border-style: solid;
border-radius: 0;
}
} }
} }

View File

@ -18,114 +18,6 @@
@import "window"; @import "window";
/**************
* spinbutton *
**************/
.spinbutton .button {
color: mix($text_color, $base_color, 0.4);
padding: 2px 4px;
border-width: 0;
border-radius: 0;
border-style: none;
background-color: transparent;
background-image: none;
box-shadow: inset 1px 0 shade($base_color, 0.9);
}
.spinbutton .button:insensitive {
color: mix($text_color, $base_color, 0.7);
box-shadow: inset 1px 0 shade($bg_color, 0.95);
}
.spinbutton .button:active,
.spinbutton .button:hover {
color: $fg_color;
}
.spinbutton .button:first-child {
border-radius: 2px 0 0 2px;
box-shadow: none;
}
.spinbutton .button:last-child {
border-radius: 0 2px 2px 0;
}
.spinbutton .button:dir(rtl) {
box-shadow: inset -1px 0 shade($base_color, 0.9);
}
.spinbutton.vertical .button {
border-width: 1px;
border-style: solid;
border-color: shade($bg_color, 0.8);
border-radius: 2px;
background-color: shade($bg_color, 1.08);
background-image: none;
color: $fg_color;
box-shadow: none;
}
.spinbutton.vertical .button:hover {
border-color: shade($bg_color, 0.7);
background-color: shade($bg_color, 1.10);
background-image: none;
}
.spinbutton.vertical .button:active {
border-color: shade($bg_color, 0.8);
background-color: shade($bg_color, 0.95);
background-image: none;
}
.spinbutton.vertical .button:active:hover {
border-color: shade($bg_color, 0.7);
}
.spinbutton.vertical .button:focus,
.spinbutton.vertical .button:hover:focus,
.spinbutton.vertical .button:active:focus,
.spinbutton.vertical .button:active:hover:focus {
border-color: shade($bg_color, 0.7);
}
.spinbutton.vertical .button:insensitive {
border-color: shade($bg_color, 0.85);
background-color: shade($bg_color, 0.9);
background-image: none;
}
.spinbutton.vertical .button:first-child {
border-width: 1px;
border-bottom-width: 0;
border-radius: 2px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.spinbutton.vertical .button:last-child {
border-width: 1px;
border-top-width: 0;
border-radius: 2px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.spinbutton.vertical.entry {
border-width: 1px;
border-style: solid;
border-radius: 0;
}
/*************
* statusbar *
*************/
GtkStatusbar {
padding: 4px;
color: $fg_color;
}
/***************** /*****************
* color chooser * * color chooser *
*****************/ *****************/