Skip to content

Commit f25d7e0

Browse files
committed
[Gtk-3.22] Separate titlebar mixin from toolbar
Separate mixin for toolbar and titlebar Symbolic icon for horizontal toolbar. Lets face it, toolbutton icons for gnome+hicolor are not as good as symbolic icons. We are using symbolic icons everywhere else anyway. Button padding for horizontal toolbar is reduced to 4px. Horizontal toolbar requests GTK_ICON_SIZE_LARGE (24x24) by default. It doesn't make sense to use 5px padding on 24x24 icons. Button (image, text, image-text, popup, radio) padding for vertical toolbar,headerbar remains same for now.
1 parent f52633e commit f25d7e0

1 file changed

Lines changed: 57 additions & 10 deletions

File tree

src/gtk-3.20/scss/widgets/_toolbar.scss

Lines changed: 57 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,14 @@
55
! Toolbar
66
**********/
77

8-
@mixin toolbar($bg, $fg) {
8+
@mixin titlebar($bg, $fg) {
99
@include linear-gradient($bg);
1010
@include border($bg);
1111

1212
color: $fg;
1313

1414
&:disabled {
1515
@include linear-gradient(shade($bg, .9));
16-
1716
color: mix($fg, $bg, .5);
1817
}
1918

@@ -28,22 +27,65 @@
2827
}
2928

3029
button { @include button($bg, $fg); }
31-
3230
.linked > button { @include linked_button($bg); }
3331

34-
combobox, button {
35-
padding: $spacing;
32+
combobox { padding: 4px; }
33+
34+
separator {
35+
&, &:disabled {
36+
color: shade($bg, ($contrast - .2));
37+
border-color: currentColor;
38+
-GtkWidget-window-dragging: true;
39+
}
40+
}
41+
}
42+
43+
44+
45+
46+
47+
@mixin toolbar($bg, $fg) {
48+
@include linear-gradient($bg);
49+
@include border($bg);
50+
51+
color: $fg;
52+
53+
&:disabled {
54+
@include linear-gradient(shade($bg, .9));
55+
color: mix($fg, $bg, .5);
56+
}
57+
58+
.title {
59+
font-weight: bold;
60+
padding: 0 ($spacing * 2);
61+
}
62+
63+
.subtitle {
64+
font-size: smaller;
65+
padding: 0 ($spacing * 2);
66+
}
3667

37-
&.text-button { padding: $spacing; }
68+
button { @include button($bg, $fg); }
69+
.linked > button { @include linked_button($bg); }
3870

39-
&.image-button { padding: $spacing; }
71+
&.horizontal combobox { padding: 4px; }
72+
73+
&.horizontal button {
74+
padding: 4px;
75+
&.text-button { padding: 4px; }
76+
&.image-button { padding: 4px; }
77+
}
78+
79+
&.vertical button {
80+
padding: 5px;
81+
&.text-button { padding: 5px; }
82+
&.image-button { padding: 5px; }
4083
}
4184

4285
separator {
4386
&, &:disabled {
4487
color: shade($bg, ($contrast - .2));
4588
border-color: currentColor;
46-
4789
-GtkWidget-window-dragging: true;
4890
}
4991
}
@@ -81,6 +123,7 @@
81123
%toolbar {
82124
padding: $spacing - 1px;
83125
border-style: none;
126+
-gtk-icon-style: symbolic;
84127

85128
// toolbar separators
86129
&.horizontal separator { margin: 0 ($spacing + 2px) 1px; }
@@ -99,6 +142,11 @@
99142
button { // Size height
100143
margin-top: $spacing + 3px;
101144
margin-bottom: $spacing + 3px;
145+
&.popup { padding: 5px; }
146+
&.image-button { padding: 5px; }
147+
&.text-button.image-button { padding: 5px; }
148+
&.text-button { padding: 5px; }
149+
102150
}
103151

104152
switch { // Size height
@@ -113,7 +161,7 @@
113161
}
114162

115163
%titlebar { // Default headerbar and titlebar code.
116-
@include toolbar($titlebar_bg_color, $titlebar_fg_color);
164+
@include titlebar($titlebar_bg_color, $titlebar_fg_color);
117165
@include linear-gradient($titlebar_bg_color);
118166

119167
border-radius: $roundness $roundness 0 0;
@@ -186,7 +234,6 @@
186234
@include exports("toolbar") {
187235
toolbar {
188236
@include toolbar($toolbar_bg_color, $toolbar_fg_color);
189-
190237
@extend %toolbar;
191238

192239
&.inline-toolbar { @include inline-toolbar($toolbar_bg_color, $toolbar_fg_color); }

0 commit comments

Comments
 (0)