Adwaita: GtkScale

slider :hover state added
This commit is contained in:
Lapo Calamandrei 2014-06-14 10:19:15 +02:00
parent 3d70add7f6
commit 54e4c11ed1
3 changed files with 35 additions and 3 deletions

View File

@ -1214,13 +1214,22 @@ GtkCheckButton.text-button:selected { background-color: transparent; }
margin: 10px;
&.slider {
//FIXME: better gradient on the slider and hover state
@include button(normal);
@include button(normal, $noedge: true);
border-radius: 50%;
border-color: darken($borders_color,3%);
box-shadow: inset 0 1px if($variant=='light', white,
transparentize(white,0.85)),
inset 0 #{-2px} $bg_color,
inset 0 #{-1px} mix($bg_color,$borders_color,50%);
&:hover {
@include button(hover, $noedge: true);
border-color: darken($borders_color,3%);
box-shadow: inset 0 1px if($variant=='light', white,
transparentize(white,0.85)),
inset 0 #{-2px} if($variant=='light', white,
transparentize(white,0.86)),
inset 0 #{-1px} mix($bg_color,$borders_color,70%);
}
&:insensitive {
background-image: linear-gradient(to bottom, $insensitive_bg_color);
box-shadow: none;
@ -1235,6 +1244,7 @@ GtkCheckButton.text-button:selected { background-color: transparent; }
&:active { border: 1px solid darken($selected_borders_color, 3%); }
&.fine-tune:active { //FIXME: Lapo doesn't like the shrinkage. Bad for touch
border: 4px solid transparent; //margin
//FIXME: there's a square background under the slider
box-shadow: inset 0 2px $borders_edge,
inset 0 0 0 1px darken($selected_borders_color,3%); //border
}

View File

@ -1552,10 +1552,21 @@ GtkCheckButton.text-button:selected {
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);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
border-radius: 50%;
border-color: #151717;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px #393f3f, inset 0 -1px #2a2f2f; }
.scale.slider: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);
border-color: #151717;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(255, 255, 255, 0.14), inset 0 -1px #303535; }
.scale.slider:insensitive {
background-image: linear-gradient(to bottom, #363a3a);
box-shadow: none; }

View File

@ -1552,10 +1552,21 @@ GtkCheckButton.text-button:selected {
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;
box-shadow: inset 0 1px white;
border-radius: 50%;
border-color: #999999;
box-shadow: inset 0 1px white, inset 0 -2px #ededed, inset 0 -1px #c7c7c7; }
.scale.slider: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;
border-color: #999999;
box-shadow: inset 0 1px white, inset 0 -2px white, inset 0 -1px #d6d6d6; }
.scale.slider:insensitive {
background-image: linear-gradient(to bottom, #f4f4f4);
box-shadow: none; }