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.

 _misc.scss

View raw Download
text/plain • 6.13 kiB
ASCII text
        
            
1
/*********
2
* Tilix *
3
*********/
4
overlay > revealer {
5
&.left > scrolledwindow.frame,
6
&.right > scrolledwindow.frame {
7
border-style: none;
8
box-shadow: $shadow-z16;
9
}
10
11
&.left > scrolledwindow.frame { margin-right: 32px; }
12
13
&.right > scrolledwindow.frame { margin-left: 32px; }
14
}
15
16
.terminix-session-sidebar, // for backward compatibility
17
.tilix-session-sidebar { background-image: image($surface); }
18
19
.terminal-titlebar button { border-radius: 0; }
20
21
button.image-button.session-new-button { min-width: $medium-size - 4px; }
22
23
// Remove extra padding
24
notebook.tilix-background tab > box > stack { margin: -6px; }
25
26
button.flat.tilix-small-button {
27
// NOTE: padding is hard-coded with:
28
// padding: 2px 4px;
29
min-height: $small-size - 2px * 2;
30
min-width: $small-size - 4px * 2;
31
}
32
33
34
/**************
35
* Terminator *
36
**************/
37
.terminator-terminal-window {
38
paned > separator { background-color: $background; }
39
40
// this should be fixed by the upstream
41
notebook.frame { border-style: none; }
42
}
43
44
45
/*************
46
* Ubitquity *
47
*************/
48
#live_installer .menubar progressbar trough {
49
border-radius: 4px; // Adjust to hard-coded progress border-radius
50
background-color: $titlebar-stroke-disabled;
51
}
52
53
54
/***********
55
* Eclipse *
56
***********/
57
window.background > box.vertical > scrolledwindow > widget toolbar {
58
padding: 2px;
59
60
separator,
61
button { margin: 2px; }
62
63
button { border-radius: $corner-radius; }
64
}
65
66
67
/************
68
* Chromium *
69
************/
70
window.background.chromium {
71
background-color: $surface;
72
73
// FIXME: There is no way to change the color of the toolbar buttons
74
// toolbar button { color: $text2; }
75
76
// toolbar's border-bottom refers to button's border
77
// FIXME: Chrome's button border ignores theme's alpha value :(
78
entry,
79
> button { border: 1px solid $stroke; }
80
81
> button {
82
color: $primary;
83
84
&:disabled { color: $text2-disabled; }
85
}
86
87
menubar,
88
headerbar { color: $titlebar-text2; }
89
90
// Workaround for non-animatable buttons in headerbar
91
headerbar button:active { background-color: $overlay-active; }
92
93
spinner { color: $primary; }
94
95
// For text field
96
textview.view { background-color: transparent; }
97
98
// For prominent button, starred icon, etc.
99
treeview.view.cell:selected:focus {
100
background-color: $primary;
101
color: on($primary);
102
}
103
104
// For table header
105
treeview.view button {
106
border: 1px solid $stroke;
107
background-color: $base; // FIXME: This should not be necessary
108
// color: $text2;
109
}
110
}
111
112
tooltip.background.chromium { background-color: rgba($tooltip, 1); }
113
114
115
/***********
116
* Firefox *
117
***********/
118
#MozillaGtkWidget {
119
> widget {
120
// For popover, entry in toolbar, etc.
121
text { background-color: $surface; }
122
123
// For selection, active tab indicator, etc.
124
text:selected {
125
// Use traditional selection style as workaround
126
background-color: $primary;
127
color: on($primary);
128
}
129
130
// For separators in bookmark toolbar
131
> separator { color: $divider; }
132
133
// avoid black border
134
// > scrollbar { background-clip: border-box; }
135
136
// Emphasize toolbar's border-bottom
137
> frame > border { border-color: $stroke; }
138
139
> entry,
140
> button > button {
141
border: 1px solid $stroke;
142
border-radius: $corner-radius;
143
box-shadow: none;
144
145
&:disabled { border-color: $stroke-disabled; }
146
}
147
148
> entry {
149
min-height: 32px - 2px;
150
background-color: $base;
151
152
&:focus {
153
border-color: $primary;
154
box-shadow: inset 0 0 0 1px $primary;
155
}
156
157
&:disabled { background-color: $base-alt; }
158
}
159
160
> button > button {
161
padding: 4px 8px;
162
background-size: auto;
163
164
&:hover { box-shadow: inset 0 0 0 9999px $overlay-hover; }
165
166
&:active { background-image: image($overlay-active); }
167
}
168
169
// use 16px assets for hard-coded sizing
170
> checkbutton > check { @extend %small_check; }
171
172
> radiobutton > radio { @extend %small_radio; }
173
174
> checkbutton > check,
175
> radiobutton > radio {
176
margin: 0;
177
padding: 0;
178
}
179
180
// make check/radio visible regardless of whether the background is bright or dark
181
> checkbutton > check:not(:checked):not(:indeterminate),
182
> radiobutton > radio:not(:checked):not(:indeterminate) {
183
color: $grey-600;
184
185
&:disabled { color: rgba($grey-600, 0.5); }
186
}
187
}
188
189
// remove ugly border around the menus
190
menu { border: none; }
191
192
// Workaround: Firefox doesn't properly read color from
193
// menuitem:disabled, but from menuitem label:disabled.
194
menuitem label:disabled {
195
color: $text-disabled;
196
}
197
}
198
199
// for backward compatibility
200
#MozillaGtkWidget {
201
> widget {
202
> menubar {
203
color: $titlebar-text2;
204
205
&:hover { color: $titlebar-text; }
206
207
&:disabled { color: $titlebar-text2-disabled; }
208
}
209
210
> frame { color: $stroke; }
211
}
212
213
menu > separator { color: $divider; }
214
}
215
216
217
/************
218
* Inkscape *
219
************/
220
#ToolboxCommon {
221
> #AuxToolbox {
222
#StyleSwatch { font-size: smaller; }
223
224
#Kludge { padding: 0; }
225
226
spinbutton,
227
entry { min-height: 32px; }
228
229
button:not(.up):not(.down) {
230
min-height: 24px;
231
min-width: 16px;
232
padding: 4px 8px;
233
border-radius: $corner-radius;
234
}
235
236
spinbutton button { border-width: 4px; }
237
}
238
239
> toolbar.vertical {
240
margin-top: -4px;
241
242
button {
243
min-height: 24px;
244
min-width: 24px;
245
padding: 4px;
246
border-radius: $corner-radius;
247
}
248
}
249
}
250
251
#CanvasTable {
252
button {
253
min-height: 16px;
254
min-width: 16px;
255
padding: 0;
256
}
257
258
#HorizontalScrollbar { border-top: 1px solid $divider; }
259
260
#VerticalScrollbar {
261
&:dir(ltr) { border-left: 1px solid $divider; }
262
263
&:dir(rtl) { border-right: 1px solid $divider; }
264
}
265
}
266
267
#Canvas_and_Dock {
268
frame > border { border: none; }
269
270
// each canvases' titlebar
271
widget > widget {
272
> button.flat {
273
min-height: 16px;
274
min-width: 16px;
275
padding: 4px;
276
}
277
278
> box.horizontal image { padding: 4px; }
279
}
280
281
// vertical dock buttons
282
box.horizontal > box.vertical > button.flat {
283
min-height: 16px;
284
min-width: 24px;
285
padding: 8px 4px;
286
}
287
}
288
289
290
/***********
291
* Synapse *
292
***********/
293
box.vertical > widget > widget:selected { @extend %selected_items; }
294