[lightsoff/wip/gtkview] Improvements to the focus CSS

[Robert Roth <robertroth src gnome org>]

commit 47f25a036dc00f3ba8af6a5264f2a70737227939
Author: Robert Roth <robert roth off gmail com>
Date:   Sun Jul 15 21:29:09 2018 +0300

    Improvements to the focus CSS

 data/lightsoff.css | 35 ++++++++++++++++++++++-------------
 1 file changed, 22 insertions(+), 13 deletions(-)
---
diff --git a/data/lightsoff.css b/data/lightsoff.css
index 0a16e20..80b9821 100644
--- a/data/lightsoff.css
+++ b/data/lightsoff.css
@@ -2,33 +2,42 @@
   border: none;
 }
 
+.grid > .toggle {
+  outline-offset: -30px;
+  outline-width: 10px;
+  outline-style: none;
+  border-width: 1px;
+  box-shadow: none;
+  -gtk-outline-top-left-radius: 50%;
+  -gtk-outline-top-right-radius: 50%;
+  -gtk-outline-bottom-left-radius: 50%;
+  -gtk-outline-bottom-right-radius: 50%;
+  transition: outline-offset 0ms ease;
+  margin: 6px;
+  transition: margin 300ms linear;
+}
+
 .grid > .toggle, .grid > .toggle:backdrop, .grid > .toggle:focus {
   background-image: linear-gradient(90deg, #050505, #222);
   /*background-color: black;*/
   border-color: #353535;
   border-radius: 5px;
-  border-width: 1px;
-  margin: 6px;
-  box-shadow: none;
-  transition-duration: 300ms;
-  transition-timing-function: linear;
+  transition: margin 300ms linear;
   /*outline: none;*/
 }
 
 .grid > .toggle:focus {
-  outline-offset: -15px;
-  outline-width: 3px;
-  outline-style: inset;
+  transition: outline-offset 0ms ease;
+  transition: margin 300ms linear;
+  outline-offset: -40px;
+  outline-style: solid;
 }
 
 .grid > .toggle:checked/*, .grid > .toggle:hover */{
-  border-width: 1px;
-  border-color: #729fcf;
   background-image: linear-gradient(90deg,  #35669b, #5e92c8);
-  box-shadow: none;
+  border-color: #729fcf;
   margin: 0;
-  transition-duration: 300ms;
-  transition-timing-function: linear;
+  transition: margin 300ms linear;
 }
 
 .aspect {