ASCII text
1
/************
2
* Nautilus *
3
************/
4
// based css:
5
// https://git.gnome.org/browse/nautilus/tree/src/resources/css/Adwaita.css
6
// hard-coded css:
7
// https://git.gnome.org/browse/nautilus/tree/src/resources/css/nautilus.css
8
.nautilus-window,
10
.nautilus-window notebook,
11
.nautilus-window notebook > stack {
12
background-color: $base_color;
13
}
14
.nautilus-window paned > separator {
16
background-color: $bg_color;
17
}
18
.nautilus-canvas-item {
20
@extend iconview;
21
// border-radius: $material_radius;
23
}
24
.nautilus-canvas-item.dim-label,
26
.nautilus-list-dim-label {
27
// @extend .dim-label;
28
}
29
.nautilus-desktop.nautilus-canvas-item {
31
// background-color: scale-alpha($black, $lower_opacity);
32
color: $inverse_fg_color;
33
text-shadow: $shadow_1;
34
}
35
.nautilus-desktop.nautilus-canvas-item:selected {
37
// color: $inverse_fg_color;
38
text-shadow: none;
39
}
40
// Toolbar
42
@keyframes needs_attention_keyframes {
43
from { background-color: transparent; }
44
to { background-color: $fill_color; }
45
}
46
.nautilus-operations-button-needs-attention {
48
color: $accent_color;
49
animation: needs_attention_keyframes $longer_duration $standard_curve 2 alternate;
50
}
51
.nautilus-operations-button-needs-attention-multiple {
53
color: $accent_color;
54
animation: needs_attention_keyframes $longer_duration $standard_curve 4 alternate;
55
}
56
// Floating status bar
58
.nautilus-window .floating-bar {
59
@extend %osd;
60
// @extend .toolbar.osd;
62
min-height: 32px;
64
padding: 0;
65
border-style: solid solid none;
66
border-width: 1px;
67
border-color: $border_color;
68
border-radius: (2px + 1px) (2px + 1px) 0 0;
69
background-color: $base_color;
70
background-clip: $extra_background_clip;
71
transition: $longer_transition, border-width 0;
72
&.bottom.left { // axes left border and border radius
74
margin-right: 8px - 1px;
75
border-left-style: none;
76
border-top-left-radius: 0;
77
}
78
&.bottom.right { // axes right border and border radius
80
margin-left: 8px - 1px;
81
border-right-style: none;
82
border-top-right-radius: 0;
83
}
84
button {
86
margin: (32px - $small_size) / 2;
87
@extend %small_button;
89
}
90
}
91
.disk-space-display {
93
// border-style: solid;
94
// border-width: 2px;
95
}
96
.disk-space-display.unknown {
98
background-color: $warning_color;
99
}
100
.disk-space-display.used {
102
background-color: $primary_color;
103
}
104
.disk-space-display.free {
106
background-color: $fill_color;
107
color: $disabled_fg_color;
108
}
109
// View
111
.nautilus-list-view .view {
112
// border-bottom: 1px solid $border_color;
113
}
114
// Hide superfluous treeview drop target indication
116
.nautilus-list-view .view.dnd {
117
// border-style: none;
118
}
119
// Libgd tag entries in the search. Sadly it requires this copy pasted css style.
121
// https://git.gnome.org/browse/libgd/tree/libgd/gd-tagged-entry-default.css
122
.documents-entry-tag {
123
// min-height: 24px;
124
margin: 3px -2px 3px 8px;
125
padding: 0 8px;
126
border-radius: $circular_radius;
127
box-shadow: none;
128
background-color: $primary_color;
129
color: $inverse_fg_color;
130
&:hover { box-shadow: $shadow_1; }
132
}
133
.documents-entry-tag.button {
135
// @extend %simple_flat_button;
136
// min-height: 24px;
138
// min-width: 24px;
139
margin: 0 -2px;
140
padding: 4px;
141
border-radius: $circular_radius;
142
box-shadow: none;
143
color: $secondary_inverse_fg_color;
144
&:hover, &:active { color: $inverse_fg_color; }
146
}
147
// Workaround for the double border of the searchbar since we use a revealer which
149
// always allocates at least 1 pixel
150
.nautilus-window searchbar { border-top: 1px solid $border_color; }
151
.nautilus-window .searchbar-container { margin-top: -1px; }
153
.nautilus-window headerbar > revealer > button { @extend %circular_button; }
155
/*********
158
* gedit *
159
*********/
160
// based css:
161
// https://git.gnome.org/browse/gedit/tree/gedit/resources/css/gedit.adwaita.css
162
// hard-coded css:
163
// https://git.gnome.org/browse/gedit/tree/gedit/resources/css/gedit-style.css
164
// Only normal state is handle
166
.open-document-selector-name-label {
167
font-weight: bold;
168
}
169
// Only normal state is handle
171
.open-document-selector-path-label {
172
color: gtkalpha(currentColor, $tertiary_opacity);
173
font-size: smaller;
174
// @extend .dim-label;
176
}
177
.gedit-document-panel {
179
background-color: $lighter_bg_color;
180
}
181
.gedit-document-panel-group-row {
183
border-top: 1px solid $border_color;
184
}
185
.gedit-document-panel-group-row:first-child {
187
border-top: none;
188
}
189
// Try to look as the notebook tab close button
191
.gedit-document-panel row button.flat {
192
margin-top: 8px;
193
margin-bottom: 8px;
194
@extend %small_button;
196
}
197
.gedit-side-panel-paned statusbar {
199
border-top: 1px solid $border_color;
200
}
201
.gedit-search-slider {
203
margin: 4px 4px 8px;
204
entry {
206
&:dir(ltr),
207
&:dir(rtl) { // specificity bump
208
border-radius: 2px;
209
.gedit-search-entry-occurrences-tag {
211
all: unset;
212
color: gtkalpha(currentColor, $tertiary_opacity);
213
}
214
}
215
$buttons_width: $small_size * 2 + $container_padding * 3;
217
&:dir(ltr) {
219
margin-right: -$buttons_width;
220
padding-right: $buttons_width;
221
.gedit-search-entry-occurrences-tag { margin-left: $container_padding; }
223
image.right { margin-right: 0; }
225
}
226
&:dir(rtl) {
228
margin-left: -$buttons_width;
229
padding-left: $buttons_width;
230
.gedit-search-entry-occurrences-tag { margin-right: $container_padding; }
232
image.left { margin-left: 0; }
234
}
235
&.error ~ button {
237
color: $secondary_inverse_fg_color;
238
&:hover, &:active { color: $inverse_fg_color; }
240
&:disabled { color: $disabled_secondary_inverse_fg_color; }
242
}
243
}
244
button {
246
border: solid $container_padding transparent;
247
@extend %simple_flat_button;
249
&:dir(ltr),
251
&:dir(rtl) { @extend %small_button; } // specificity bump
252
&:last-child:dir(ltr),
254
&:not(:first-child):dir(rtl) { margin-left: -$container_padding / 2; }
255
&:first-child:dir(rtl),
257
&:not(:last-child):dir(ltr) { margin-right: -$container_padding / 2; }
258
}
259
}
260
frame.gedit-map-frame > border {
262
&:dir(ltr) { border-style: none none none solid; }
263
&:dir(rtl) { border-style: none solid none none; }
264
}
265
/**************
268
* Tweak Tool *
269
**************/
270
// hard-coded css:
271
// https://git.gnome.org/browse/gnome-tweak-tool/tree/data/shell.css
272
// the sidebar
274
.tweak-categories {
275
// padding: 4px 0;
276
// background-color: shade(@theme_bg_color, 0.99);
277
background-image: image($lighter_bg_color);
278
// hide separators
280
separator {
281
min-width: 0;
282
min-height: 0;
283
background-color: transparent;
284
}
285
}
286
.tweak {
288
padding: 3px;
289
// padding-top: 3px;
290
&.title:hover { box-shadow: none; }
292
}
293
.tweak-group-white,
295
.tweak-white,
296
.tweak-white:hover {
297
// background-color: white;
298
background-image: image($base_color);
299
}
300
.tweak-startup,
302
.tweak-startup:hover {
303
// background-color: lighter(shade(@theme_bg_color, 0.9));
304
background-image: image($base_color);
305
}
306
.tweak-group-startup {
308
// background-color: @view_separators;
309
background-image: image($base_color);
310
border: 1px solid $border_color;
311
}
312
/***********
315
* Builder *
316
***********/
317
// based css:
318
// https://git.gnome.org/browse/gnome-builder/tree/data/theme
319
// hard-coded css:
320
// https://git.gnome.org/browse/gnome-builder/tree/data/theme/shared.css
321
// Titlebar adjustments for workbench
323
//
324
// This is needed due to our placement of headerbar inside of a
325
// stack. We were seeing black edges around the header bar, and
326
// improper radius on the headerbar.
327
//
328
workbench stack.titlebar {
329
padding: 0;
330
// box-shadow: none;
331
}
332
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
334
border-radius: 2px 2px 0 0;
335
// box-shadow: none;
336
}
337
perspectiveswitcher {
339
background-color: $bg_color;
340
}
341
perspectiveswitcher button:checked {
343
color: $primary_color;
344
}
345
// Layout tab and tab bar tweaks
347
// The following makes the layout stack header look similar to a tab bar.
348
layouttabbar {
349
border-bottom: 1px solid $border_color;
350
background-color: $bg_color;
351
}
352
layouttabbar button { @extend %flat_button; }
354
layouttabbar > box > button {
356
margin: (40px - $medium_size) / 2 0;
357
// border-radius: 0;
358
}
359
layouttab {
361
margin: 0 8px; // not working
362
border-style: none solid;
363
border-width: 1px;
364
border-color: $border_color;
365
box-shadow: inset 0 -2px $primary_color;
366
background-color: $base_color;
367
}
368
layouttab separator.vertical {
370
margin: 8px 4px;
371
}
372
layouttab button {
374
&.text-button, &.image-button, & {
375
margin-top: 8px;
376
margin-bottom: 8px;
377
padding: 0 4px;
378
}
379
}
380
// Close button styling for layouttab.
382
layouttab > box > button.close {
383
border-radius: $circular_radius;
384
}
385
layout {
387
border: 1px solid $border_color;
388
-PnlDockBin-handle-size: 1;
389
}
390
entry.search-missing {
392
background-color: $error_color;
393
color: $inverse_fg_color;
394
}
395
// tweak icons for treeviews
397
workbench treeview.image { color: gtkalpha(currentColor, $tertiary_opacity); }
398
workbench treeview.image:selected { color: $tertiary_inverse_fg_color; }
400
dockbin {
402
border: 1px solid $border_color;
403
-PnlDockBin-handle-size: 1;
404
}
405
dockpaned {
407
border: 1px solid $border_color;
408
}
409
eggsearchbar box.search-bar {
411
padding: 0 8px;
412
border-bottom: 1px solid $border_color;
413
background-color: $bg_color;
414
}
415
docktabstrip {
417
padding: 0 8px;
418
border-bottom: 1px solid $border_color;
419
background-color: $bg_color;
420
}
421
docktab {
423
transition: $longer_transition,
424
background-size 0,
425
background-image 0;
426
min-height: $small_size;
427
min-width: $small_size;
428
margin-bottom: -1px;
429
padding: $container_padding 6px;
430
outline-offset: -6px;
432
border-width: 1px; // for reorderable tabs
434
border-color: transparent; //
435
background-image: radial-gradient(circle farthest-corner at center,
437
$primary_color 10%,
438
transparent 0%);
439
background-repeat: no-repeat;
440
background-position: center;
441
background-size: 0% 0%;
442
color: $secondary_fg_color;
444
font-weight: 500;
445
&:hover {
447
box-shadow: inset 0 -2px $fill_color;
448
color: $fg_color;
449
}
450
&:checked {
452
transition: $longer_transition,
453
background-size $longer_duration $deceleration_curve,
454
background-image $longer_duration + $ripple_duration $deceleration_curve;
455
box-shadow: inset 0 -2px $primary_color;
456
background-image: radial-gradient(circle farthest-corner at center,
457
transparent 10%,
458
transparent 0%);
459
background-size: 1000% 1000%;
460
color: $fg_color;
461
}
462
}
463
dockoverlayedge {
465
background-color: $bg_color;
466
}
467
dockoverlayedge docktabstrip {
469
padding: 0;
470
border: none;
471
}
472
dockoverlayedge.left-edge docktab {
474
&:hover { box-shadow: inset -2px 0 $fill_color; }
475
&:checked { box-shadow: inset -2px 0 $primary_color; }
476
}
477
dockoverlayedge.right-edge docktab {
479
&:hover { box-shadow: inset 2px 0 $fill_color; }
480
&:checked { box-shadow: inset 2px 0 $primary_color; }
481
}
482
pillbox {
484
background-color: $bg_color;
485
border-radius: 2px;
486
}
487
buildperspective row {
489
padding: 10px;
490
}
491
layoutpane entry.search {
493
@extend %entry.flat;
494
box-shadow: inset 0 -1px $border_color;
496
background-color: $base_color;
497
}
498
editortweak entry.search {
500
@extend %entry.flat;
501
margin-bottom: -1px;
503
box-shadow: none;
504
}
505
//
507
// let's tweak hard-coded elements
508
//
509
// styling for editor search
511
frame.gb-search-frame {
512
// border-bottom-left-radius: 5px;
513
border-bottom-right-radius: 5px;
514
}
515
.gb-search-entry-occurrences-tag {
517
box-shadow: none;
518
background-color: transparent;
519
}
520
// Keep search bar and layouttab height in sync.
522
docktabstrip {
523
min-height: 39px;
524
}
525
layouttabbar > box {
527
// min-height: 39px;
528
}
529
eggsearchbar > revealer > box {
531
// min-height: 39px;
532
}
533
eggsearchbar entry {
535
// min-height: 24px;
536
}
537
workbench preferences preferencesgroup list entry {
539
// background: none;
540
// min-height: 0px;
541
padding-top: 8px;
542
padding-bottom: 8px;
543
}
544
/**********
547
* Photos *
548
**********/
549
// based css:
550
// https://git.gnome.org/browse/gnome-photos/tree/data/Adwaita.css
551
GdMainIconView.content-view {
553
-GdMainIconView-icon-size: 48;
554
}
555
// Make spinner visible on both dark and bright backgrounds w/o making
557
// it look ugly/weird.
558
GdMainIconView.content-view.cell:active {
559
// color: $tertiary_fg_color;
560
}
561
.documents-counter {
563
margin: 8px;
564
border-radius: $circular_radius;
565
box-shadow: $shadow_2;
566
background-color: $accent_color;
567
color: $inverse_fg_color;
568
font-weight: bold;
569
}
570
.photos-entry-tag {
572
@extend .documents-entry-tag;
573
}
574
.documents-scrolledwin.frame {
576
border-style: none;
577
}
578
.photos-icon-bg {
580
}
581
.photos-fade-in {
583
opacity: 1;
584
transition: opacity $shorter_duration $deceleration_curve;
585
}
586
.photos-fade-out {
588
opacity: 0;
589
transition: opacity $shorter_duration $deceleration_curve;
590
}
591
.photos-collection-icon {
593
}
594
overlay grid.horizontal > revealer > scrolledwindow.frame {
596
&:dir(ltr) { border-style: none none none solid; }
597
&:dir(rtl) { border-style: none solid none none; }
598
}
599
/*********
602
* Music *
603
*********/
604
// hard-coded css:
605
// https://git.gnome.org/browse/gnome-music/tree/data/application.css
606
.side-panel:dir(ltr) {
608
// border-width: 0 1px 0 0;
609
border-style: solid;
610
border-color: $border_color;
611
}
612
.side-panel:dir(rtl) {
614
// border-width: 0 0 0 1px;
615
border-style: solid;
616
border-color: $border_color;
617
}
618
.side-panel .view {
620
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
621
background-image: image($lighter_bg_color);
622
&:hover { background-image: image(mix($fg_color, $lighter_bg_color, percentage(0.05))); }
624
}
625
.side-panel .view:selected {
627
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
628
background-image: image($primary_color);
629
&:hover { background-image: image(mix($inverse_fg_color, $primary_color, percentage(0.05))); }
631
}
632
.playlists-list {
634
// box-shadow: inset 0 -1px @view_separators;
635
}
636
.songs-list {
638
// box-shadow: inset 0 1px shade(@borders, 1.30);
639
// background-color: @theme_bg_color;
640
&:hover { background-image: image($row_fill_color); }
642
}
643
frame.documents-dropdown {
645
@extend toolbar.osd;
646
margin: 8px;
648
> border { border: none; }
650
}
651
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
653
border-bottom: 1px solid $border_color;
654
button > widget {
656
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
657
// -GtkArrow-arrow-scaling: 1;
658
}
659
}
660
/*********
663
* To Do *
664
*********/
665
task-row {
666
transition: $shorter_transition;
667
margin: 0 -4px;
668
&:hover { transition: none; }
670
label { margin: 0 8px; }
672
image { margin: 0 4px; }
674
}
675
task-list-view > box > revealer > box > button {
677
min-height: $medium_size;
678
margin: -4px;
679
padding: 0 12px;
680
label { margin: 0 8px; }
682
image { margin: 0 4px; }
684
}
685
/*******
688
* eog *
689
*******/
690
#eog-thumb-nav {
691
scrolledwindow { border-top: none; }
692
button { -gtk-outline-radius: 2px; }
694
}
695
/*************
698
* Evolution *
699
*************/
700
frame.taskbar > border { border-style: solid none none; }
701
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
703
/********
706
* gitg *
707
********/
708
frame.commit-frame > border { border-style: solid none none; }
709
/**************
712
* Characters *
713
**************/
714
box.dialog-vbox scrolledwindow.related { border: 1px solid $border_color; }
715
list.categories { background-image: image($lighter_bg_color); }
717
/**************
720
* Calculator *
721
**************/
722
button.title label { min-height: $medium_size; }
723