A fork of the Materia GTK theme.

Important information: Google announced that, from September 2026, Android devices will require ALL apps to be signed by Google, effectively leading to an iOS situation. Value your right to a computer that does what you want; do not tolerate this monopolistic practice! Contact me if you don't understand why it is bad. Click to learn more.

 _libhandy.scss

View raw Download
text/plain • 4.99 kiB
ASCII text
        
            
1
// based on:
2
// https://gitlab.gnome.org/GNOME/libhandy/-/tree/master/src/themes
3
4
/**
5
* libhandy
6
*/
7
8
// HdyComboRow
9
10
popover.combo {
11
padding: 8px 0;
12
13
list {
14
border-style: none;
15
background-color: transparent;
16
17
> row {
18
min-height: 32px;
19
padding: 0 12px;
20
21
&:not(:last-child) {
22
// border-bottom: 1px solid divider($on-surface);
23
}
24
}
25
}
26
27
@each $border in top, bottom {
28
overshoot.#{$border} {
29
// @include rounded-border($border);
30
}
31
}
32
33
scrollbar.vertical {
34
// padding-top: 2px;
35
// padding-bottom: 2px;
36
37
&:dir(ltr) {
38
// @include rounded-border(right);
39
}
40
41
&:dir(rtl) {
42
// @include rounded-border(left);
43
}
44
}
45
}
46
47
// HdyExpanderRow
48
49
row.expander {
50
// padding: 0;
51
52
image.expander-row-arrow {
53
// @include margin-start(6px);
54
}
55
}
56
57
// HdyKeypad
58
59
keypad {
60
.digit {
61
font-size: 200%;
62
font-weight: bold;
63
}
64
65
.letters {
66
font-size: 70%;
67
}
68
69
.symbol {
70
font-size: 160%;
71
}
72
}
73
74
// HdyViewSwitcher
75
76
viewswitcher {
77
&,
78
button {
79
// margin: 0;
80
// padding: 0;
81
}
82
83
button {
84
// border-radius: 0;
85
// border-top: 0;
86
// border-bottom: 0;
87
// box-shadow: none;
88
// font-size: 1rem;
89
90
// View switcher in a header bar
91
headerbar &:not(:checked) {
92
}
93
94
// View switcher button
95
> stack > box {
96
&.narrow {
97
// font-size: 0.75rem;
98
// padding-top: 7px;
99
// padding-bottom: 5px;
100
101
image,
102
label {
103
// padding-left: 8px;
104
// padding-right: 8px;
105
}
106
}
107
108
&.wide {
109
// padding: 8px 12px;
110
111
label {
112
&:dir(ltr) {
113
// padding-right: 7px;
114
}
115
116
&:dir(rtl) {
117
// padding-left: 7px;
118
}
119
}
120
}
121
122
label.active {
123
// font-weight: bold;
124
}
125
}
126
127
&.needs-attention {
128
> stack > box label {
129
// @extend %needs-attention;
130
}
131
132
&:checked > stack > box label {
133
// animation: none;
134
// background-image: none;
135
}
136
}
137
}
138
}
139
140
// HdyViewSwitcherBar
141
142
viewswitcherbar actionbar > revealer > box {
143
// padding: 0;
144
}
145
146
// Content list
147
148
list.content {
149
border: 1px solid divider($on-surface);
150
background-clip: padding-box;
151
background-color: $base;
152
153
&,
154
list {
155
// background-color: transparent;
156
}
157
158
// Nested rows background
159
list.nested > row:not(:active) {
160
&:not(:hover):not(:selected),
161
&:hover:not(.activatable):not(:selected) {
162
// background-color: hdymix($bg_color, $base_color, 0.5);
163
}
164
165
&:hover.activatable:not(:selected) {
166
// background-color: hdymix($fg_color, $base_color, 0.95);
167
}
168
}
169
170
> row {
171
// Regular rows and expander header rows background
172
&:not(.expander):not(:active):not(:hover):not(:selected),
173
&:not(.expander):not(:active):hover:not(.activatable):not(:selected),
174
&.expander row.header:not(:active):not(:hover):not(:selected),
175
&.expander row.header:not(:active):hover:not(.activatable):not(:selected) {
176
// background-color: $base_color;
177
}
178
179
&:not(.expander):not(:active):hover.activatable:not(:selected),
180
&.expander row.header:not(:active):hover.activatable:not(:selected) {
181
// background-color: hdymix($fg_color, $base_color, 0.95);
182
}
183
184
&,
185
list > row {
186
// border-color: hdyalpha($borders_color, 0.7);
187
// border-style: solid;
188
// transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
189
}
190
191
// Top border
192
&:not(:first-child) {
193
// border-width: 1px 1px 0;
194
border-top: 1px solid divider($on-surface);
195
}
196
197
// Rounded top
198
&:first-child,
199
&.expander:first-child row.header,
200
&.expander:checked,
201
&.expander:checked row.header,
202
&.expander:checked + row,
203
&.expander:checked + row.expander row.header {
204
// @include rounded-border(top);
205
}
206
207
// Bottom border
208
&:last-child,
209
&.checked-expander-row-previous-sibling,
210
&.expander:checked {
211
// border-width: 1px;
212
}
213
214
// Rounded bottom
215
&:last-child,
216
&.checked-expander-row-previous-sibling,
217
&.expander:checked,
218
&.expander:not(:checked):last-child row.header,
219
&.expander:not(:checked).checked-expander-row-previous-sibling row.header,
220
&.expander.empty:checked row.header,
221
&.expander list.nested > row:last-child {
222
// @include rounded-border(bottom);
223
}
224
225
// Add space around expanded rows
226
&.expander:checked:not(:first-child),
227
&.expander:checked + row {
228
// margin-top: 6px;
229
}
230
}
231
}
232
233
// List button
234
235
button.list-button {
236
}
237
238
// Unified window
239
240
window.csd.unified:not(.solid-csd):not(.maximized):not(.fullscreen):not(.tiled):not(.tiled-top):not(.tiled-bottom):not(.tiled-left):not(.tiled-right) {
241
// Remove the sheen on headerbar...
242
headerbar {
243
box-shadow: $shadow-z1;
244
245
&.selection-mode {
246
// box-shadow: $shadow-z1;
247
}
248
}
249
250
// ...and add it on the window itself
251
> decoration-overlay {
252
box-shadow: inset 0 1px highlight($titlebar);
253
}
254
255
&,
256
> decoration,
257
> decoration-overlay {
258
border-radius: $corner-radius;
259
}
260
}
261