[gtk+] Adwaita: .osd check|radio style

[Lapo Calamandrei <lapo src gnome org>]

commit 8351a6e4d61a48921582668dd54b3094cbcd75ac
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Fri Mar 11 16:34:30 2016 +0100

    Adwaita: .osd check|radio style

 gtk/theme/Adwaita/_colors.scss           |    2 +-
 gtk/theme/Adwaita/_common.scss           |   10 +++++
 gtk/theme/Adwaita/gtk-contained-dark.css |   62 ++++++++++++++++++++++++++---
 gtk/theme/Adwaita/gtk-contained.css      |   62 ++++++++++++++++++++++++++---
 4 files changed, 121 insertions(+), 15 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_colors.scss b/gtk/theme/Adwaita/_colors.scss
index 2edb2ae..6be0554 100644
--- a/gtk/theme/Adwaita/_colors.scss
+++ b/gtk/theme/Adwaita/_colors.scss
@@ -44,7 +44,7 @@ $base_hover_color: transparentize($fg_color, 0.95);
 $tooltip_borders_color: transparentize(white, 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_fg_color: mix($fg_color, $bg_color, 50%);
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 9114049..1fbe282 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2369,6 +2369,7 @@ radio {
   min-width: 14px;
   border: 1px solid;
   -gtk-icon-source: none;
+
   @include button(normal-alt, $edge: $shadow_color);
 
   &:hover { @include button(hover-alt, $edge: $shadow_color); }
@@ -2386,6 +2387,15 @@ radio {
     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 & {
     margin: 0; // this is a workaround for a menu check/radio size allocation issue
 
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index ad17291..a4a9911 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -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 {
     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 {
-    border-left-color: black; }
+    border-left-color: #5aa411; }
   entry.error, spinbutton.error:not(.vertical) {
     color: #cc0000;
     border-color: #1a0000; }
@@ -306,8 +306,8 @@ entry, spinbutton:not(.vertical) {
       text-shadow: none;
       -gtk-icon-shadow: none; }
   entry:drop(active):focus, spinbutton:drop(active):focus:not(.vertical), entry:drop(active), 
spinbutton:drop(active):not(.vertical) {
-    border-color: black;
-    box-shadow: inset 0 0 0 1px black; }
+    border-color: #5aa411;
+    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) {
   border-top-color: #252626;
@@ -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) {
   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) {
-  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) + button,
 .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + button,
@@ -332,7 +332,7 @@ entry, spinbutton:not(.vertical) {
 .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 > spinbutton:drop(active):not(:only-child):not(.vertical) + combobox > box > button.combo {
-  border-top-color: black; }
+  border-top-color: #5aa411; }
 
 /***********
  * Buttons *
@@ -501,8 +501,8 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
   .titlebar button.titlebutton:drop(active),
   .titlebar combobox:drop(active) button.titlebutton.combo,
   combobox:drop(active) .titlebar button.titlebutton.combo, button:drop(active), combobox:drop(active) 
button.combo {
-    border-color: black;
-    box-shadow: inset 0 0 0 1px black; }
+    border-color: #5aa411;
+    box-shadow: inset 0 0 0 1px #5aa411; }
 button.osd {
   color: #eeeeec;
   border-radius: 5px;
@@ -2560,6 +2560,54 @@ radio {
       text-shadow: none;
       -gtk-icon-shadow: none;
       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
   radio {
     margin: 0; }
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 9a0c800..8cce223 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -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 {
     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 {
-    border-left-color: black; }
+    border-left-color: #73d216; }
   entry.error, spinbutton.error:not(.vertical) {
     color: #cc0000;
     border-color: #cc0000; }
@@ -306,8 +306,8 @@ entry, spinbutton:not(.vertical) {
       text-shadow: none;
       -gtk-icon-shadow: none; }
   entry:drop(active):focus, spinbutton:drop(active):focus:not(.vertical), entry:drop(active), 
spinbutton:drop(active):not(.vertical) {
-    border-color: black;
-    box-shadow: inset 0 0 0 1px black; }
+    border-color: #73d216;
+    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) {
   border-top-color: #e2e2e0;
@@ -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) {
   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) {
-  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) + button,
 .linked.vertical > spinbutton:focus:not(:only-child):not(.vertical) + button,
@@ -332,7 +332,7 @@ entry, spinbutton:not(.vertical) {
 .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 > spinbutton:drop(active):not(:only-child):not(.vertical) + combobox > box > button.combo {
-  border-top-color: black; }
+  border-top-color: #73d216; }
 
 /***********
  * Buttons *
@@ -501,8 +501,8 @@ notebook > header > tabs > arrow, headerbar button.titlebutton,
   .titlebar button.titlebutton:drop(active),
   .titlebar combobox:drop(active) button.titlebutton.combo,
   combobox:drop(active) .titlebar button.titlebutton.combo, button:drop(active), combobox:drop(active) 
button.combo {
-    border-color: black;
-    box-shadow: inset 0 0 0 1px black; }
+    border-color: #73d216;
+    box-shadow: inset 0 0 0 1px #73d216; }
 button.osd {
   color: #eeeeec;
   border-radius: 5px;
@@ -2585,6 +2585,54 @@ radio {
   row:selected check, row:selected
   radio {
     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
   radio {
     margin: 0; }