Commit 8351a6e4 authored by Lapo Calamandrei's avatar Lapo Calamandrei

Adwaita: .osd check|radio style

parent f81635ed
...@@ -44,7 +44,7 @@ $base_hover_color: transparentize($fg_color, 0.95); ...@@ -44,7 +44,7 @@ $base_hover_color: transparentize($fg_color, 0.95);
$tooltip_borders_color: transparentize(white, 0.9); $tooltip_borders_color: transparentize(white, 0.9);
$shadow_color: transparentize(black, 0.9); $shadow_color: transparentize(black, 0.9);
$drop_target_color: black; // FIXME: we need something different than black here... $drop_target_color: $success_color;
//insensitive state derived colors //insensitive state derived colors
$insensitive_fg_color: mix($fg_color, $bg_color, 50%); $insensitive_fg_color: mix($fg_color, $bg_color, 50%);
......
...@@ -2369,6 +2369,7 @@ radio { ...@@ -2369,6 +2369,7 @@ radio {
min-width: 14px; min-width: 14px;
border: 1px solid; border: 1px solid;
-gtk-icon-source: none; -gtk-icon-source: none;
@include button(normal-alt, $edge: $shadow_color); @include button(normal-alt, $edge: $shadow_color);
&:hover { @include button(hover-alt, $edge: $shadow_color); } &:hover { @include button(hover-alt, $edge: $shadow_color); }
...@@ -2386,6 +2387,15 @@ radio { ...@@ -2386,6 +2387,15 @@ radio {
row:selected & { border-color: $selected_borders_color; } row:selected & { border-color: $selected_borders_color; }
} }
.osd & {
@include button(osd);
&:hover { @include button(osd); }
&:active { @include button(osd-active); }
&:backdrop { @include button(osd-backdrop); }
&:disabled { @include button(osd-insensitive); }
}
menu menuitem & { menu menuitem & {
margin: 0; // this is a workaround for a menu check/radio size allocation issue margin: 0; // this is a workaround for a menu check/radio size allocation issue
......
...@@ -236,7 +236,7 @@ entry, spinbutton:not(.vertical) { ...@@ -236,7 +236,7 @@ entry, spinbutton:not(.vertical) {
.linked:not(.vertical) > entry:focus + entry, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + entry, .linked:not(.vertical) > entry:focus + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus + button, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + button, .linked:not(.vertical) > entry:focus + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + combobox > box > button.combo { .linked:not(.vertical) > entry:focus + entry, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + entry, .linked:not(.vertical) > entry:focus + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus + button, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + button, .linked:not(.vertical) > entry:focus + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + combobox > box > button.combo {
border-left-color: #0f2b48; } border-left-color: #0f2b48; }
.linked:not(.vertical) > entry:drop(active) + entry, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + entry, .linked:not(.vertical) > entry:drop(active) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:drop(active) + button, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + button, .linked:not(.vertical) > entry:drop(active) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + combobox > box > button.combo { .linked:not(.vertical) > entry:drop(active) + entry, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + entry, .linked:not(.vertical) > entry:drop(active) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:drop(active) + button, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + button, .linked:not(.vertical) > entry:drop(active) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + combobox > box > button.combo {
border-left-color: black; } border-left-color: #5aa411; }
entry.error, spinbutton.error:not(.vertical) { entry.error, spinbutton.error:not(.vertical) {
color: #cc0000; color: #cc0000;
border-color: #1a0000; } border-color: #1a0000; }
...@@ -306,8 +306,8 @@ entry, spinbutton:not(.vertical) { ...@@ -306,8 +306,8 @@ entry, spinbutton:not(.vertical) {
text-shadow: none; text-shadow: none;
-gtk-icon-shadow: none; } -gtk-icon-shadow: none; }
entry:drop(active):focus, spinbutton:drop(active):focus:not(.vertical), entry:drop(active), spinbutton:drop(active):not(.vertical) { entry:drop(active):focus, spinbutton:drop(active):focus:not(.vertical), entry:drop(active), spinbutton:drop(active):not(.vertical) {
border-color: black; border-color: #5aa411;
box-shadow: inset 0 0 0 1px black; } box-shadow: inset 0 0 0 1px #5aa411; }
.linked.vertical > entry:not(:disabled) + entry:not(:disabled), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + entry:not(:disabled), .linked.vertical > entry:not(:disabled) + spinbutton:not(:disabled):not(.vertical), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + spinbutton:not(:disabled):not(.vertical) { .linked.vertical > entry:not(:disabled) + entry:not(:disabled), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + entry:not(:disabled), .linked.vertical > entry:not(:disabled) + spinbutton:not(:disabled):not(.vertical), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + spinbutton:not(:disabled):not(.vertical) {
border-top-color: #252626; border-top-color: #252626;
...@@ -320,7 +320,7 @@ entry, spinbutton:not(.vertical) { ...@@ -320,7 +320,7 @@ entry, spinbutton:not(.vertical) {
.linked.vertical > entry + entry:focus:not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:only-child), .linked.vertical > entry + spinbutton:focus:not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:only-child):not(.vertical) { .linked.vertical > entry + entry:focus:not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:only-child), .linked.vertical > entry + spinbutton:focus:not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:only-child):not(.vertical) {
border-top-color: #0f2b48; } border-top-color: #0f2b48; }
.linked.vertical > entry + entry:drop(active):not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:only-child), .linked.vertical > entry + spinbutton:drop(active):not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:only-child):not(.vertical) { .linked.vertical > entry + entry:drop(active):not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:only-child), .linked.vertical > entry + spinbutton:drop(active):not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:only-child):not(.vertical) {
border-top-color: black; } border-top-color: #5aa411; }
.linked.vertical > entry:focus:not(:only-child) + entry, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + entry, .linked.vertical > entry:focus:not(:only-child) + spinbutton:not(.vertical), .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + spinbutton:not(.vertical), .linked.vertical > entry:focus:not(:only-child) + entry, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + entry, .linked.vertical > entry:focus:not(:only-child) + spinbutton:not(.vertical), .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + spinbutton:not(.vertical),
.linked.vertical > entry:focus:not(:only-child) + button, .linked.vertical > entry:focus:not(:only-child) + button,
.linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + button, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + button,
...@@ -332,7 +332,7 @@ entry, spinbutton:not(.vertical) { ...@@ -332,7 +332,7 @@ entry, spinbutton:not(.vertical) {
.linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + button, .linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + button,
.linked.vertical > entry:drop(active):not(:only-child) + combobox > box > button.combo, .linked.vertical > entry:drop(active):not(:only-child) + combobox > box > button.combo,
.linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + combobox > box > button.combo { .linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + combobox > box > button.combo {
border-top-color: black; } border-top-color: #5aa411; }
/*********** /***********
* Buttons * * Buttons *
...@@ -501,8 +501,8 @@ notebook > header > tabs > arrow, headerbar button.titlebutton, ...@@ -501,8 +501,8 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
.titlebar button.titlebutton:drop(active), .titlebar button.titlebutton:drop(active),
.titlebar combobox:drop(active) button.titlebutton.combo, .titlebar combobox:drop(active) button.titlebutton.combo,
combobox:drop(active) .titlebar button.titlebutton.combo, button:drop(active), combobox:drop(active) button.combo { combobox:drop(active) .titlebar button.titlebutton.combo, button:drop(active), combobox:drop(active) button.combo {
border-color: black; border-color: #5aa411;
box-shadow: inset 0 0 0 1px black; } box-shadow: inset 0 0 0 1px #5aa411; }
button.osd { button.osd {
color: #eeeeec; color: #eeeeec;
border-radius: 5px; border-radius: 5px;
...@@ -2560,6 +2560,54 @@ radio { ...@@ -2560,6 +2560,54 @@ radio {
text-shadow: none; text-shadow: none;
-gtk-icon-shadow: none; -gtk-icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0); } box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
.osd check, .osd
radio {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd check:hover, .osd
radio:hover {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd check:active, .osd
radio: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;
-gtk-icon-shadow: none;
outline-color: rgba(238, 238, 236, 0.3); }
.osd check:backdrop, .osd
radio:backdrop {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
-gtk-icon-shadow: none; }
.osd check:disabled, .osd
radio:disabled {
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;
-gtk-icon-shadow: none; }
menu menuitem check, menu menuitem menu menuitem check, menu menuitem
radio { radio {
margin: 0; } margin: 0; }
......
...@@ -236,7 +236,7 @@ entry, spinbutton:not(.vertical) { ...@@ -236,7 +236,7 @@ entry, spinbutton:not(.vertical) {
.linked:not(.vertical) > entry:focus + entry, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + entry, .linked:not(.vertical) > entry:focus + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus + button, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + button, .linked:not(.vertical) > entry:focus + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + combobox > box > button.combo { .linked:not(.vertical) > entry:focus + entry, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + entry, .linked:not(.vertical) > entry:focus + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:focus:not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:focus + button, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + button, .linked:not(.vertical) > entry:focus + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:focus:not(.vertical) + combobox > box > button.combo {
border-left-color: #4a90d9; } border-left-color: #4a90d9; }
.linked:not(.vertical) > entry:drop(active) + entry, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + entry, .linked:not(.vertical) > entry:drop(active) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:drop(active) + button, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + button, .linked:not(.vertical) > entry:drop(active) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + combobox > box > button.combo { .linked:not(.vertical) > entry:drop(active) + entry, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + entry, .linked:not(.vertical) > entry:drop(active) + spinbutton:not(.vertical), .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + spinbutton:not(.vertical), .linked:not(.vertical) > entry:drop(active) + button, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + button, .linked:not(.vertical) > entry:drop(active) + combobox > box > button.combo, .linked:not(.vertical) > spinbutton:drop(active):not(.vertical) + combobox > box > button.combo {
border-left-color: black; } border-left-color: #73d216; }
entry.error, spinbutton.error:not(.vertical) { entry.error, spinbutton.error:not(.vertical) {
color: #cc0000; color: #cc0000;
border-color: #cc0000; } border-color: #cc0000; }
...@@ -306,8 +306,8 @@ entry, spinbutton:not(.vertical) { ...@@ -306,8 +306,8 @@ entry, spinbutton:not(.vertical) {
text-shadow: none; text-shadow: none;
-gtk-icon-shadow: none; } -gtk-icon-shadow: none; }
entry:drop(active):focus, spinbutton:drop(active):focus:not(.vertical), entry:drop(active), spinbutton:drop(active):not(.vertical) { entry:drop(active):focus, spinbutton:drop(active):focus:not(.vertical), entry:drop(active), spinbutton:drop(active):not(.vertical) {
border-color: black; border-color: #73d216;
box-shadow: inset 0 0 0 1px black; } box-shadow: inset 0 0 0 1px #73d216; }
.linked.vertical > entry:not(:disabled) + entry:not(:disabled), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + entry:not(:disabled), .linked.vertical > entry:not(:disabled) + spinbutton:not(:disabled):not(.vertical), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + spinbutton:not(:disabled):not(.vertical) { .linked.vertical > entry:not(:disabled) + entry:not(:disabled), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + entry:not(:disabled), .linked.vertical > entry:not(:disabled) + spinbutton:not(:disabled):not(.vertical), .linked.vertical > spinbutton:not(:disabled):not(.vertical) + spinbutton:not(:disabled):not(.vertical) {
border-top-color: #e2e2e0; border-top-color: #e2e2e0;
...@@ -320,7 +320,7 @@ entry, spinbutton:not(.vertical) { ...@@ -320,7 +320,7 @@ entry, spinbutton:not(.vertical) {
.linked.vertical > entry + entry:focus:not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:only-child), .linked.vertical > entry + spinbutton:focus:not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:only-child):not(.vertical) { .linked.vertical > entry + entry:focus:not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:focus:not(:only-child), .linked.vertical > entry + spinbutton:focus:not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:focus:not(:only-child):not(.vertical) {
border-top-color: #4a90d9; } border-top-color: #4a90d9; }
.linked.vertical > entry + entry:drop(active):not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:only-child), .linked.vertical > entry + spinbutton:drop(active):not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:only-child):not(.vertical) { .linked.vertical > entry + entry:drop(active):not(:only-child), .linked.vertical > spinbutton:not(.vertical) + entry:drop(active):not(:only-child), .linked.vertical > entry + spinbutton:drop(active):not(:only-child):not(.vertical), .linked.vertical > spinbutton:not(.vertical) + spinbutton:drop(active):not(:only-child):not(.vertical) {
border-top-color: black; } border-top-color: #73d216; }
.linked.vertical > entry:focus:not(:only-child) + entry, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + entry, .linked.vertical > entry:focus:not(:only-child) + spinbutton:not(.vertical), .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + spinbutton:not(.vertical), .linked.vertical > entry:focus:not(:only-child) + entry, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + entry, .linked.vertical > entry:focus:not(:only-child) + spinbutton:not(.vertical), .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + spinbutton:not(.vertical),
.linked.vertical > entry:focus:not(:only-child) + button, .linked.vertical > entry:focus:not(:only-child) + button,
.linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + button, .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + button,
...@@ -332,7 +332,7 @@ entry, spinbutton:not(.vertical) { ...@@ -332,7 +332,7 @@ entry, spinbutton:not(.vertical) {
.linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + button, .linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + button,
.linked.vertical > entry:drop(active):not(:only-child) + combobox > box > button.combo, .linked.vertical > entry:drop(active):not(:only-child) + combobox > box > button.combo,
.linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + combobox > box > button.combo { .linked.vertical > spinbutton:drop(active):not(:only-child):not(.vertical) + combobox > box > button.combo {
border-top-color: black; } border-top-color: #73d216; }
/*********** /***********
* Buttons * * Buttons *
...@@ -501,8 +501,8 @@ notebook > header > tabs > arrow, headerbar button.titlebutton, ...@@ -501,8 +501,8 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
.titlebar button.titlebutton:drop(active), .titlebar button.titlebutton:drop(active),
.titlebar combobox:drop(active) button.titlebutton.combo, .titlebar combobox:drop(active) button.titlebutton.combo,
combobox:drop(active) .titlebar button.titlebutton.combo, button:drop(active), combobox:drop(active) button.combo { combobox:drop(active) .titlebar button.titlebutton.combo, button:drop(active), combobox:drop(active) button.combo {
border-color: black; border-color: #73d216;
box-shadow: inset 0 0 0 1px black; } box-shadow: inset 0 0 0 1px #73d216; }
button.osd { button.osd {
color: #eeeeec; color: #eeeeec;
border-radius: 5px; border-radius: 5px;
...@@ -2585,6 +2585,54 @@ radio { ...@@ -2585,6 +2585,54 @@ radio {
row:selected check, row:selected row:selected check, row:selected
radio { radio {
border-color: #184472; } border-color: #184472; }
.osd check, .osd
radio {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd check:hover, .osd
radio:hover {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(238, 238, 236, 0.3); }
.osd check:active, .osd
radio: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;
-gtk-icon-shadow: none;
outline-color: rgba(238, 238, 236, 0.3); }
.osd check:backdrop, .osd
radio:backdrop {
color: #eeeeec;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
-gtk-icon-shadow: none; }
.osd check:disabled, .osd
radio:disabled {
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;
-gtk-icon-shadow: none; }
menu menuitem check, menu menuitem menu menuitem check, menu menuitem
radio { radio {
margin: 0; } margin: 0; }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment