[gtk/gtk-3-24: 1/3] Make titlebuttons round



commit c73f2d8f22ca452834c79f87b54c0cf9799e9d0f
Author: frederik.feichtmeier <frederik feichtmeier gmail com>
Date:   Thu Aug 1 10:09:52 2019 -0400

    Make titlebuttons round
    
    - use even sides for the titlebuttons so the result is a circle and not an ellipse
    - add maximum border radius
    - set min width/height to 0
    - adjust margin and padding to match the previous look

 gtk/theme/Adwaita/_common.scss           | 6 ++++++
 gtk/theme/Adwaita/gtk-contained-dark.css | 6 ++++--
 gtk/theme/Adwaita/gtk-contained.css      | 6 ++++--
 3 files changed, 14 insertions(+), 4 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index cf881d99a1..430a032729 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -4539,6 +4539,12 @@ button.titlebutton {
 
   @include _button_text_shadow;
 
+  border-radius: 9999px;
+  padding: $_hb_btn_pad;
+  margin: 0 2px;
+  min-width: 0;
+  min-height: 0;
+
   .selection-mode & {
     @extend %button.flat.suggested-action;
 
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 060e4c6426..4e0962b89a 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -486,7 +486,7 @@ button:link > label:disabled, button:visited > label:disabled, button:link > lab
 
 button:link > label:backdrop:backdrop:hover, button:visited > label:backdrop:backdrop:hover, button:link > 
label:backdrop:backdrop:hover:selected, button:visited > label:backdrop:backdrop:hover:selected, button:link 
label:backdrop, button:visited > label:backdrop, *:link:backdrop:backdrop:hover, 
button:backdrop:backdrop:hover:link, button:backdrop:backdrop:hover:visited, 
*:link:backdrop:backdrop:hover:selected, button:backdrop:backdrop:hover:selected:link, 
button:backdrop:backdrop:hover:selected:visited, .selection-mode .titlebar:not(headerbar) 
.subtitle:backdrop:backdrop:hover:link, .selection-mode.titlebar:not(headerbar) 
.subtitle:backdrop:backdrop:hover:link, .selection-mode headerbar .subtitle:backdrop:backdrop:hover:link, 
headerbar.selection-mode .subtitle:backdrop:backdrop:hover:link, *:link:backdrop, button:backdrop:link, 
button:backdrop:visited { color: #15539e; }
 
-infobar.info *:link, infobar.info button:link, infobar.info button:visited, infobar.question *:link, 
infobar.question button:link, infobar.question button:visited, infobar.warning *:link, infobar.warning 
button:link, infobar.warning button:visited, infobar.error *:link, infobar.error button:link, infobar.error 
button:visited, button:link > label:selected, button:visited > label:selected, *:selected button:link > 
label, *:selected button:visited > label, *:link:selected, button:selected:link, button:selected:visited, 
.selection-mode .titlebar:not(headerbar) .subtitle:link, .selection-mode.titlebar:not(headerbar) 
.subtitle:link, .selection-mode headerbar .subtitle:link, headerbar.selection-mode .subtitle:link, *:selected 
*:link, *:selected button:link, *:selected button:visited { color: #d0ddec; }
+button:link > label:selected, button:visited > label:selected, *:selected button:link > label, *:selected 
button:visited > label, *:link:selected, button:selected:link, button:selected:visited, .selection-mode 
.titlebar:not(headerbar) .subtitle:link, .selection-mode.titlebar:not(headerbar) .subtitle:link, 
.selection-mode headerbar .subtitle:link, headerbar.selection-mode .subtitle:link, *:selected *:link, 
*:selected button:link, *:selected button:visited { color: #d0ddec; }
 
 button:link, button:visited { text-shadow: none; }
 
@@ -1792,6 +1792,8 @@ infobar.info button:backdrop label, infobar.info button:backdrop, infobar.info b
 
 infobar.info selection, infobar.question selection, infobar.warning selection, infobar.error selection { 
background-color: #1b1b1b; }
 
+infobar.info *:link, infobar.info button:link, infobar.info button:visited, infobar.question *:link, 
infobar.question button:link, infobar.question button:visited, infobar.warning *:link, infobar.warning 
button:link, infobar.warning button:visited, infobar.error *:link, infobar.error button:link, infobar.error 
button:visited { color: #3584e4; }
+
 /************ Tooltips * */
 tooltip { padding: 4px; /* not working */ border-radius: 5px; box-shadow: none; text-shadow: 0 1px black; }
 
@@ -1904,7 +1906,7 @@ messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 2px rgba(0,
 
 .solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #353535, inset 0 1px rgba(238, 238, 236, 0.07); 
}
 
-button.titlebutton { text-shadow: 0 -1px rgba(0, 0, 0, 0.834353); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 
0.834353); }
+button.titlebutton { text-shadow: 0 -1px rgba(0, 0, 0, 0.834353); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 
0.834353); border-radius: 9999px; padding: 6px; margin: 0 2px; min-width: 0; min-height: 0; }
 
 button.titlebutton:backdrop { -gtk-icon-shadow: none; }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 6604861a9d..97b868cc95 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -494,7 +494,7 @@ button:link > label:disabled, button:visited > label:disabled, button:link > lab
 
 button:link > label:backdrop:backdrop:hover, button:visited > label:backdrop:backdrop:hover, button:link > 
label:backdrop:backdrop:hover:selected, button:visited > label:backdrop:backdrop:hover:selected, button:link 
label:backdrop, button:visited > label:backdrop, *:link:backdrop:backdrop:hover, 
button:backdrop:backdrop:hover:link, button:backdrop:backdrop:hover:visited, 
*:link:backdrop:backdrop:hover:selected, button:backdrop:backdrop:hover:selected:link, 
button:backdrop:backdrop:hover:selected:visited, .selection-mode .titlebar:not(headerbar) 
.subtitle:backdrop:backdrop:hover:link, .selection-mode.titlebar:not(headerbar) 
.subtitle:backdrop:backdrop:hover:link, .selection-mode headerbar .subtitle:backdrop:backdrop:hover:link, 
headerbar.selection-mode .subtitle:backdrop:backdrop:hover:link, *:link:backdrop, button:backdrop:link, 
button:backdrop:visited { color: #3584e4; }
 
-infobar.info *:link, infobar.info button:link, infobar.info button:visited, infobar.question *:link, 
infobar.question button:link, infobar.question button:visited, infobar.warning *:link, infobar.warning 
button:link, infobar.warning button:visited, infobar.error *:link, infobar.error button:link, infobar.error 
button:visited, button:link > label:selected, button:visited > label:selected, *:selected button:link > 
label, *:selected button:visited > label, *:link:selected, button:selected:link, button:selected:visited, 
.selection-mode .titlebar:not(headerbar) .subtitle:link, .selection-mode.titlebar:not(headerbar) 
.subtitle:link, .selection-mode headerbar .subtitle:link, headerbar.selection-mode .subtitle:link, *:selected 
*:link, *:selected button:link, *:selected button:visited { color: #d7e6fa; }
+button:link > label:selected, button:visited > label:selected, *:selected button:link > label, *:selected 
button:visited > label, *:link:selected, button:selected:link, button:selected:visited, .selection-mode 
.titlebar:not(headerbar) .subtitle:link, .selection-mode.titlebar:not(headerbar) .subtitle:link, 
.selection-mode headerbar .subtitle:link, headerbar.selection-mode .subtitle:link, *:selected *:link, 
*:selected button:link, *:selected button:visited { color: #d7e6fa; }
 
 button:link, button:visited { text-shadow: none; }
 
@@ -1808,6 +1808,8 @@ infobar.info button:backdrop label, infobar.info button:backdrop, infobar.info b
 
 infobar.info selection, infobar.question selection, infobar.warning selection, infobar.error selection { 
background-color: #dfdcd8; }
 
+infobar.info *:link, infobar.info button:link, infobar.info button:visited, infobar.question *:link, 
infobar.question button:link, infobar.question button:visited, infobar.warning *:link, infobar.warning 
button:link, infobar.warning button:visited, infobar.error *:link, infobar.error button:link, infobar.error 
button:visited { color: #1b6acb; }
+
 /************ Tooltips * */
 tooltip { padding: 4px; /* not working */ border-radius: 5px; box-shadow: none; text-shadow: 0 1px black; }
 
@@ -1920,7 +1922,7 @@ messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 2px rgba(0,
 
 .solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #f6f5f4, inset 0 1px rgba(255, 255, 255, 0.8); }
 
-button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.769231); -gtk-icon-shadow: 0 1px rgba(255, 
255, 255, 0.769231); }
+button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.769231); -gtk-icon-shadow: 0 1px rgba(255, 
255, 255, 0.769231); border-radius: 9999px; padding: 6px; margin: 0 2px; min-width: 0; min-height: 0; }
 
 button.titlebutton:backdrop { -gtk-icon-shadow: none; }
 


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