[gtk+] High Contrast: fix titlebuttons sizing



commit 52c362721c2f55615a973411e6fc720e7ba500dc
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Thu Mar 17 12:16:48 2016 +0100

    High Contrast: fix titlebuttons sizing
    
    ... simplifying the scss in the process.

 gtk/theme/HighContrast/_common.scss              |   16 +----
 gtk/theme/HighContrast/gtk-contained-inverse.css |   66 ++++++----------------
 gtk/theme/HighContrast/gtk-contained.css         |   66 ++++++----------------
 3 files changed, 39 insertions(+), 109 deletions(-)
---
diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index 1b5d59a..6fb9458 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -3112,19 +3112,9 @@ decoration {
 
 // Window Close button
 button.titlebutton {
-  padding: 8px;
-  border-color: transparent;
-  background-image: none;
-  transition-property: border, box-shadow, color;
-  box-shadow: inset 0 1px transparentize(white,1),
-              0 1px transparentize($borders_edge,1);
-  &:hover { @include button(normal); }
-  &:active { @include button(active); }
-  &:backdrop {
-    @include button(backdrop);
-    border-color: transparent;
-    transition-property: border, box-shadow, color;
-  }
+  @extend %button_basic;
+
+  @extend %button_basic.flat;
 }
 
 /**********************
diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css 
b/gtk/theme/HighContrast/gtk-contained-inverse.css
index b00242c..9b7c973 100644
--- a/gtk/theme/HighContrast/gtk-contained-inverse.css
+++ b/gtk/theme/HighContrast/gtk-contained-inverse.css
@@ -377,7 +377,7 @@ entry:drop(active):not(:only-child) + combobox > box > button.combo {
     background-image: -gtk-gradient(radial, center center, 0, center center, 0.01, to(#aaa), 
to(transparent)); }
   to {
     background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#aaa), 
to(transparent)); } }
-button {
+button.titlebutton, button {
   min-height: 24px;
   min-width: 16px;
   padding: 4px 8px;
@@ -390,7 +390,7 @@ button {
   background-image: none;
   background-color: #000;
   border-color: gray; }
-  button.flat, button.sidebar-button {
+  button.titlebutton, button.flat, button.sidebar-button {
     border-width: 2px;
     border-style: solid;
     color: #fff;
@@ -398,12 +398,12 @@ button {
     background-image: none;
     border-color: transparent;
     transition: none; }
-    button.flat:hover, button.sidebar-button:hover {
+    button.titlebutton:hover, button.flat:hover, button.sidebar-button:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
       transition-duration: 500ms; }
-      button.flat:hover:active, button.sidebar-button:hover:active {
+      button.titlebutton:hover:active, button.flat:hover:active, button.sidebar-button:hover:active {
         transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
-  button:hover {
+  button.titlebutton:hover, button:hover {
     border-width: 2px;
     border-style: solid;
     color: #fff;
@@ -411,7 +411,7 @@ button {
     border-color: gray;
     background-image: none;
     -gtk-icon-effect: highlight; }
-  button:active, button:checked {
+  button.titlebutton:active, button.titlebutton:checked, button:active, button:checked {
     border-width: 2px;
     border-style: solid;
     background-image: none;
@@ -419,7 +419,7 @@ button {
     background-color: white;
     border-color: gray;
     transition-duration: 50ms; }
-  button:backdrop.flat, button.sidebar-button:backdrop, button:backdrop {
+  button.titlebutton:backdrop, button.titlebutton:backdrop, button:backdrop.flat, 
button.sidebar-button:backdrop, button:backdrop {
     border-width: 2px;
     border-style: solid;
     color: #fff;
@@ -427,62 +427,62 @@ button {
     border-color: #737373;
     background-image: none;
     -gtk-icon-effect: none; }
-    button:backdrop.flat:active, button.sidebar-button:backdrop:active, button:backdrop.flat:checked, 
button.sidebar-button:backdrop:checked, button:backdrop:active, button:backdrop:checked {
+    button.titlebutton:backdrop:active, button.titlebutton:backdrop:checked, 
button.titlebutton:backdrop:active, button.titlebutton:backdrop:checked, button:backdrop.flat:active, 
button.sidebar-button:backdrop:active, button:backdrop.flat:checked, button.sidebar-button:backdrop:checked, 
button:backdrop:active, button:backdrop:checked {
       border-width: 2px;
       border-style: solid;
       color: black;
       background-color: #737373;
       border-color: #737373;
       background-image: none; }
-    button:backdrop.flat:disabled, button.sidebar-button:backdrop:disabled, button:backdrop:disabled {
+    button.titlebutton:backdrop:disabled, button.titlebutton:backdrop:disabled, 
button:backdrop.flat:disabled, button.sidebar-button:backdrop:disabled, button:backdrop:disabled {
       border-width: 2px;
       border-style: solid;
       color: gray;
       background-color: #070707;
       border-color: #494949;
       background-image: none; }
-      button:backdrop.flat:disabled:active, button.sidebar-button:backdrop:disabled:active, 
button:backdrop.flat:disabled:checked, button.sidebar-button:backdrop:disabled:checked, 
button:backdrop:disabled:active, button:backdrop:disabled:checked {
+      button.titlebutton:backdrop:disabled:active, button.titlebutton:backdrop:disabled:checked, 
button.titlebutton:backdrop:disabled:active, button.titlebutton:backdrop:disabled:checked, 
button:backdrop.flat:disabled:active, button.sidebar-button:backdrop:disabled:active, 
button:backdrop.flat:disabled:checked, button.sidebar-button:backdrop:disabled:checked, 
button:backdrop:disabled:active, button:backdrop:disabled:checked {
         border-width: 2px;
         border-style: solid;
         color: gray;
         border-color: #494949;
         background-image: none;
         background-color: #090909; }
-  button.flat:backdrop, button.sidebar-button:backdrop, button.flat:disabled, 
button.sidebar-button:disabled, button.flat:backdrop:disabled, button.sidebar-button:backdrop:disabled {
+  button.titlebutton:backdrop, button.titlebutton:disabled, button.titlebutton:backdrop:disabled, 
button.flat:backdrop, button.sidebar-button:backdrop, button.flat:disabled, button.sidebar-button:disabled, 
button.flat:backdrop:disabled, button.sidebar-button:backdrop:disabled {
     border-width: 2px;
     border-style: solid;
     color: #fff;
     background-color: transparent;
     background-image: none;
     border-color: transparent; }
-  button:disabled {
+  button.titlebutton:disabled, button:disabled {
     border-width: 2px;
     border-style: solid;
     color: gray;
     background-color: #070707;
     border-color: #494949;
     background-image: none; }
-    button:disabled:active, button:disabled:checked {
+    button.titlebutton:disabled:active, button.titlebutton:disabled:checked, button:disabled:active, 
button:disabled:checked {
       border-width: 2px;
       border-style: solid;
       color: gray;
       border-color: #494949;
       background-image: none;
       background-color: #070707; }
-  button.image-button {
+  button.image-button.titlebutton, button.image-button {
     min-width: 24px;
     padding-left: 4px;
     padding-right: 4px; }
-  button.text-button {
+  button.text-button.titlebutton, button.text-button {
     padding-left: 16px;
     padding-right: 16px; }
-  button.text-button.image-button {
+  button.text-button.image-button.titlebutton, button.text-button.image-button {
     padding-left: 8px;
     padding-right: 8px; }
-    button.text-button.image-button label {
+    button.text-button.image-button.titlebutton label, button.text-button.image-button label {
       padding-left: 8px;
       padding-right: 8px; }
-  combobox:drop(active) button.combo, button:drop(active) {
+  combobox:drop(active) button.combo, button.titlebutton:drop(active), button:drop(active) {
     color: #fff;
     border-color: #fff;
     box-shadow: inset 0 0 0 1px #fff; }
@@ -3290,36 +3290,6 @@ decoration {
     border: solid 1px #737373;
     box-shadow: none; }
 
-button.titlebutton {
-  padding: 8px;
-  border-color: transparent;
-  background-image: none;
-  transition-property: border, box-shadow, color;
-  box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px transparent; }
-  button.titlebutton:hover {
-    border-width: 2px;
-    border-style: solid;
-    color: #fff;
-    background-image: none;
-    background-color: #000;
-    border-color: gray; }
-  button.titlebutton:active {
-    border-width: 2px;
-    border-style: solid;
-    background-image: none;
-    color: black;
-    background-color: white;
-    border-color: gray; }
-  button.titlebutton:backdrop {
-    border-width: 2px;
-    border-style: solid;
-    color: #fff;
-    background-color: #000;
-    border-color: #737373;
-    background-image: none;
-    border-color: transparent;
-    transition-property: border, box-shadow, color; }
-
 /**********************
  * Touch Copy & Paste *
  *********************/
diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css
index d7dc65d..95e54c1 100644
--- a/gtk/theme/HighContrast/gtk-contained.css
+++ b/gtk/theme/HighContrast/gtk-contained.css
@@ -377,7 +377,7 @@ entry:drop(active):not(:only-child) + combobox > box > button.combo {
     background-image: -gtk-gradient(radial, center center, 0, center center, 0.01, to(#000), 
to(transparent)); }
   to {
     background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#000), 
to(transparent)); } }
-button {
+button.titlebutton, button {
   min-height: 24px;
   min-width: 16px;
   padding: 4px 8px;
@@ -390,7 +390,7 @@ button {
   background-image: none;
   background-color: #fff;
   border-color: gray; }
-  button.flat, button.sidebar-button {
+  button.titlebutton, button.flat, button.sidebar-button {
     border-width: 2px;
     border-style: solid;
     color: #000;
@@ -398,12 +398,12 @@ button {
     background-image: none;
     border-color: transparent;
     transition: none; }
-    button.flat:hover, button.sidebar-button:hover {
+    button.titlebutton:hover, button.flat:hover, button.sidebar-button:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
       transition-duration: 500ms; }
-      button.flat:hover:active, button.sidebar-button:hover:active {
+      button.titlebutton:hover:active, button.flat:hover:active, button.sidebar-button:hover:active {
         transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
-  button:hover {
+  button.titlebutton:hover, button:hover {
     border-width: 2px;
     border-style: solid;
     color: #000;
@@ -411,7 +411,7 @@ button {
     border-color: gray;
     background-image: none;
     -gtk-icon-effect: highlight; }
-  button:active, button:checked {
+  button.titlebutton:active, button.titlebutton:checked, button:active, button:checked {
     border-width: 2px;
     border-style: solid;
     background-image: none;
@@ -419,7 +419,7 @@ button {
     background-color: black;
     border-color: gray;
     transition-duration: 50ms; }
-  button:backdrop.flat, button.sidebar-button:backdrop, button:backdrop {
+  button.titlebutton:backdrop, button.titlebutton:backdrop, button:backdrop.flat, 
button.sidebar-button:backdrop, button:backdrop {
     border-width: 2px;
     border-style: solid;
     color: #000;
@@ -427,62 +427,62 @@ button {
     border-color: #8d8d8d;
     background-image: none;
     -gtk-icon-effect: none; }
-    button:backdrop.flat:active, button.sidebar-button:backdrop:active, button:backdrop.flat:checked, 
button.sidebar-button:backdrop:checked, button:backdrop:active, button:backdrop:checked {
+    button.titlebutton:backdrop:active, button.titlebutton:backdrop:checked, 
button.titlebutton:backdrop:active, button.titlebutton:backdrop:checked, button:backdrop.flat:active, 
button.sidebar-button:backdrop:active, button:backdrop.flat:checked, button.sidebar-button:backdrop:checked, 
button:backdrop:active, button:backdrop:checked {
       border-width: 2px;
       border-style: solid;
       color: white;
       background-color: #8d8d8d;
       border-color: #8d8d8d;
       background-image: none; }
-    button:backdrop.flat:disabled, button.sidebar-button:backdrop:disabled, button:backdrop:disabled {
+    button.titlebutton:backdrop:disabled, button.titlebutton:backdrop:disabled, 
button:backdrop.flat:disabled, button.sidebar-button:backdrop:disabled, button:backdrop:disabled {
       border-width: 2px;
       border-style: solid;
       color: gray;
       background-color: white;
       border-color: silver;
       background-image: none; }
-      button:backdrop.flat:disabled:active, button.sidebar-button:backdrop:disabled:active, 
button:backdrop.flat:disabled:checked, button.sidebar-button:backdrop:disabled:checked, 
button:backdrop:disabled:active, button:backdrop:disabled:checked {
+      button.titlebutton:backdrop:disabled:active, button.titlebutton:backdrop:disabled:checked, 
button.titlebutton:backdrop:disabled:active, button.titlebutton:backdrop:disabled:checked, 
button:backdrop.flat:disabled:active, button.sidebar-button:backdrop:disabled:active, 
button:backdrop.flat:disabled:checked, button.sidebar-button:backdrop:disabled:checked, 
button:backdrop:disabled:active, button:backdrop:disabled:checked {
         border-width: 2px;
         border-style: solid;
         color: gray;
         border-color: silver;
         background-image: none;
         background-color: #f6f6f6; }
-  button.flat:backdrop, button.sidebar-button:backdrop, button.flat:disabled, 
button.sidebar-button:disabled, button.flat:backdrop:disabled, button.sidebar-button:backdrop:disabled {
+  button.titlebutton:backdrop, button.titlebutton:disabled, button.titlebutton:backdrop:disabled, 
button.flat:backdrop, button.sidebar-button:backdrop, button.flat:disabled, button.sidebar-button:disabled, 
button.flat:backdrop:disabled, button.sidebar-button:backdrop:disabled {
     border-width: 2px;
     border-style: solid;
     color: #000;
     background-color: transparent;
     background-image: none;
     border-color: transparent; }
-  button:disabled {
+  button.titlebutton:disabled, button:disabled {
     border-width: 2px;
     border-style: solid;
     color: gray;
     background-color: white;
     border-color: silver;
     background-image: none; }
-    button:disabled:active, button:disabled:checked {
+    button.titlebutton:disabled:active, button.titlebutton:disabled:checked, button:disabled:active, 
button:disabled:checked {
       border-width: 2px;
       border-style: solid;
       color: gray;
       border-color: silver;
       background-image: none;
       background-color: white; }
-  button.image-button {
+  button.image-button.titlebutton, button.image-button {
     min-width: 24px;
     padding-left: 4px;
     padding-right: 4px; }
-  button.text-button {
+  button.text-button.titlebutton, button.text-button {
     padding-left: 16px;
     padding-right: 16px; }
-  button.text-button.image-button {
+  button.text-button.image-button.titlebutton, button.text-button.image-button {
     padding-left: 8px;
     padding-right: 8px; }
-    button.text-button.image-button label {
+    button.text-button.image-button.titlebutton label, button.text-button.image-button label {
       padding-left: 8px;
       padding-right: 8px; }
-  combobox:drop(active) button.combo, button:drop(active) {
+  combobox:drop(active) button.combo, button.titlebutton:drop(active), button:drop(active) {
     color: #000;
     border-color: #000;
     box-shadow: inset 0 0 0 1px #000; }
@@ -3297,36 +3297,6 @@ decoration {
     border: solid 1px #8d8d8d;
     box-shadow: none; }
 
-button.titlebutton {
-  padding: 8px;
-  border-color: transparent;
-  background-image: none;
-  transition-property: border, box-shadow, color;
-  box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
-  button.titlebutton:hover {
-    border-width: 2px;
-    border-style: solid;
-    color: #000;
-    background-image: none;
-    background-color: #fff;
-    border-color: gray; }
-  button.titlebutton:active {
-    border-width: 2px;
-    border-style: solid;
-    background-image: none;
-    color: white;
-    background-color: black;
-    border-color: gray; }
-  button.titlebutton:backdrop {
-    border-width: 2px;
-    border-style: solid;
-    color: #000;
-    background-color: #fff;
-    border-color: #8d8d8d;
-    background-image: none;
-    border-color: transparent;
-    transition-property: border, box-shadow, color; }
-
 /**********************
  * Touch Copy & Paste *
  *********************/


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]