tweak check, radio and modelbuttons

7 files changed, 50 insertions, 21 deletions

diff --git a/common/gtk-3.0/3.20/gtk-dark.css b/common/gtk-3.0/3.20/gtk-dark.css
index 75728f6..3104566 100644
--- a/common/gtk-3.0/3.20/gtk-dark.css
+++ b/common/gtk-3.0/3.20/gtk-dark.css
@@ -676,10 +676,10 @@ modelbutton.flat, button:link, button:visited, button:link:hover, button:link:ac
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px; }
   menuitem.button.flat:hover,
   modelbutton.flat:hover {
@@ -1901,8 +1901,12 @@ infobar radio:checked:disabled {
   background-color: transparent; }
 
 checkbutton.text-button, radiobutton.text-button {
-  padding: 1px 2px 4px;
+  padding: 2px 0;
   outline-offset: 0; }
+  checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
+    margin-left: 4px; }
+  checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
+    margin-right: 4px; }
   checkbutton.text-button:disabled, checkbutton.text-button:disabled:active, checkbutton.text-button:disabled:indeterminate, radiobutton.text-button:disabled, radiobutton.text-button:disabled:active, radiobutton.text-button:disabled:indeterminate {
     color: rgba(211, 218, 227, 0.45); }
 
diff --git a/common/gtk-3.0/3.20/gtk-darker.css b/common/gtk-3.0/3.20/gtk-darker.css
index b261d53..b8159d4 100644
--- a/common/gtk-3.0/3.20/gtk-darker.css
+++ b/common/gtk-3.0/3.20/gtk-darker.css
@@ -675,10 +675,10 @@ modelbutton.flat, button:link, button:visited, button:link:hover, button:link:ac
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px; }
   menuitem.button.flat:hover,
   modelbutton.flat:hover {
@@ -1900,8 +1900,12 @@ infobar radio:checked:disabled {
   background-color: transparent; }
 
 checkbutton.text-button, radiobutton.text-button {
-  padding: 1px 2px 4px;
+  padding: 2px 0;
   outline-offset: 0; }
+  checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
+    margin-left: 4px; }
+  checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
+    margin-right: 4px; }
   checkbutton.text-button:disabled, checkbutton.text-button:disabled:active, checkbutton.text-button:disabled:indeterminate, radiobutton.text-button:disabled, radiobutton.text-button:disabled:active, radiobutton.text-button:disabled:indeterminate {
     color: rgba(92, 97, 108, 0.55); }
 
diff --git a/common/gtk-3.0/3.20/gtk-solid-dark.css b/common/gtk-3.0/3.20/gtk-solid-dark.css
index f0a17a2..2068d8a 100644
--- a/common/gtk-3.0/3.20/gtk-solid-dark.css
+++ b/common/gtk-3.0/3.20/gtk-solid-dark.css
@@ -676,10 +676,10 @@ modelbutton.flat, button:link, button:visited, button:link:hover, button:link:ac
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px; }
   menuitem.button.flat:hover,
   modelbutton.flat:hover {
@@ -1901,8 +1901,12 @@ infobar radio:checked:disabled {
   background-color: transparent; }
 
 checkbutton.text-button, radiobutton.text-button {
-  padding: 1px 2px 4px;
+  padding: 2px 0;
   outline-offset: 0; }
+  checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
+    margin-left: 4px; }
+  checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
+    margin-right: 4px; }
   checkbutton.text-button:disabled, checkbutton.text-button:disabled:active, checkbutton.text-button:disabled:indeterminate, radiobutton.text-button:disabled, radiobutton.text-button:disabled:active, radiobutton.text-button:disabled:indeterminate {
     color: rgba(211, 218, 227, 0.45); }
 
