A fork of the Materia GTK theme.

By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 _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