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.94 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
151
&,
152
list {
153
// background-color: transparent;
154
}
155
156
// Nested rows background
157
list.nested > row:not(:active) {
158
&:not(:hover):not(:selected),
159
&:hover:not(.activatable):not(:selected) {
160
// background-color: hdymix($bg_color, $base_color, 0.5);
161
}
162
163
&:hover.activatable:not(:selected) {
164
// background-color: hdymix($fg_color, $base_color, 0.95);
165
}
166
}
167
168
> row {
169
// Regular rows and expander header rows background
170
&:not(.expander):not(:active):not(:hover):not(:selected),
171
&:not(.expander):not(:active):hover:not(.activatable):not(:selected),
172
&.expander row.header:not(:active):not(:hover):not(:selected),
173
&.expander row.header:not(:active):hover:not(.activatable):not(:selected) {
174
// background-color: $base_color;
175
}
176
177
&:not(.expander):not(:active):hover.activatable:not(:selected),
178
&.expander row.header:not(:active):hover.activatable:not(:selected) {
179
// background-color: hdymix($fg_color, $base_color, 0.95);
180
}
181
182
&,
183
list > row {
184
// border-color: hdyalpha($borders_color, 0.7);
185
// border-style: solid;
186
// transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
187
}
188
189
// Top border
190
&:not(:last-child) {
191
// border-width: 1px 1px 0;
192
border-top: 1px solid divider($on-surface);
193
}
194
195
// Rounded top
196
&:first-child,
197
&.expander:first-child row.header,
198
&.expander:checked,
199
&.expander:checked row.header,
200
&.expander:checked + row,
201
&.expander:checked + row.expander row.header {
202
// @include rounded-border(top);
203
}
204
205
// Bottom border
206
&:last-child,
207
&.checked-expander-row-previous-sibling,
208
&.expander:checked {
209
// border-width: 1px;
210
}
211
212
// Rounded bottom
213
&:last-child,
214
&.checked-expander-row-previous-sibling,
215
&.expander:checked,
216
&.expander:not(:checked):last-child row.header,
217
&.expander:not(:checked).checked-expander-row-previous-sibling row.header,
218
&.expander.empty:checked row.header,
219
&.expander list.nested > row:last-child {
220
// @include rounded-border(bottom);
221
}
222
223
// Add space around expanded rows
224
&.expander:checked:not(:first-child),
225
&.expander:checked + row {
226
// margin-top: 6px;
227
}
228
}
229
}
230
231
// List button
232
233
button.list-button {
234
}
235
236
// Unified window
237
238
window.csd.unified:not(.solid-csd):not(.maximized):not(.fullscreen):not(.tiled):not(.tiled-top):not(.tiled-bottom):not(.tiled-left):not(.tiled-right) {
239
// Remove the sheen on headerbar...
240
headerbar {
241
box-shadow: $shadow-z1;
242
243
&.selection-mode {
244
// box-shadow: $shadow-z1;
245
}
246
}
247
248
// ...and add it on the window itself
249
> decoration-overlay {
250
box-shadow: inset 0 1px highlight($titlebar);
251
}
252
253
&,
254
> decoration,
255
> decoration-overlay {
256
border-radius: $corner-radius;
257
}
258
}
259