diff --git a/common/gtk-3.0/3.20/gtk-solid-darker.css b/common/gtk-3.0/3.20/gtk-solid-darker.css
index 27f82ba..b6c60df 100644
--- a/common/gtk-3.0/3.20/gtk-solid-darker.css
+++ b/common/gtk-3.0/3.20/gtk-solid-darker.css
@@ -675,10 +675,10 @@ modelbutton.flat, button:link, button:visited, button:link:hover, button:link:ac
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px; }
   menuitem.button.flat:hover,
   modelbutton.flat:hover {
@@ -1900,8 +1900,12 @@ infobar radio:checked:disabled {
   background-color: transparent; }
 
 checkbutton.text-button, radiobutton.text-button {
-  padding: 1px 2px 4px;
+  padding: 2px 0;
   outline-offset: 0; }
+  checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
+    margin-left: 4px; }
+  checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
+    margin-right: 4px; }
   checkbutton.text-button:disabled, checkbutton.text-button:disabled:active, checkbutton.text-button:disabled:indeterminate, radiobutton.text-button:disabled, radiobutton.text-button:disabled:active, radiobutton.text-button:disabled:indeterminate {
     color: rgba(92, 97, 108, 0.55); }
 
diff --git a/common/gtk-3.0/3.20/gtk-solid.css b/common/gtk-3.0/3.20/gtk-solid.css
index 759f996..0e66725 100644
--- a/common/gtk-3.0/3.20/gtk-solid.css
+++ b/common/gtk-3.0/3.20/gtk-solid.css
@@ -675,10 +675,10 @@ modelbutton.flat, button:link, button:visited, button:link:hover, button:link:ac
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px; }
   menuitem.button.flat:hover,
   modelbutton.flat:hover {
@@ -1904,8 +1904,12 @@ infobar radio:checked:disabled {
   background-color: transparent; }
 
 checkbutton.text-button, radiobutton.text-button {
-  padding: 1px 2px 4px;
+  padding: 2px 0;
   outline-offset: 0; }
+  checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
+    margin-left: 4px; }
+  checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
+    margin-right: 4px; }
   checkbutton.text-button:disabled, checkbutton.text-button:disabled:active, checkbutton.text-button:disabled:indeterminate, radiobutton.text-button:disabled, radiobutton.text-button:disabled:active, radiobutton.text-button:disabled:indeterminate {
     color: rgba(92, 97, 108, 0.55); }
 
diff --git a/common/gtk-3.0/3.20/gtk.css b/common/gtk-3.0/3.20/gtk.css
index 53c6258..223ff4d 100644
--- a/common/gtk-3.0/3.20/gtk.css
+++ b/common/gtk-3.0/3.20/gtk.css
@@ -675,10 +675,10 @@ modelbutton.flat, button:link, button:visited, button:link:hover, button:link:ac
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px; }
   menuitem.button.flat:hover,
   modelbutton.flat:hover {
@@ -1904,8 +1904,12 @@ infobar radio:checked:disabled {
   background-color: transparent; }
 
 checkbutton.text-button, radiobutton.text-button {
-  padding: 1px 2px 4px;
+  padding: 2px 0;
   outline-offset: 0; }
+  checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
+    margin-left: 4px; }
+  checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
+    margin-right: 4px; }
   checkbutton.text-button:disabled, checkbutton.text-button:disabled:active, checkbutton.text-button:disabled:indeterminate, radiobutton.text-button:disabled, radiobutton.text-button:disabled:active, radiobutton.text-button:disabled:indeterminate {
     color: rgba(92, 97, 108, 0.55); }
 
diff --git a/common/gtk-3.0/3.20/sass/_common.scss b/common/gtk-3.0/3.20/sass/_common.scss
index 83782c7..54e7bbb 100644
--- a/common/gtk-3.0/3.20/sass/_common.scss
+++ b/common/gtk-3.0/3.20/sass/_common.scss
@@ -662,10 +662,10 @@ toolbar.inline-toolbar toolbutton {
 menuitem.button.flat,
 modelbutton.flat {
   transition: none;
-  min-height: 22px;
+  min-height: 24px;
   padding-left: 8px;
   padding-right: 8px;
-  outline-offset: -2px;
+  outline-offset: -3px;
   border-radius: 2px;
 
   @extend %undecorated_button;
@@ -1947,9 +1947,14 @@ switch {
 checkbutton, radiobutton {
     // this is for a nice focus on check and radios text
     &.text-button {
-    padding: 1px 2px 4px;
+    padding: 2px 0;
     outline-offset: 0;
 
+  label:not(:only-child) {
+    &:first-child { margin-left: 4px; }
+    &:last-child { margin-right: 4px; }
+  }
+
     &:disabled,
     &:disabled:active,
     &:disabled:indeterminate {