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
}
23
.nautilus-desktop.nautilus-canvas-item {
25
// background-color: $panel_bg_color;
26
color: $inverse_fg_color;
27
text-shadow: $shadow_1;
28
}
29
// Toolbar
31
@keyframes needs_attention_keyframes {
33
to { background-color: $focus_overlay_color; }
34
}
35
.nautilus-operations-button-needs-attention {
37
animation: needs_attention_keyframes $longer_duration $standard_curve 2 alternate;
38
}
39
.nautilus-operations-button-needs-attention-multiple {
41
animation: needs_attention_keyframes $longer_duration $standard_curve 4 alternate;
42
}
43
.disclosure-button { @extend %circular_button; }
45
// Path bar
47
.nautilus-window .path-bar button {
49
label:not(:only-child) {
50
&:first-child { margin-left: 0; }
51
&:last-child { margin-right: 0; }
53
}
54
}
55
.path-bar-box {
57
// transition: background-color $shorter_duration $deceleration_curve;
58
// margin: $container_padding 0;
59
// border-radius: $material_radius;
60
// button { margin: 0; } // reset the margin
62
// &.width-maximized { background-color: rgba($titlebar_fg_color, 0.06); }
64
// workaround for 3.30.1
66
&.background.frame {
67
border-style: none;
68
background-color: transparent;
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_color;
79
border-radius: ($material_radius + 1px) ($material_radius + 1px) 0 0;
80
background-color: rgba($base_color, 0.9);
81
background-clip: $extra_background_clip;
82
transition: $shorter_transition, border-width 0;
83
&.bottom.left { // axes left border and border radius
85
margin-right: 8px - 1px;
86
border-left-style: none;
87
border-top-left-radius: 0;
88
}
89
&.bottom.right { // axes right border and border radius
91
margin-left: 8px - 1px;
92
border-right-style: none;
93
border-top-right-radius: 0;
94
}
95
button {
97
margin: (32px - $small_size) / 2;
98
@extend %small_button;
100
}
101
}
102
.disk-space-display {
104
// border-style: solid;
105
// border-width: 2px;
106
&.unknown {
108
background-color: $track_color;
109
color: $track_color;
110
}
111
&.used {
113
background-color: $primary_color;
114
color: $primary_color;
115
}
116
&.free {
118
background-color: $divider_color;
119
color: $divider_color;
120
}
121
}
122
// View
124
// Hide superfluous treeview drop target indication
125
.nautilus-list-view .view:not(.dnd) {
126
// border-bottom: 1px solid $border_color;
127
}
128
.search-information {
130
padding: 2px;
131
background-color: $primary_color;
132
color: $inverse_fg_color;
133
}
134
.documents-entry-tag {
136
@extend .entry-tag;
137
}
138
.conflict-row:not(:selected) { background-color: mix($warning_color, $base_color, 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: $material_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_color;
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: $secondary_fg_color; }
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: $bg_color; }
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: $secondary_fg_color;
221
font-size: smaller;
222
}
223
.gedit-document-panel {
225
background-color: $alt_base_color;
226
// Try to look as the notebook tab close button
228
row button.flat {
229
margin-top: 8px;
230
margin-bottom: 8px;
231
@extend %small_button;
233
}
234
}
235
.gedit-document-panel-group-row:not(:first-child) {
237
border-top: 1px solid $border_color;
238
}
239
.gedit-side-panel-paned statusbar {
241
border-top: 1px solid $border_color;
242
}
243
.gedit-search-slider {
245
margin: 4px 4px 8px;
246
.linked:not(.vertical) > entry {
248
border-radius: $material_radius;
249
@extend %entry_raised;
250
.gedit-search-entry-occurrences-tag {
252
all: unset;
253
color: $secondary_fg_color;
254
}
255
$buttons_width: $small_size * 2 + $container_padding * 3;
257
&:dir(ltr) {
259
margin-right: -$buttons_width;
260
padding-right: $buttons_width;
261
.gedit-search-entry-occurrences-tag { margin-left: $container_padding; }
263
image.right { margin-right: 0; }
265
}
266
&:dir(rtl) {
268
margin-left: -$buttons_width;
269
padding-left: $buttons_width;
270
.gedit-search-entry-occurrences-tag { margin-right: $container_padding; }
272
image.left { margin-left: 0; }
274
}
275
&:not(.error) { background-color: $surface_color; }
277
&.error ~ button {
279
color: $inverse_secondary_fg_color;
280
&:hover, &:active { color: $inverse_fg_color; }
282
&:disabled { color: $inverse_disabled_secondary_fg_color; }
284
}
285
}
286
.linked > button {
288
border: solid $container_padding transparent;
289
border-radius: $circular_radius;
290
@extend %simple_flat_button;
292
@extend %small_button;
293
&:last-child:dir(ltr),
295
&:not(:first-child):dir(rtl) { margin-left: -$container_padding / 2; }
296
&:first-child:dir(rtl),
298
&:not(:last-child):dir(ltr) { margin-right: -$container_padding / 2; }
299
}
300
}
301
frame.gedit-map-frame > border {
303
&:dir(ltr) { border-style: none none none solid; }
304
&:dir(rtl) { border-style: none solid none none; }
305
}
306
/**********
309
* Tweaks *
310
**********/
311
// hard-coded css:
312
// https://gitlab.gnome.org/GNOME/gnome-tweaks/blob/master/data/shell.css
313
// the sidebar
315
.tweak-categories {
316
// padding: 4px 0;
317
// background-color: shade(@theme_bg_color, 0.99);
318
background-image: image($alt_base_color);
319
separator { @extend %hide_separators; }
321
}
322
.tweak {
324
// padding-top: 3px;
325
padding: 3px;
326
&.title:hover { box-shadow: none; }
328
}
329
.tweak-group-white,
331
.tweak-white,
332
.tweak-white:hover {
333
// background-color: white;
334
background-image: image($base_color);
335
}
336
.tweak-startup,
338
.tweak-startup:hover {
339
// background-color: lighter(shade(@theme_bg_color, 0.9));
340
background-image: image($base_color);
341
}
342
.tweak-group-startup {
344
// background-color: @view_separators;
345
background-image: image($base_color);
346
border: 1px solid $border_color;
347
}
348
//
350
// Workaround for 3.26
351
//
352
row#Focus,
354
row#ClickMethod,
355
row#StaticWorkspaceTweak, // for 3.26.0
356
row#dynamic-workspaces,
357
row#PrimaryWorkspaceTweak, // for 3.26.0
358
row#workspaces-only-on-primary {
359
padding: 0;
360
border: 1px solid $border_color;
361
row:not(:last-child) { border-bottom: 1px solid $border_color; }
363
&.tweak > list { margin-top: -3px; }
365
}
366
// Add more spaces between title and list
368
row#Focus,
369
row#ClickMethod,
370
row#PrimaryWorkspaceTweak, // for 3.26.0
371
row#workspaces-only-on-primary {
372
margin-top: 4px;
373
}
374
/***********
377
* Builder *
378
***********/
379
// based css for 3.22:
380
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-22/data/theme
381
// based css for 3.24:
382
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-24/data/theme
383
// based css for 3.26:
384
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-26/data/themes
385
// Layout tab and tab bar tweaks
387
// The following makes the layout stack header look similar to a tab bar.
388
layouttabbar {
389
border-bottom: 1px solid $border_color;
390
background-color: $bg_color;
391
button { @extend %flat_button; }
393
> box > button {
395
margin: (40px - $medium_size) / 2 0;
396
// border-radius: 0;
397
}
398
}
399
layouttab {
401
margin: 0 8px; // not working
402
border-style: none solid;
403
border-width: 1px;
404
border-color: $border_color;
405
box-shadow: inset 0 -2px $primary_color;
406
background-color: $base_color;
407
separator.vertical { margin: 8px 4px; }
409
button {
411
&.text-button, &.image-button, & {
412
margin-top: 8px;
413
margin-bottom: 8px;
414
padding: 0 4px;
415
}
416
}
417
// Close button styling for layouttab.
419
// > box > button.close { @extend %circular_button; }
420
}
421
layout {
423
border: 1px solid $border_color;
424
-PnlDockBin-handle-size: 1;
425
}
426
entry.search-missing {
428
background-color: $error_color;
429
color: $inverse_fg_color;
430
}
431
// tweak icons for treeviews
433
window.workbench treeview.image {
434
color: $secondary_fg_color;
435
}
436
popover.popover-selector list {
438
padding: 8px - 2px;
439
row {
441
border-radius: $material_radius;
442
image {
444
&:dir(ltr) { margin-right: 6px; }
445
&:dir(rtl) { margin-left: 6px; }
446
}
447
.accel {
449
&:dir(ltr) { margin-left: 6px; }
450
&:dir(rtl) { margin-right: 6px; }
451
}
452
}
453
}
454
omnibar {
456
&.linked:not(.vertical) entry { border-radius: $material_radius; }
457
&:not(:hover):not(:active) entry { color: $secondary_fg_color; }
459
}
460
popover.omnibar list row:not(:last-child) {
462
border-bottom: 1px solid $border_color;
463
}
464
entry.preferences-search {
466
@extend %entry.flat;
467
box-shadow: inset 0 -1px $border_color;
469
background-color: $base_color;
470
// doesn't work properly
472
// &:dir(ltr) { border-right: 1px solid $border_color; }
473
// &:dir(rtl) { border-left: 1px solid $border_color; }
474
}
475
preferences stacksidebar.sidebar {
477
list { background-color: $alt_base_color; }
478
&:dir(ltr),
480
&:dir(rtl) { list { border-style: none; }}
481
list separator { @extend %hide_separators; }
483
}
484
preferences > box > box {
486
&:dir(ltr) { border-right: 1px solid $border_color; }
487
&:dir(rtl) { border-left: 1px solid $border_color; }
488
}
489
popover.messagepopover {
491
&.background { padding: 0; }
492
.popover-action-area button {
494
@extend %simple_flat_button;
495
padding: 8px 16px;
497
border-top: 1px solid $border_color;
498
border-radius: 0;
499
&:first-child { border-bottom-left-radius: $material_radius; }
501
&:last-child { border-bottom-right-radius: $material_radius; }
503
}
504
.popover-content-area { margin: 16px; }
506
}
507
popover.transfers list {
509
background-color: transparent;
510
row:not(:first-child) { border-top: 1px solid $border_color; }
512
row > box { padding: 10px; }
514
}
515
dockbin {
517
border: 1px solid $border_color;
518
-PnlDockBin-handle-size: 1;
519
}
520
dockpaned {
522
border: 1px solid $border_color;
523
}
524
eggsearchbar box.search-bar {
526
padding: 0 8px;
527
border-bottom: 1px solid $border_color;
528
background-color: $bg_color;
529
}
530
docktabstrip {
532
padding: 0 8px;
533
border-bottom: 1px solid $border_color;
534
background-color: $bg_color;
535
}
536
docktab {
538
transition: $shorter_transition,
539
background-size 0,
540
background-image 0;
541
min-height: $small_size;
542
min-width: $small_size;
543
margin-bottom: -1px;
544
padding: $container_padding 6px;
545
outline-offset: -6px;
547
border-width: 1px; // for reorderable tabs
549
border-color: transparent; //
550
box-shadow: inset 0 -2px transparent;
552
background-image: radial-gradient(circle farthest-corner at center,
553
$primary_color 10%,
554
transparent 0%);
555
background-repeat: no-repeat;
556
background-position: center;
557
background-size: 0% 0%;
558
color: $secondary_fg_color;
560
font-weight: 500;
561
&:hover {
563
background-color: $hover_overlay_color;
564
color: $fg_color;
565
}
566
&:checked {
568
transition: $shorter_transition,
569
background-size $longer_duration $deceleration_curve,
570
background-image $longer_duration + $ripple_duration $deceleration_curve;
571
box-shadow: inset 0 -2px $primary_color;
572
background-color: transparent;
573
background-image: radial-gradient(circle farthest-corner at center,
574
transparent 10%,
575
transparent 0%);
576
background-size: 1000% 1000%;
577
color: $fg_color;
578
}
579
}
580
dockoverlayedge {
582
background-color: $bg_color;
583
docktabstrip {
585
padding: 0;
586
border: none;
587
}
588
&.left-edge docktab {
590
&:hover { box-shadow: inset -2px 0 $track_color; }
591
&:checked { box-shadow: inset -2px 0 $primary_color; }
592
}
593
&.right-edge docktab {
595
&:hover { box-shadow: inset 2px 0 $track_color; }
596
&:checked { box-shadow: inset 2px 0 $primary_color; }
597
}
598
}
599
pillbox {
601
background-color: $bg_color;
602
border-radius: $material_radius;
603
}
604
buildperspective row {
606
// padding: 10px;
607
}
608
layoutpane entry.search {
610
@extend %entry.flat;
611
box-shadow: inset 0 -1px $border_color;
613
background-color: $base_color;
614
}
615
editortweak entry.search {
617
@extend %entry.flat;
618
margin-bottom: -1px;
620
box-shadow: none;
621
}
622
//
624
// let's tweak hard-coded elements
625
//
626
.gb-search-entry-occurrences-tag {
628
box-shadow: none;
629
background-color: transparent;
630
}
631
// Keep search bar and layouttab height in sync.
633
// layouttabbar > box,
634
// eggsearchbar > revealer > box,
635
docktabstrip {
636
min-height: 39px;
637
}
638
eggsearchbar entry {
640
// min-height: 24px;
641
}
642
window.workbench preferences preferencesgroup list entry {
644
// background: none;
645
// min-height: 0px;
646
padding-top: 8px;
647
padding-bottom: 8px;
648
}
649
button.run-arrow-button {
651
// min-width: 12px;
652
padding-left: ($medium_size - 16px) / 2;
653
padding-right: ($medium_size - 16px) / 2;
654
}
655
//
657
// Additional styles for 3.26
658
//
659
button.dzlmenubutton image {
661
min-width: $medium_size - 6px;
662
&.arrow { min-width: $medium_size - 9px; }
664
}
665
button.dzlmenubuttonitem {
667
color: $fg_color;
668
font-weight: normal;
669
&:disabled { color: $disabled_fg_color; }
671
}
672
idelayoutstackheader {
674
border-bottom: 1px solid $border_color;
675
button:checked { color: $fg_color; }
677
}
678
// utilities stack switcher
680
ideeditorutilities > dzldockpaned > box > stackswitcher {
681
padding: 8px 0;
682
background-color: $bg_color;
683
&:dir(ltr) { border-right: 1px solid $border_color; }
685
&:dir(rtl) { border-left: 1px solid $border_color; }
687
button {
689
border-radius: 0;
690
outline-offset: -6px;
691
box-shadow: none;
692
background-color: transparent;
693
&:active {
695
background-image: radial-gradient(circle farthest-corner at center,
696
rgba($primary_color, 0.7) 10%,
697
transparent 0%);
698
}
699
&:checked {
701
background-color: transparent;
702
color: $fg_color;
703
}
704
&:dir(ltr) {
706
margin-right: -1px;
707
&:hover { box-shadow: inset -2px 0 $track_color; }
709
&:active,
711
&:checked { box-shadow: inset -2px 0 $primary_color; }
712
}
713
&:dir(rtl) {
715
margin-left: -1px;
716
&:hover { box-shadow: inset 2px 0 $track_color; }
718
&:active,
720
&:checked { box-shadow: inset 2px 0 $primary_color; }
721
}
722
}
723
}
724
// buildui panel
726
ideeditorsidebar notebook header {
727
background: transparent;
728
}
729
popover.messagepopover {
731
// padding: 0;
732
list {
734
border: 1px solid $border_color;
735
row:not(:last-child) { border-bottom: 1px solid $border_color; }
737
}
738
}
739
/**********
742
* Photos *
743
**********/
744
// based css:
745
// https://gitlab.gnome.org/GNOME/gnome-photos/blob/master/data/Adwaita.css
746
GdMainIconView.content-view {
748
-GdMainIconView-icon-size: 48;
749
// Make spinner visible on both dark and bright backgrounds w/o making
751
// it look ugly/weird.
752
// &.cell:active { color: $disabled_fg_color; }
753
}
754
.documents-counter {
756
margin: 8px;
757
border-radius: $circular_radius;
758
box-shadow: $shadow_2;
759
background-color: $primary_color;
760
color: $inverse_fg_color;
761
font-weight: bold;
762
}
763
.photos-entry-tag {
765
@extend .entry-tag;
766
}
767
.documents-scrolledwin.frame {
769
border-style: none;
770
frame.content-view > border { border-style: none; }
772
}
773
.photos-icon-bg {
775
}
776
.photos-fade-in {
778
opacity: 1;
779
transition: opacity $shorter_duration $deceleration_curve;
780
}
781
.photos-fade-out {
783
opacity: 0;
784
transition: opacity $shorter_duration $deceleration_curve;
785
}
786
.photos-collection-icon {
788
}
789
overlay grid.horizontal > revealer > scrolledwindow.frame {
791
&:dir(ltr) { border-style: none none none solid; }
792
&:dir(rtl) { border-style: none solid none none; }
793
}
794
/*********
797
* Music *
798
*********/
799
// hard-coded css:
800
// https://gitlab.gnome.org/GNOME/gnome-music/blob/master/data/application.css
801
.side-panel:dir(ltr) {
803
// border-width: 0 1px 0 0;
804
border-style: solid;
805
border-color: $border_color;
806
}
807
.side-panel:dir(rtl) {
809
// border-width: 0 0 0 1px;
810
border-style: solid;
811
border-color: $border_color;
812
}
813
.side-panel .view {
815
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
816
background-image: image($alt_base_color);
817
&:hover { background-image: image(mix($fg_color, $alt_base_color, percentage(0.05))); }
819
}
820
.side-panel .view:selected {
822
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
823
background-image: image($primary_color);
824
&:hover { background-image: image(mix($inverse_fg_color, $primary_color, percentage(0.05))); }
826
}
827
.songs-list {
829
// box-shadow: inset 0 -1px shade(@borders, 1.30);
830
// background-color: @theme_bg_color;
831
&:hover { background-image: image($hover_overlay_color); }
833
}
834
frame.documents-dropdown {
836
@extend toolbar.osd;
837
margin: 8px;
839
> border { border: none; }
841
}
842
box.vertical > revealer > toolbar.search-bar {
844
border-bottom: 1px solid $border_color;
845
background-clip: border-box; // avoid black border
846
button > widget {
848
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
849
// -GtkArrow-arrow-scaling: 1;
850
}
851
}
852
/*********
855
* To Do *
856
*********/
857
// less than 3.28
858
task-list-view {
859
taskrow {
860
transition: $shorter_transition;
861
margin: 0 -8px;
862
&:hover { transition: none; }
864
label { margin: 0 8px; }
866
image.dim-label { min-width: 16px; }
868
}
869
> box > revealer > box > button {
871
margin: (12px * 2 - $medium_size) / 2;
872
.dim-label { opacity: 1; }
874
}
875
}
876
// 3.28 or later
878
tasklistview {
879
taskrow {
880
outline: none;
881
entry {
883
&, &:focus, &:disabled { box-shadow: none; }
884
}
885
image.dim-label { min-width: 16px; }
887
}
888
> box > revealer > box > button {
890
margin: (12px * 2 - $medium_size) / 2;
891
.dim-label { opacity: 1; }
893
}
894
}
895
/*******
898
* eog *
899
*******/
900
#eog-thumb-nav {
901
scrolledwindow { border-top: none; }
902
button { -gtk-outline-radius: $material_radius; }
904
}
905
/*************
908
* Evolution *
909
*************/
910
frame.taskbar > border { border-style: solid none none; }
911
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
913
/********
916
* gitg *
917
********/
918
frame.commit-frame > border { border-style: solid none none; }
919
/**************
922
* Characters *
923
**************/
924
box.dialog-vbox scrolledwindow.related { border: 1px solid $border_color; }
925
list.categories { background-image: image($alt_base_color); }
927
/*********
930
* Boxes *
931
*********/
932
.transparent-bg + stack overlay > label {
933
min-height: 24px;
934
padding: 0 4px;
935
border-radius: $material_radius;
936
background-color: $panel_bg_color;
937
color: $inverse_fg_color;
938
}
939
/**************
942
* Calculator *
943
**************/
944
button.title label { min-height: $medium_size; }
945
/*********
948
* Geary *
949
*********/
950
// fix a issue that separator seems double
951
.geary-titlebar-left {
952
&:dir(ltr) {
953
margin-right: 5px;
954
padding-right: 0;
955
}
956
&:dir(rtl) {
958
margin-left: 5px;
959
padding-left: 0;
960
}
961
> separator { background-color: rgba(black, 0.05); }
963
}
964
.geary-titlebar-right {
966
&:dir(ltr) { margin-left: -5px; }
967
&:dir(rtl) { margin-right: -5px; }
969
}
970