ASCII text
1
/************
2
* Nautilus *
3
************/
4
// based css:
5
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/Adwaita.css
6
// hard-coded css:
7
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/nautilus.css
8
.nautilus-window,
10
.nautilus-window notebook,
11
.nautilus-window notebook > stack {
12
background-color: $base;
13
}
14
.nautilus-canvas-item {
16
// border-radius: $corner-radius;
17
}
18
.nautilus-canvas-item.dim-label,
20
.nautilus-list-dim-label {
21
color: $text-secondary;
22
}
23
.nautilus-desktop.nautilus-canvas-item {
25
// background-color: $scrim;
26
color: on(dark);
27
text-shadow: $shadow-1;
28
}
29
// Toolbar
31
@keyframes needs_attention_keyframes {
33
to { background-color: $overlay-focus; }
34
}
35
.nautilus-operations-button-needs-attention {
37
animation: needs_attention_keyframes $duration-ripple-aftermath $ease 2 alternate;
38
}
39
.nautilus-operations-button-needs-attention-multiple {
41
animation: needs_attention_keyframes $duration-ripple-aftermath $ease 6 alternate;
42
}
43
.linked > button:not(.suggested-action):not(.destructive-action).disclosure-button { @extend %circular_button; }
45
// Path bar
47
.path-bar-box {
49
transition: background-color $duration $ease-out;
50
margin: $container-padding 0;
51
border-radius: $corner-radius;
52
button { margin: 0; } // reset the margin
54
&.width-maximized { background-color: $titlebar-fill; }
56
// workaround for 3.30.1
58
&.background.frame {
59
border-style: none;
60
background-color: $titlebar-fill;
61
}
62
.path-bar button {
64
label:not(:only-child) {
65
&:first-child { margin-left: 0; }
66
&:last-child { margin-right: 0; }
68
}
69
}
70
}
71
// Floating status bar
73
.nautilus-window .floating-bar {
74
min-height: 32px;
75
padding: 0;
76
border-style: solid solid none;
77
border-width: 1px;
78
border-color: $border;
79
border-radius: ($corner-radius + 1px) ($corner-radius + 1px) 0 0;
80
background-color: rgba($base, 0.9);
81
background-clip: $background-clip-extra;
82
&.bottom.left { // axes left border and border radius
84
margin-right: 8px - 1px;
85
border-left-style: none;
86
border-top-left-radius: 0;
87
}
88
&.bottom.right { // axes right border and border radius
90
margin-left: 8px - 1px;
91
border-right-style: none;
92
border-top-right-radius: 0;
93
}
94
button {
96
margin: (32px - $small-size) / 2;
97
@extend %small_button;
99
}
100
}
101
.disk-space-display {
103
// border-style: solid;
104
// border-width: 2px;
105
&.unknown {
107
background-color: $track;
108
color: $track;
109
}
110
&.used {
112
background-color: $primary;
113
color: $primary;
114
}
115
&.free {
117
background-color: $divider;
118
color: $divider;
119
}
120
}
121
// View
123
// Hide superfluous treeview drop target indication
124
.nautilus-list-view .view:not(.dnd) {
125
// border-bottom: 1px solid $border;
126
}
127
.search-information {
129
padding: 2px;
130
border-bottom: 1px solid $border;
131
background-color: $base;
132
color: $text;
133
}
134
.documents-entry-tag {
136
@extend .entry-tag;
137
}
138
.conflict-row:not(:selected) { background-color: mix($warning, $base, percentage(0.3)); }
140
// Icon view
142
.nautilus-window flowboxchild {
143
// .icon-background { background-color: black; }
144
.icon-item-background {
146
padding: 4px;
147
border-radius: $corner-radius;
148
}
149
&:selected {
151
background-color: transparent;
152
.icon-item-background { @extend %selected_items; }
154
}
155
}
156
// Batch rename dialog
158
dialog.background > box.dialog-vbox.vertical > grid.horizontal {
159
> scrolledwindow.frame { border-style: none; }
160
> box.horizontal:last-child {
162
margin: -6px 0 0 -6px;
163
border-top: 1px solid $border;
164
> label { margin: 0 8px; }
166
> box > button { border-radius: 0; }
168
}
169
}
170
// Tweak to fix the messy sizing of the popover menu
172
.nautilus-window > popover.menu:not(:last-child) {
173
padding: 3px;
174
> stack > box > box > box {
176
margin-top: -6px;
177
> box {
179
margin-bottom: -6px;
180
&.linked { margin-top: 1px; }
182
}
183
}
184
separator { margin-bottom: -2px; }
186
}
187
.nautilus-menu-sort-heading {
189
// min-height: 26px;
190
// padding-left: 5px;
191
// padding-right: 5px;
192
margin: 1px 3px;
193
font-weight: 500;
194
&:disabled { color: $text-secondary; }
196
}
197
// Make operations button circular
199
.nautilus-window headerbar revealer > button { @extend %circular_button; }
200
// Ensure paned separator rendering. See issue #84 for details.
202
.nautilus-window paned > separator { background-color: $background; }
203
/*********
206
* gedit *
207
*********/
208
// based css:
209
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit.adwaita.css
210
// hard-coded css:
211
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit-style.css
212
// Only normal state is handle
214
.open-document-selector-name-label {
215
// font-weight: bold;
216
}
217
// Only normal state is handle
219
.open-document-selector-path-label {
220
color: $text-secondary;
221
font-size: smaller;
222
}
223
// Only normal state is handle
225
.open-document-selector-match {
226
background-color: $warning;
227
color: on($warning);
228
}
229
.gedit-document-panel {
231
background-color: $base-alt;
232
// Try to look as the notebook tab close button
234
row button.flat {
235
margin-top: 8px;
236
margin-bottom: 8px;
237
@extend %small_button;
239
}
240
}
241
.gedit-document-panel-group-row:not(:first-child) {
243
border-top: 1px solid $border;
244
}
245
.gedit-side-panel-paned statusbar {
247
border-top: 1px solid $border;
248
}
249
.gedit-search-slider {
251
margin: 4px 4px 8px;
252
.linked:not(.vertical) > entry {
254
border-radius: $corner-radius;
255
@extend %entry_raised;
256
.gedit-search-entry-occurrences-tag {
258
all: unset;
259
color: $text-secondary;
260
}
261
$buttons_width: $small-size * 2 + $container-padding * 3;
263
&:dir(ltr) {
265
margin-right: -$buttons_width;
266
padding-right: $buttons_width;
267
.gedit-search-entry-occurrences-tag { margin-left: $container-padding; }
269
image.right { margin-right: 0; }
271
}
272
&:dir(rtl) {
274
margin-left: -$buttons_width;
275
padding-left: $buttons_width;
276
.gedit-search-entry-occurrences-tag { margin-right: $container-padding; }
278
image.left { margin-left: 0; }
280
}
281
&:not(.error) { background-color: $surface; }
283
&.error ~ button {
285
color: on($error, secondary);
286
&:hover, &:active { color: on($error); }
288
&:disabled { color: on($error, secondary-disabled); }
290
}
291
}
292
.linked > button {
294
border: solid $container-padding transparent;
295
border-radius: $circular-radius;
296
@extend %simple_flat_button;
298
@extend %small_button;
299
&:last-child:dir(ltr),
301
&:not(:first-child):dir(rtl) { margin-left: -$container-padding / 2; }
302
&:first-child:dir(rtl),
304
&:not(:last-child):dir(ltr) { margin-right: -$container-padding / 2; }
305
}
306
}
307
frame.gedit-map-frame > border {
309
&:dir(ltr) { border-style: none none none solid; }
310
&:dir(rtl) { border-style: none solid none none; }
311
}
312
/**********
315
* Tweaks *
316
**********/
317
// hard-coded css:
318
// https://gitlab.gnome.org/GNOME/gnome-tweaks/blob/master/data/shell.css
319
// the sidebar
321
.tweak-categories {
322
// padding: 4px 0;
323
// background-color: shade(@theme_bg_color, 0.99);
324
background-image: image($base-alt);
325
separator { @extend %hide_separators; }
327
}
328
.tweak {
330
// padding-top: 3px;
331
padding: 3px;
332
&.title:hover { box-shadow: none; }
334
}
335
.tweak-group-white,
337
.tweak-white,
338
.tweak-white:hover {
339
// background-color: white;
340
background-image: image($base);
341
}
342
.tweak-startup,
344
.tweak-startup:hover {
345
// background-color: lighter(shade(@theme_bg_color, 0.9));
346
background-image: image($base);
347
}
348
.tweak-group-startup {
350
// background-color: @view_separators;
351
background-image: image($base);
352
border: 1px solid $border;
353
}
354
//
356
// Workaround for 3.26
357
//
358
row#Focus,
360
row#ClickMethod,
361
row#StaticWorkspaceTweak, // for 3.26.0
362
row#dynamic-workspaces,
363
row#PrimaryWorkspaceTweak, // for 3.26.0
364
row#workspaces-only-on-primary {
365
padding: 0;
366
border: 1px solid $border;
367
row:not(:last-child) { border-bottom: 1px solid $border; }
369
&.tweak > list { margin-top: -3px; }
371
}
372
// Add more spaces between title and list
374
row#Focus,
375
row#ClickMethod,
376
row#PrimaryWorkspaceTweak, // for 3.26.0
377
row#workspaces-only-on-primary {
378
margin-top: 4px;
379
}
380
/***********
383
* Builder *
384
***********/
385
// based css for 3.22:
386
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-22/data/theme
387
// based css for 3.24:
388
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-24/data/theme
389
// based css for 3.26:
390
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-26/data/themes
391
// Layout tab and tab bar tweaks
393
// The following makes the layout stack header look similar to a tab bar.
394
layouttabbar {
395
border-bottom: 1px solid $border;
396
background-color: $background;
397
button { @extend %flat_button; }
399
> box > button {
401
margin: (40px - $medium-size) / 2 0;
402
// border-radius: 0;
403
}
404
}
405
layouttab {
407
margin: 0 8px; // not working
408
border-style: none solid;
409
border-width: 1px;
410
border-color: $border;
411
box-shadow: inset 0 -2px $primary;
412
background-color: $base;
413
separator.vertical { margin: 8px 4px; }
415
button {
417
&.text-button, &.image-button, & {
418
margin-top: 8px;
419
margin-bottom: 8px;
420
padding: 0 4px;
421
}
422
}
423
// Close button styling for layouttab.
425
// > box > button.close { @extend %circular_button; }
426
}
427
layout {
429
border: 1px solid $border;
430
-PnlDockBin-handle-size: 1;
431
}
432
entry.search-missing {
434
background-color: $error;
435
color: on($error);
436
}
437
// tweak icons for treeviews
439
window.workbench treeview.image {
440
color: $text-secondary;
441
}
442
popover.popover-selector list {
444
padding: 8px - 2px;
445
row {
447
border-radius: $corner-radius;
448
image {
450
&:dir(ltr) { margin-right: 6px; }
451
&:dir(rtl) { margin-left: 6px; }
452
}
453
.accel {
455
&:dir(ltr) { margin-left: 6px; }
456
&:dir(rtl) { margin-right: 6px; }
457
}
458
}
459
}
460
omnibar {
462
&.linked:not(.vertical) entry { border-radius: $corner-radius; }
463
&:not(:hover):not(:active) entry { color: $text-secondary; }
465
}
466
popover.omnibar list row:not(:last-child) {
468
border-bottom: 1px solid $border;
469
}
470
entry.preferences-search {
472
@extend %entry.flat;
473
box-shadow: inset 0 -1px $border;
475
background-color: $base;
476
// doesn't work properly
478
// &:dir(ltr) { border-right: 1px solid $border; }
479
// &:dir(rtl) { border-left: 1px solid $border; }
480
}
481
preferences stacksidebar.sidebar {
483
list { background-color: $base-alt; }
484
&:dir(ltr),
486
&:dir(rtl) { list { border-style: none; }}
487
list separator { @extend %hide_separators; }
489
}
490
preferences > box > box {
492
&:dir(ltr) { border-right: 1px solid $border; }
493
&:dir(rtl) { border-left: 1px solid $border; }
494
}
495
popover.messagepopover {
497
&.background { padding: 0; }
498
.popover-action-area button {
500
@extend %simple_flat_button;
501
padding: 8px 16px;
503
border-top: 1px solid $border;
504
border-radius: 0;
505
&:first-child { border-bottom-left-radius: $corner-radius; }
507
&:last-child { border-bottom-right-radius: $corner-radius; }
509
}
510
.popover-content-area { margin: 16px; }
512
}
513
popover.transfers list {
515
background-color: transparent;
516
row:not(:first-child) { border-top: 1px solid $border; }
518
row > box { padding: 10px; }
520
}
521
dockbin {
523
border: 1px solid $border;
524
-PnlDockBin-handle-size: 1;
525
}
526
dockpaned {
528
border: 1px solid $border;
529
}
530
eggsearchbar box.search-bar {
532
padding: 0 8px;
533
border-bottom: 1px solid $border;
534
background-color: $background;
535
}
536
docktabstrip {
538
padding: 0 8px;
539
border-bottom: 1px solid $border;
540
background-color: $background;
541
}
542
docktab {
544
transition: $transition,
545
background-size 0,
546
background-image 0;
547
min-height: $small-size;
548
min-width: $small-size;
549
margin-bottom: -1px;
550
padding: $container-padding 6px;
551
outline-offset: -6px;
553
border-width: 1px; // for reorderable tabs
555
border-color: transparent; //
556
box-shadow: inset 0 -2px transparent;
558
background-image: radial-gradient(circle farthest-corner at center,
559
$primary 10%,
560
transparent 0%);
561
background-repeat: no-repeat;
562
background-position: center;
563
background-size: 0% 0%;
564
color: $text-secondary;
566
font-weight: 500;
567
&:hover {
569
background-color: $overlay-hover;
570
color: $text;
571
}
572
&:checked {
574
transition: $transition,
575
background-size $duration-ripple $ease-out,
576
background-image $duration-ripple + $duration-ripple-aftermath $ease-out;
577
box-shadow: inset 0 -2px $primary;
578
background-color: transparent;
579
background-image: radial-gradient(circle farthest-corner at center,
580
transparent 10%,
581
transparent 0%);
582
background-size: 1000% 1000%;
583
color: $text;
584
}
585
}
586
dockoverlayedge {
588
background-color: $background;
589
docktabstrip {
591
padding: 0;
592
border: none;
593
}
594
&.left-edge docktab {
596
&:hover { box-shadow: inset -2px 0 $track; }
597
&:checked { box-shadow: inset -2px 0 $primary; }
598
}
599
&.right-edge docktab {
601
&:hover { box-shadow: inset 2px 0 $track; }
602
&:checked { box-shadow: inset 2px 0 $primary; }
603
}
604
}
605
pillbox {
607
background-color: $background;
608
border-radius: $corner-radius;
609
}
610
buildperspective row {
612
// padding: 10px;
613
}
614
layoutpane entry.search {
616
@extend %entry.flat;
617
box-shadow: inset 0 -1px $border;
619
background-color: $base;
620
}
621
editortweak entry.search {
623
@extend %entry.flat;
624
margin-bottom: -1px;
626
box-shadow: none;
627
}
628
//
630
// let's tweak hard-coded elements
631
//
632
.gb-search-entry-occurrences-tag {
634
box-shadow: none;
635
background-color: transparent;
636
}
637
// Keep search bar and layouttab height in sync.
639
// layouttabbar > box,
640
// eggsearchbar > revealer > box,
641
docktabstrip {
642
min-height: 39px;
643
}
644
eggsearchbar entry {
646
// min-height: 24px;
647
}
648
window.workbench preferences preferencesgroup list entry {
650
// background: none;
651
// min-height: 0px;
652
padding-top: 8px;
653
padding-bottom: 8px;
654
}
655
button.run-arrow-button {
657
// min-width: 12px;
658
padding-left: ($medium-size - 16px) / 2;
659
padding-right: ($medium-size - 16px) / 2;
660
}
661
//
663
// Additional styles for 3.26
664
//
665
button.dzlmenubutton image {
667
min-width: $medium-size - 6px;
668
&.arrow { min-width: $medium-size - 9px; }
670
}
671
button.dzlmenubuttonitem {
673
color: $text;
674
font-weight: normal;
675
&:disabled { color: $text-disabled; }
677
}
678
idelayoutstackheader {
680
border-bottom: 1px solid $border;
681
button:checked { color: $text; }
683
}
684
// utilities stack switcher
686
ideeditorutilities > dzldockpaned > box > stackswitcher {
687
padding: 8px 0;
688
background-color: $background;
689
&:dir(ltr) { border-right: 1px solid $border; }
691
&:dir(rtl) { border-left: 1px solid $border; }
693
button {
695
border-radius: 0;
696
outline-offset: -6px;
697
box-shadow: none;
698
background-color: transparent;
699
&:active {
701
background-image: radial-gradient(circle farthest-corner at center,
702
rgba($primary, 0.7) 10%,
703
transparent 0%);
704
}
705
&:checked {
707
background-color: transparent;
708
color: $text;
709
}
710
&:dir(ltr) {
712
margin-right: -1px;
713
&:hover { box-shadow: inset -2px 0 $track; }
715
&:active,
717
&:checked { box-shadow: inset -2px 0 $primary; }
718
}
719
&:dir(rtl) {
721
margin-left: -1px;
722
&:hover { box-shadow: inset 2px 0 $track; }
724
&:active,
726
&:checked { box-shadow: inset 2px 0 $primary; }
727
}
728
}
729
}
730
// buildui panel
732
ideeditorsidebar notebook header {
733
background: transparent;
734
}
735
popover.messagepopover {
737
// padding: 0;
738
list {
740
border: 1px solid $border;
741
row:not(:last-child) { border-bottom: 1px solid $border; }
743
}
744
}
745
/**********
748
* Photos *
749
**********/
750
// based css:
751
// https://gitlab.gnome.org/GNOME/gnome-photos/blob/master/data/Adwaita.css
752
GdMainIconView.content-view {
754
-GdMainIconView-icon-size: 48;
755
// Make spinner visible on both dark and bright backgrounds w/o making
757
// it look ugly/weird.
758
// &.cell:active { color: $text-disabled; }
759
}
760
.documents-counter {
762
margin: 8px;
763
border-radius: $circular-radius;
764
box-shadow: $shadow-2;
765
background-color: $primary;
766
color: on($primary);
767
font-weight: bold;
768
}
769
.photos-entry-tag {
771
@extend .entry-tag;
772
}
773
.documents-scrolledwin.frame {
775
border-style: none;
776
frame.content-view > border { border-style: none; }
778
}
779
.photos-icon-bg {
781
}
782
.photos-fade-in {
784
opacity: 1;
785
transition: opacity $duration $ease-out;
786
}
787
.photos-fade-out {
789
opacity: 0;
790
transition: opacity $duration $ease-out;
791
}
792
.photos-collection-icon {
794
}
795
button.photos-filter-preview {
797
color: $text;
798
font-weight: normal;
799
&:checked {
801
background-color: $overlay-selected;
802
color: $text;
803
image {
805
color: on(dark);
806
-gtk-icon-shadow: $shadow-1;
807
}
808
}
809
}
810
overlay grid.horizontal > revealer > scrolledwindow.frame {
812
&:dir(ltr) { border-style: none none none solid; }
813
&:dir(rtl) { border-style: none solid none none; }
814
}
815
/*********
818
* Music *
819
*********/
820
// hard-coded css:
821
// https://gitlab.gnome.org/GNOME/gnome-music/blob/master/data/application.css
822
.side-panel:dir(ltr) {
824
// border-width: 0 1px 0 0;
825
border-style: solid;
826
border-color: $border;
827
}
828
.side-panel:dir(rtl) {
830
// border-width: 0 0 0 1px;
831
border-style: solid;
832
border-color: $border;
833
}
834
.side-panel .view {
836
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
837
background-image: image($base-alt);
838
&:hover { background-image: image(mix($text, $base-alt, percentage(0.05))); }
840
}
841
.side-panel .view:selected {
843
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
844
background-image: image($primary);
845
&:hover { background-image: image(mix(on($primary), $primary, percentage(0.05))); }
847
}
848
.songs-list {
850
// box-shadow: inset 0 -1px shade(@borders, 1.30);
851
// background-color: @theme_bg_color;
852
&:hover { background-image: image($overlay-hover); }
854
}
855
frame.documents-dropdown {
857
@extend toolbar.osd;
858
margin: 8px;
860
> border { border: none; }
862
}
863
box.vertical > revealer > toolbar.search-bar {
865
border-bottom: 1px solid $border;
866
background-clip: border-box; // avoid black border
867
button > widget {
869
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
870
// -GtkArrow-arrow-scaling: 1;
871
}
872
}
873
/*********
876
* To Do *
877
*********/
878
// less than 3.28
879
task-list-view {
880
taskrow {
881
transition: $transition;
882
margin: 0 -8px;
883
&:hover { transition: none; }
885
label { margin: 0 8px; }
887
image.dim-label { min-width: 16px; }
889
}
890
> box > revealer > box > button {
892
margin: (12px * 2 - $medium-size) / 2;
893
.dim-label { opacity: 1; }
895
}
896
}
897
// 3.28 or later
899
tasklistview {
900
taskrow {
901
outline: none;
902
entry {
904
&, &:focus, &:disabled { box-shadow: none; }
905
}
906
image.dim-label { min-width: 16px; }
908
}
909
> box > revealer > box > button {
911
margin: (12px * 2 - $medium-size) / 2;
912
.dim-label { opacity: 1; }
914
}
915
}
916
/*******
919
* eog *
920
*******/
921
#eog-thumb-nav {
922
scrolledwindow { border-top: none; }
923
button { -gtk-outline-radius: $corner-radius; }
925
}
926
/*************
929
* Evolution *
930
*************/
931
frame.taskbar > border { border-style: solid none none; }
932
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
934
/********
937
* gitg *
938
********/
939
frame.commit-frame > border { border-style: solid none none; }
940
/**************
943
* Characters *
944
**************/
945
box.dialog-vbox scrolledwindow.related { border: 1px solid $border; }
946
list.categories { background-image: image($base-alt); }
948
/*********
951
* Boxes *
952
*********/
953
.transparent-bg + stack overlay > label {
954
min-height: 24px;
955
padding: 0 4px;
956
border-radius: $corner-radius;
957
background-color: $scrim;
958
color: on($scrim);
959
}
960
/**************
963
* Calculator *
964
**************/
965
button.title label { min-height: $medium-size; }
966
/*********
969
* Geary *
970
*********/
971
// fix a issue that separator seems double
972
.geary-titlebar-left {
973
&:dir(ltr) {
974
margin-right: 5px;
975
padding-right: 0;
976
}
977
&:dir(rtl) {
979
margin-left: 5px;
980
padding-left: 0;
981
}
982
> separator { background-color: rgba(black, 0.05); }
984
}
985
.geary-titlebar-right {
987
&:dir(ltr) { margin-left: -5px; }
988
&:dir(rtl) { margin-right: -5px; }
990
}
991