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_color;
13
}
14
.nautilus-canvas-item {
16
// border-radius: $material_radius;
17
}
18
.nautilus-canvas-item.dim-label,
20
.nautilus-list-dim-label {
21
color: $secondary_fg_color;
22
&:selected { color: $inverse_secondary_fg_color; }
24
}
25
.nautilus-desktop.nautilus-canvas-item:not(:selected) {
27
// background-color: $panel_bg_color;
28
color: $inverse_fg_color;
29
text-shadow: $shadow_1;
30
}
31
// Toolbar
33
@keyframes needs_attention_keyframes {
34
to { background-color: $fill_color; }
35
}
36
.nautilus-operations-button-needs-attention {
38
animation: needs_attention_keyframes $longer_duration $standard_curve 2 alternate;
39
}
40
.nautilus-operations-button-needs-attention-multiple {
42
animation: needs_attention_keyframes $longer_duration $standard_curve 4 alternate;
43
}
44
.disclosure-button { @extend %circular_button; }
46
.path-bar-box {
48
// transition: background-color $shorter_duration $deceleration_curve;
49
// margin: $container_padding 0;
50
// border-radius: $material_radius;
51
// button { margin: 0; } // reset the margin
53
// &.width-maximized { background-color: rgba($titlebar_fg_color, 0.06); }
55
}
56
// Floating status bar
58
.nautilus-window .floating-bar {
59
min-height: 32px;
60
padding: 0;
61
border-style: solid solid none;
62
border-width: 1px;
63
border-color: $border_color;
64
border-radius: ($material_radius + 1px) ($material_radius + 1px) 0 0;
65
background-color: rgba($base_color, 0.9);
66
background-clip: $extra_background_clip;
67
transition: $shorter_transition, border-width 0;
68
&.bottom.left { // axes left border and border radius
70
margin-right: 8px - 1px;
71
border-left-style: none;
72
border-top-left-radius: 0;
73
}
74
&.bottom.right { // axes right border and border radius
76
margin-left: 8px - 1px;
77
border-right-style: none;
78
border-top-right-radius: 0;
79
}
80
button {
82
margin: (32px - $small_size) / 2;
83
@extend %small_button;
85
}
86
}
87
.disk-space-display {
89
// border-style: solid;
90
// border-width: 2px;
91
&.unknown {
93
background-color: $track_color;
94
color: $track_color;
95
}
96
&.used {
98
background-color: $primary_color;
99
color: $primary_color;
100
}
101
&.free {
103
background-color: $divider_color;
104
color: $divider_color;
105
}
106
}
107
// View
109
// Hide superfluous treeview drop target indication
110
.nautilus-list-view .view:not(.dnd) {
111
// border-bottom: 1px solid $border_color;
112
}
113
.search-information {
115
padding: 2px;
116
background-color: $primary_color;
117
color: $inverse_fg_color;
118
}
119
.documents-entry-tag {
121
@extend .entry-tag;
122
}
123
.conflict-row:not(:selected) { background-color: mix($warning_color, $base_color, percentage(0.3)); }
125
// Icon view
127
.nautilus-window flowboxchild {
128
// .icon-background { background-color: black; }
129
.icon-item-background {
131
padding: 4px;
132
border-radius: $material_radius;
133
}
134
&:selected {
136
background-color: transparent;
137
.icon-item-background { background-color: $primary_color; }
139
}
140
}
141
// Batch rename dialog
143
dialog.background > box.dialog-vbox.vertical > grid.horizontal {
144
> scrolledwindow.frame { border-style: none; }
145
> box.horizontal:last-child {
147
margin: -6px 0 0 -6px;
148
border-top: 1px solid $border_color;
149
> label { margin: 0 8px; }
151
> box > button { border-radius: 0; }
153
}
154
}
155
// Tweak to fix the messy sizing of the popover menu
157
.nautilus-window > popover.menu:not(:last-child) {
158
padding: 3px;
159
> stack > box > box > box {
161
margin-top: -6px;
162
> box {
164
margin-bottom: -6px;
165
&.linked { margin-top: 1px; }
167
}
168
}
169
separator { margin-bottom: -2px; }
171
}
172
.nautilus-menu-sort-heading {
174
// min-height: 26px;
175
// padding-left: 5px;
176
// padding-right: 5px;
177
margin: 1px 3px;
178
font-weight: 500;
179
&:disabled { color: $hint_fg_color; }
181
}
182
// Make operations button circular
184
.nautilus-window headerbar > revealer > button { @extend %circular_button; }
185
// Ensure paned separator rendering. See issue #84 for details.
187
.nautilus-window paned > separator { background-color: $bg_color; }
188
/*********
191
* gedit *
192
*********/
193
// based css:
194
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit.adwaita.css
195
// hard-coded css:
196
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit-style.css
197
// Only normal state is handle
199
.open-document-selector-name-label {
200
// font-weight: bold;
201
}
202
// Only normal state is handle
204
.open-document-selector-path-label {
205
color: $secondary_fg_color;
206
font-size: smaller;
207
&:selected { color: $inverse_secondary_fg_color; }
209
}
210
.gedit-document-panel {
212
background-color: $alt_base_color;
213
// Try to look as the notebook tab close button
215
row button.flat {
216
margin-top: 8px;
217
margin-bottom: 8px;
218
@extend %small_button;
220
}
221
}
222
.gedit-document-panel-group-row:not(:first-child) {
224
border-top: 1px solid $border_color;
225
}
226
.gedit-side-panel-paned statusbar {
228
border-top: 1px solid $border_color;
229
}
230
.gedit-search-slider {
232
margin: 4px 4px 8px;
233
.linked > entry {
235
border-radius: $material_radius;
236
.gedit-search-entry-occurrences-tag {
238
all: unset;
239
color: $hint_fg_color;
240
}
241
$buttons_width: $small_size * 2 + $container_padding * 3;
243
&:dir(ltr) {
245
margin-right: -$buttons_width;
246
padding-right: $buttons_width;
247
.gedit-search-entry-occurrences-tag { margin-left: $container_padding; }
249
image.right { margin-right: 0; }
251
}
252
&:dir(rtl) {
254
margin-left: -$buttons_width;
255
padding-left: $buttons_width;
256
.gedit-search-entry-occurrences-tag { margin-right: $container_padding; }
258
image.left { margin-left: 0; }
260
}
261
&:not(.error) { background-color: $popup_bg_color; }
263
&.error ~ button {
265
color: $inverse_secondary_fg_color;
266
&:hover, &:active { color: $inverse_fg_color; }
268
&:disabled { color: $inverse_disabled_secondary_fg_color; }
270
}
271
}
272
.linked > button {
274
border: solid $container_padding transparent;
275
border-radius: $circular_radius;
276
@extend %simple_flat_button;
278
@extend %small_button;
279
&:last-child:dir(ltr),
281
&:not(:first-child):dir(rtl) { margin-left: -$container_padding / 2; }
282
&:first-child:dir(rtl),
284
&:not(:last-child):dir(ltr) { margin-right: -$container_padding / 2; }
285
}
286
}
287
frame.gedit-map-frame > border {
289
&:dir(ltr) { border-style: none none none solid; }
290
&:dir(rtl) { border-style: none solid none none; }
291
}
292
/**********
295
* Tweaks *
296
**********/
297
// hard-coded css:
298
// https://gitlab.gnome.org/GNOME/gnome-tweaks/blob/master/data/shell.css
299
// the sidebar
301
.tweak-categories {
302
// padding: 4px 0;
303
// background-color: shade(@theme_bg_color, 0.99);
304
background-image: image($alt_base_color);
305
separator { @extend %hide_separators; }
307
}
308
.tweak {
310
// padding-top: 3px;
311
padding: 3px;
312
&.title:hover { box-shadow: none; }
314
}
315
.tweak-group-white,
317
.tweak-white,
318
.tweak-white:hover {
319
// background-color: white;
320
background-image: image($base_color);
321
}
322
.tweak-startup,
324
.tweak-startup:hover {
325
// background-color: lighter(shade(@theme_bg_color, 0.9));
326
background-image: image($base_color);
327
}
328
.tweak-group-startup {
330
// background-color: @view_separators;
331
background-image: image($base_color);
332
border: 1px solid $border_color;
333
}
334
//
336
// Workaround for 3.26
337
//
338
row#Focus,
340
row#ClickMethod,
341
row#StaticWorkspaceTweak, // for 3.26.0
342
row#dynamic-workspaces,
343
row#PrimaryWorkspaceTweak, // for 3.26.0
344
row#workspaces-only-on-primary {
345
padding: 0;
346
border: 1px solid $border_color;
347
row:not(:last-child) { border-bottom: 1px solid $border_color; }
349
&.tweak > list { margin-top: -3px; }
351
}
352
// Add more spaces between title and list
354
row#Focus,
355
row#ClickMethod,
356
row#PrimaryWorkspaceTweak, // for 3.26.0
357
row#workspaces-only-on-primary {
358
margin-top: 4px;
359
}
360
/***********
363
* Builder *
364
***********/
365
// based css for 3.22:
366
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-22/data/theme
367
// based css for 3.24:
368
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-24/data/theme
369
// based css for 3.26:
370
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-26/data/themes
371
// Layout tab and tab bar tweaks
373
// The following makes the layout stack header look similar to a tab bar.
374
layouttabbar {
375
border-bottom: 1px solid $border_color;
376
background-color: $bg_color;
377
button { @extend %flat_button; }
379
> box > button {
381
margin: (40px - $medium_size) / 2 0;
382
// border-radius: 0;
383
}
384
}
385
layouttab {
387
margin: 0 8px; // not working
388
border-style: none solid;
389
border-width: 1px;
390
border-color: $border_color;
391
box-shadow: inset 0 -2px $primary_color;
392
background-color: $base_color;
393
separator.vertical { margin: 8px 4px; }
395
button {
397
&.text-button, &.image-button, & {
398
margin-top: 8px;
399
margin-bottom: 8px;
400
padding: 0 4px;
401
}
402
}
403
// Close button styling for layouttab.
405
// > box > button.close { @extend %circular_button; }
406
}
407
layout {
409
border: 1px solid $border_color;
410
-PnlDockBin-handle-size: 1;
411
}
412
entry.search-missing {
414
background-color: $error_color;
415
color: $inverse_fg_color;
416
}
417
// tweak icons for treeviews
419
window.workbench treeview.image {
420
color: $secondary_fg_color;
421
&:selected { color: $inverse_secondary_fg_color; }
423
}
424
popover.popover-selector list {
426
padding: 8px - 2px;
427
row {
429
border-radius: $material_radius;
430
image {
432
&:dir(ltr) { margin-right: 6px; }
433
&:dir(rtl) { margin-left: 6px; }
434
}
435
.accel {
437
&:dir(ltr) { margin-left: 6px; }
438
&:dir(rtl) { margin-right: 6px; }
439
}
440
}
441
}
442
omnibar {
444
&.linked:not(.vertical) entry { border-radius: $material_radius; }
445
&:not(:hover):not(:active) entry { color: $secondary_fg_color; }
447
}
448
popover.omnibar list row:not(:last-child) {
450
border-bottom: 1px solid $border_color;
451
}
452
entry.preferences-search {
454
@extend %entry.flat;
455
box-shadow: inset 0 -1px $border_color;
457
background-color: $base_color;
458
// doesn't work properly
460
// &:dir(ltr) { border-right: 1px solid $border_color; }
461
// &:dir(rtl) { border-left: 1px solid $border_color; }
462
}
463
preferences stacksidebar.sidebar {
465
list { background-color: $alt_base_color; }
466
&:dir(ltr),
468
&:dir(rtl) { list { border-style: none; }}
469
list separator { @extend %hide_separators; }
471
}
472
preferences > box > box {
474
&:dir(ltr) { border-right: 1px solid $border_color; }
475
&:dir(rtl) { border-left: 1px solid $border_color; }
476
}
477
popover.messagepopover {
479
&.background { padding: 0; }
480
.popover-action-area button {
482
@extend %simple_flat_button;
483
padding: 8px 16px;
485
border-top: 1px solid $border_color;
486
border-radius: 0;
487
&:first-child { border-bottom-left-radius: $material_radius; }
489
&:last-child { border-bottom-right-radius: $material_radius; }
491
}
492
.popover-content-area { margin: 16px; }
494
}
495
popover.transfers list {
497
background-color: transparent;
498
row:not(:first-child) { border-top: 1px solid $border_color; }
500
row > box { padding: 10px; }
502
}
503
dockbin {
505
border: 1px solid $border_color;
506
-PnlDockBin-handle-size: 1;
507
}
508
dockpaned {
510
border: 1px solid $border_color;
511
}
512
eggsearchbar box.search-bar {
514
padding: 0 8px;
515
border-bottom: 1px solid $border_color;
516
background-color: $bg_color;
517
}
518
docktabstrip {
520
padding: 0 8px;
521
border-bottom: 1px solid $border_color;
522
background-color: $bg_color;
523
}
524
docktab {
526
transition: $shorter_transition,
527
background-size 0,
528
background-image 0;
529
min-height: $small_size;
530
min-width: $small_size;
531
margin-bottom: -1px;
532
padding: $container_padding 6px;
533
outline-offset: -6px;
535
border-width: 1px; // for reorderable tabs
537
border-color: transparent; //
538
box-shadow: inset 0 -2px transparent;
540
background-image: radial-gradient(circle farthest-corner at center,
541
$primary_color 10%,
542
transparent 0%);
543
background-repeat: no-repeat;
544
background-position: center;
545
background-size: 0% 0%;
546
color: $secondary_fg_color;
548
font-weight: 500;
549
&:hover {
551
background-color: $semi_fill_color;
552
color: $fg_color;
553
}
554
&:checked {
556
transition: $shorter_transition,
557
background-size $longer_duration $deceleration_curve,
558
background-image $longer_duration + $ripple_duration $deceleration_curve;
559
box-shadow: inset 0 -2px $primary_color;
560
background-color: transparent;
561
background-image: radial-gradient(circle farthest-corner at center,
562
transparent 10%,
563
transparent 0%);
564
background-size: 1000% 1000%;
565
color: $fg_color;
566
}
567
}
568
dockoverlayedge {
570
background-color: $bg_color;
571
docktabstrip {
573
padding: 0;
574
border: none;
575
}
576
&.left-edge docktab {
578
&:hover { box-shadow: inset -2px 0 $track_color; }
579
&:checked { box-shadow: inset -2px 0 $primary_color; }
580
}
581
&.right-edge docktab {
583
&:hover { box-shadow: inset 2px 0 $track_color; }
584
&:checked { box-shadow: inset 2px 0 $primary_color; }
585
}
586
}
587
pillbox {
589
background-color: $bg_color;
590
border-radius: $material_radius;
591
}
592
buildperspective row {
594
// padding: 10px;
595
}
596
layoutpane entry.search {
598
@extend %entry.flat;
599
box-shadow: inset 0 -1px $border_color;
601
background-color: $base_color;
602
}
603
editortweak entry.search {
605
@extend %entry.flat;
606
margin-bottom: -1px;
608
box-shadow: none;
609
}
610
//
612
// let's tweak hard-coded elements
613
//
614
.gb-search-entry-occurrences-tag {
616
box-shadow: none;
617
background-color: transparent;
618
}
619
// Keep search bar and layouttab height in sync.
621
// layouttabbar > box,
622
// eggsearchbar > revealer > box,
623
docktabstrip {
624
min-height: 39px;
625
}
626
eggsearchbar entry {
628
// min-height: 24px;
629
}
630
window.workbench preferences preferencesgroup list entry {
632
// background: none;
633
// min-height: 0px;
634
padding-top: 8px;
635
padding-bottom: 8px;
636
}
637
button.run-arrow-button {
639
// min-width: 12px;
640
padding-left: ($medium_size - 16px) / 2;
641
padding-right: ($medium_size - 16px) / 2;
642
}
643
//
645
// Additional styles for 3.26
646
//
647
button.dzlmenubutton image {
649
min-width: $medium_size - 6px;
650
&.arrow { min-width: $medium_size - 9px; }
652
}
653
button.dzlmenubuttonitem {
655
color: $fg_color;
656
font-weight: normal;
657
&:disabled { color: $disabled_fg_color; }
659
}
660
idelayoutstackheader {
662
border-bottom: 1px solid $border_color;
663
button:checked { color: $fg_color; }
665
}
666
// utilities stack switcher
668
ideeditorutilities > dzldockpaned > box > stackswitcher {
669
padding: 8px 0;
670
background-color: $bg_color;
671
&:dir(ltr) { border-right: 1px solid $border_color; }
673
&:dir(rtl) { border-left: 1px solid $border_color; }
675
button {
677
border-radius: 0;
678
outline-offset: -6px;
679
box-shadow: none;
680
background-color: transparent;
681
&:active {
683
background-image: radial-gradient(circle farthest-corner at center,
684
rgba($primary_color, 0.7) 10%,
685
transparent 0%);
686
}
687
&:checked {
689
background-color: transparent;
690
color: $fg_color;
691
}
692
&:dir(ltr) {
694
margin-right: -1px;
695
&:hover { box-shadow: inset -2px 0 $track_color; }
697
&:active,
699
&:checked { box-shadow: inset -2px 0 $primary_color; }
700
}
701
&:dir(rtl) {
703
margin-left: -1px;
704
&:hover { box-shadow: inset 2px 0 $track_color; }
706
&:active,
708
&:checked { box-shadow: inset 2px 0 $primary_color; }
709
}
710
}
711
}
712
// buildui panel
714
ideeditorsidebar notebook header {
715
background: transparent;
716
}
717
popover.messagepopover {
719
// padding: 0;
720
list {
722
border: 1px solid $border_color;
723
row:not(:last-child) { border-bottom: 1px solid $border_color; }
725
}
726
}
727
/**********
730
* Photos *
731
**********/
732
// based css:
733
// https://gitlab.gnome.org/GNOME/gnome-photos/blob/master/data/Adwaita.css
734
GdMainIconView.content-view {
736
-GdMainIconView-icon-size: 48;
737
// Make spinner visible on both dark and bright backgrounds w/o making
739
// it look ugly/weird.
740
// &.cell:active { color: $hint_fg_color; }
741
}
742
.documents-counter {
744
margin: 8px;
745
border-radius: $circular_radius;
746
box-shadow: $shadow_2;
747
background-color: $secondary_color;
748
color: $inverse_fg_color;
749
font-weight: bold;
750
}
751
.photos-entry-tag {
753
@extend .entry-tag;
754
}
755
.documents-scrolledwin.frame {
757
border-style: none;
758
frame.content-view > border { border-style: none; }
760
}
761
.photos-icon-bg {
763
}
764
.photos-fade-in {
766
opacity: 1;
767
transition: opacity $shorter_duration $deceleration_curve;
768
}
769
.photos-fade-out {
771
opacity: 0;
772
transition: opacity $shorter_duration $deceleration_curve;
773
}
774
.photos-collection-icon {
776
}
777
overlay grid.horizontal > revealer > scrolledwindow.frame {
779
&:dir(ltr) { border-style: none none none solid; }
780
&:dir(rtl) { border-style: none solid none none; }
781
}
782
/*********
785
* Music *
786
*********/
787
// hard-coded css:
788
// https://gitlab.gnome.org/GNOME/gnome-music/blob/master/data/application.css
789
.side-panel:dir(ltr) {
791
// border-width: 0 1px 0 0;
792
border-style: solid;
793
border-color: $border_color;
794
}
795
.side-panel:dir(rtl) {
797
// border-width: 0 0 0 1px;
798
border-style: solid;
799
border-color: $border_color;
800
}
801
.side-panel .view {
803
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
804
background-image: image($alt_base_color);
805
&:hover { background-image: image(mix($fg_color, $alt_base_color, percentage(0.05))); }
807
}
808
.side-panel .view:selected {
810
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
811
background-image: image($primary_color);
812
&:hover { background-image: image(mix($inverse_fg_color, $primary_color, percentage(0.05))); }
814
}
815
.songs-list {
817
// box-shadow: inset 0 -1px shade(@borders, 1.30);
818
// background-color: @theme_bg_color;
819
&:hover { background-image: image($row_fill_color); }
821
}
822
frame.documents-dropdown {
824
@extend toolbar.osd;
825
margin: 8px;
827
> border { border: none; }
829
}
830
box.vertical > revealer > toolbar.search-bar {
832
border-bottom: 1px solid $border_color;
833
background-clip: border-box; // avoid black border
834
button > widget {
836
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
837
// -GtkArrow-arrow-scaling: 1;
838
}
839
}
840
/*********
843
* To Do *
844
*********/
845
// less than 3.28
846
task-list-view {
847
taskrow {
848
transition: $shorter_transition;
849
margin: 0 -8px;
850
&:hover { transition: none; }
852
label { margin: 0 8px; }
854
image.dim-label { min-width: 16px; }
856
}
857
> box > revealer > box > button {
859
margin: (12px * 2 - $medium_size) / 2;
860
.dim-label { opacity: 1; }
862
}
863
}
864
// 3.28 or later
866
tasklistview {
867
taskrow {
868
outline: none;
869
entry {
871
&, &:focus, &:disabled { box-shadow: none; }
872
}
873
image.dim-label { min-width: 16px; }
875
}
876
> box > revealer > box > button {
878
margin: (12px * 2 - $medium_size) / 2;
879
.dim-label { opacity: 1; }
881
}
882
}
883
/*******
886
* eog *
887
*******/
888
#eog-thumb-nav {
889
scrolledwindow { border-top: none; }
890
button { -gtk-outline-radius: $material_radius; }
892
}
893
/*************
896
* Evolution *
897
*************/
898
frame.taskbar > border { border-style: solid none none; }
899
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
901
/********
904
* gitg *
905
********/
906
frame.commit-frame > border { border-style: solid none none; }
907
/**************
910
* Characters *
911
**************/
912
box.dialog-vbox scrolledwindow.related { border: 1px solid $border_color; }
913
list.categories { background-image: image($alt_base_color); }
915
/*********
918
* Boxes *
919
*********/
920
.transparent-bg + stack overlay > label {
921
min-height: 24px;
922
padding: 0 4px;
923
border-radius: $material_radius;
924
background-color: $panel_bg_color;
925
color: $inverse_fg_color;
926
}
927
/**************
930
* Calculator *
931
**************/
932
button.title label { min-height: $medium_size; }
933
/*********
936
* Geary *
937
*********/
938
// fix a issue that separator seems double
939
.geary-titlebar-left {
940
&:dir(ltr) {
941
margin-right: 5px;
942
padding-right: 0;
943
}
944
&:dir(rtl) {
946
margin-left: 5px;
947
padding-left: 0;
948
}
949
> separator { background-color: rgba(black, 0.05); }
951
}
952
.geary-titlebar-right {
954
&:dir(ltr) { margin-left: -5px; }
955
&:dir(rtl) { margin-right: -5px; }
957
}
958