ASCII text
1
@use "sass:color";
2
@use "sass:math";
3
@use "../../../theme";
4
@use "../../../theme-color";
5
@use "../../../shadow";
6
@use "../common";
7
@use "../drawing";
8
/**
10
* Nautilus
11
*/
12
// Based on:
14
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/Adwaita.css
15
// The hard-coded CSS:
16
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/nautilus.css
17
.nautilus-window,
19
.nautilus-window notebook,
20
.nautilus-window notebook > stack {
21
// background-color: $surface-z0;
22
}
23
.nautilus-canvas-item {
25
// border-radius: $corner-radius;
26
}
27
.nautilus-canvas-item.dim-label,
29
.nautilus-list-dim-label {
30
color: theme-color.hint(theme-color.$on-surface);
31
}
32
.nautilus-desktop.nautilus-canvas-item {
34
@extend %iconview-desktop;
35
}
36
// Toolbar
38
@keyframes nautilus-operations-button-needs-attention {
40
to {
41
background-color: theme-color.focus-overlay(theme-color.$on-titlebar);
42
}
43
}
44
.nautilus-operations-button-needs-attention {
46
animation: nautilus-operations-button-needs-attention theme.$ripple-fade-out-duration theme.$ease 2 alternate;
47
}
48
.nautilus-operations-button-needs-attention-multiple {
50
animation: nautilus-operations-button-needs-attention theme.$ripple-fade-out-duration theme.$ease 6 alternate;
51
}
52
.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):not(:only-child).disclosure-button {
54
border-radius: theme.$circular-radius;
55
}
56
// Path bar
58
.path-bar-box {
60
transition: background-color theme.$state-duration theme.$ease-out;
61
margin: theme.$container-padding 0;
62
border-radius: theme.$corner-radius;
63
// reset the margin
65
button {
66
margin: 0;
67
}
68
&.width-maximized {
70
background-color: theme-color.entry-fill(theme-color.$on-titlebar);
71
}
72
// workaround for 3.30.1
74
&.background.frame {
75
border-style: none;
76
background-color: theme-color.entry-fill(theme-color.$on-titlebar);
77
}
78
// for 3.30
80
.path-bar button {
81
label:not(:only-child) {
82
&:first-child {
83
margin-left: 0;
84
}
85
&:last-child {
87
margin-right: 0;
88
}
89
}
90
}
91
// for 3.32
93
.nautilus-path-bar button:not(.suggested-action):not(.destructive-action) {
94
padding-left: (theme.$medium-size - 24px) / 2;
95
padding-right: (theme.$medium-size - 24px) / 2;
96
&.text-button {
98
min-width: 0;
99
}
100
label:not(:only-child) {
102
&:first-child {
103
margin-left: 0;
104
}
105
&:last-child {
107
margin-right: 0;
108
}
109
}
110
&.text-button.image-button image:not(:only-child) {
112
margin: 0;
113
}
114
&:last-child:dir(ltr),
116
&:first-child:dir(rtl) {
117
@extend %titlebar-button-checked;
118
}
119
}
120
}
121
// Floating status bar
123
.nautilus-window .floating-bar {
124
min-height: 32px;
125
padding: 0;
126
border-style: solid solid none;
127
border-width: 1px;
128
border-color: theme-color.divider(theme-color.$on-surface);
129
border-radius: (theme.$corner-radius + 1px) (theme.$corner-radius + 1px) 0 0;
130
background-clip: padding-box;
131
background-color: theme-color.$surface-z8;
132
// axes left border and border radius
134
&.bottom.left {
135
margin-right: 8px - 1px;
136
border-left-style: none;
137
border-top-left-radius: 0;
138
}
139
// axes right border and border radius
141
&.bottom.right {
142
margin-left: 8px - 1px;
143
border-right-style: none;
144
border-top-right-radius: 0;
145
}
146
button {
148
margin: (32px - theme.$small-size) / 2;
149
@extend %button-small;
151
}
152
}
153
.disk-space-display {
155
// border-style: solid;
156
// border-width: 2px;
157
&.unknown {
159
background-color: theme-color.stroke(theme-color.$on-surface);
160
color: theme-color.stroke(theme-color.$on-surface);
161
}
162
&.used {
164
background-color: theme-color.$primary;
165
color: theme-color.$primary;
166
}
167
&.free {
169
background-color: theme-color.fill(theme-color.$on-surface);
170
color: theme-color.fill(theme-color.$on-surface);
171
}
172
}
173
// View
175
// Hide superfluous treeview drop target indication
177
.nautilus-list-view .view:not(.dnd) {
178
// border-bottom: 1px solid divider($on-surface);
179
}
180
.nautilus-empty-state-icon + .large-title {
182
@extend .title-1;
183
color: theme-color.hint(theme-color.$on-surface);
184
}
185
.search-information {
187
padding: 2px;
188
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
189
}
190
.documents-entry-tag {
192
@extend .entry-tag;
193
}
194
.conflict-row:not(:selected) {
196
background-color: color.mix(theme-color.$warning, theme-color.$surface-z1, math.percentage(.3));
197
}
198
// Icon view
200
.nautilus-window flowboxchild {
201
.icon-background {
202
// background-color: black;
203
}
204
.icon-item-background {
206
padding: 4px;
207
border-radius: theme.$corner-radius;
208
}
209
&:selected {
211
background-color: transparent;
212
.icon-item-background {
214
background-color: theme-color.$selected-overlay;
215
}
216
}
217
}
218
// Batch rename dialog
220
dialog.background > box.dialog-vbox.vertical > grid.horizontal {
221
> scrolledwindow.frame {
222
border-style: none;
223
}
224
> box.horizontal:last-child {
226
margin: -6px 0 0 -6px;
227
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
228
> label {
230
margin: 0 8px;
231
}
232
> box > button {
234
border-radius: 0;
235
}
236
}
237
}
238
// Tweak to fix the messy sizing of the popover menu
240
.nautilus-window > popover.menu:not(:last-child) {
241
padding: 3px;
242
> stack > box > box > box {
244
margin-top: -6px;
245
> box {
247
margin-bottom: -6px;
248
&.linked {
250
margin-top: 1px;
251
}
252
}
253
}
254
separator {
256
margin-bottom: -2px;
257
}
258
}
259
.nautilus-menu-sort-heading {
261
// min-height: 26px;
262
// padding-left: 5px;
263
// padding-right: 5px;
264
margin: 1px 3px;
265
font-weight: 500;
266
&:disabled {
268
color: theme-color.hint(theme-color.$on-surface);
269
}
270
}
271
// Make operations button circular
273
.nautilus-window headerbar revealer > button {
274
border-radius: theme.$circular-radius;
275
}
276
// Ensure paned separator rendering. See issue #84 for details.
278
.nautilus-window paned > separator {
279
background-color: theme-color.$surface-z0;
280
}
281
/**
284
* gedit
285
*/
286
// Based on:
288
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit.adwaita.css
289
// The hard-coded CSS:
290
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit-style.css
291
// Only normal state is handle
293
.open-document-selector-name-label {
294
// font-weight: bold;
295
}
296
// Only normal state is handle
298
.open-document-selector-path-label {
299
color: theme-color.hint(theme-color.$on-surface);
300
font-size: smaller;
301
}
302
// Only normal state is handle
304
.open-document-selector-match {
305
background-color: theme-color.$warning;
306
color: theme-color.$on-warning;
307
}
308
.gedit-document-panel {
310
// Try to look as the notebook tab close button
311
row button.flat {
312
margin-top: 8px;
313
margin-bottom: 8px;
314
@extend %button-small;
316
}
317
}
318
.gedit-document-panel-group-row:not(:first-child) {
320
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
321
}
322
.gedit-side-panel-paned statusbar {
324
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
325
}
326
.gedit-search-slider {
328
margin: 4px 4px 8px;
329
.linked:not(.vertical) > entry {
331
border-radius: theme.$corner-radius;
332
@extend %entry_raised;
333
.gedit-search-entry-occurrences-tag {
335
all: unset;
336
color: theme-color.hint(theme-color.$on-surface);
337
}
338
$buttons_width: theme.$small-size * 2 + theme.$container-padding * 3;
340
&:dir(ltr) {
342
margin-right: -$buttons_width;
343
padding-right: $buttons_width;
344
.gedit-search-entry-occurrences-tag {
346
margin-left: theme.$container-padding;
347
}
348
image.right {
350
margin-right: 0;
351
}
352
}
353
&:dir(rtl) {
355
margin-left: -$buttons_width;
356
padding-left: $buttons_width;
357
.gedit-search-entry-occurrences-tag {
359
margin-right: theme.$container-padding;
360
}
361
image.left {
363
margin-left: 0;
364
}
365
}
366
&:not(.error) {
368
background-color: theme-color.$surface-z8;
369
}
370
&.error ~ button {
372
color: theme-color.hint(theme-color.$on-error);
373
@include drawing.ink-color(theme-color.$on-error, $button-style: "flat");
374
&:disabled {
376
color: theme-color.disabled-hint(theme-color.$on-error);
377
}
378
}
379
}
380
.linked:not(.vertical) > button {
382
border: solid theme.$container-padding transparent;
383
border-radius: theme.$circular-radius;
384
background-clip: padding-box;
385
@extend %button-flat-basic;
387
@extend %button-small;
388
&:last-child:dir(ltr),
390
&:not(:first-child):dir(rtl) {
391
margin-left: -(theme.$container-padding) / 2;
392
}
393
&:first-child:dir(rtl),
395
&:not(:last-child):dir(ltr) {
396
margin-right: -(theme.$container-padding) / 2;
397
}
398
}
399
}
400
frame.gedit-map-frame > border {
402
&:dir(ltr) {
403
border-style: none none none solid;
404
}
405
&:dir(rtl) {
407
border-style: none solid none none;
408
}
409
}
410
/**
412
* Tweaks
413
*/
414
// The hard-coded CSS:
416
// https://gitlab.gnome.org/GNOME/gnome-tweaks/blob/master/data/shell.css
417
// the sidebar
419
.tweak-categories {
420
// padding: 4px 0;
421
// background-color: shade(@theme_bg_color, 0.99);
422
background-image: image(theme-color.$surface-z0);
423
separator {
425
@extend %hide_separators;
426
}
427
}
428
.tweak {
430
// padding-top: 3px;
431
padding: 3px;
432
&.title:hover {
434
box-shadow: none;
435
}
436
}
437
.tweak-group-white,
439
.tweak-white,
440
.tweak-white:hover {
441
// background-color: white;
442
background-image: image(theme-color.$surface-z1);
443
}
444
.tweak-startup,
446
.tweak-startup:hover {
447
// background-color: lighter(shade(@theme_bg_color, 0.9));
448
background-image: image(theme-color.$surface-z1);
449
}
450
.tweak-group-startup {
452
border: 1px solid theme-color.divider(theme-color.$on-surface);
453
background-clip: padding-box;
454
// background-color: @view_separators;
455
background-image: image(theme-color.$surface-z1);
456
}
457
//
459
// Workaround for 3.26
460
//
461
row#Focus,
463
row#ClickMethod,
464
row#StaticWorkspaceTweak, // for 3.26.0
465
row#dynamic-workspaces,
466
row#PrimaryWorkspaceTweak, // for 3.26.0
467
row#workspaces-only-on-primary {
468
padding: 0;
469
border: 1px solid theme-color.divider(theme-color.$on-surface);
470
background-clip: padding-box;
471
background-image: image(theme-color.$surface-z1);
472
row:not(:last-child) {
474
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
475
}
476
&.tweak > list {
478
margin-top: -3px;
479
}
480
}
481
// Add more spaces between title and list
483
row#Focus,
484
row#ClickMethod,
485
row#PrimaryWorkspaceTweak, // for 3.26.0
486
row#workspaces-only-on-primary {
487
margin-top: 4px;
488
}
489
// Workaround for gnome-tweaks >= 3.34
491
// See https://github.com/nana-4/materia-theme/issues/432
492
leaflet.titlebar > .titlebar.tweak-titlebar-left,
493
leaflet.titlebar > .titlebar.tweak-titlebar-right,
494
hdyleaflet.titlebar > .titlebar.tweak-titlebar-left,
495
hdyleaflet.titlebar > .titlebar.tweak-titlebar-right {
496
background-color: inherit;
497
box-shadow: inherit;
498
// Remove only background-color transition.
499
// This shouldn't be necessary, but otherwise it gets lag...
500
transition: color theme.$state-duration theme.$ease-out;
501
+ separator {
503
background-color: inherit;
504
background-image: image(theme-color.divider(theme-color.$on-titlebar));
505
}
506
}
507
/**
509
* Builder
510
*/
511
// Based on (3.22):
513
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-22/data/theme
514
// Based on (3.24):
515
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-24/data/theme
516
// Based on (3.26):
517
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-26/data/themes
518
// Layout tab and tab bar tweaks
520
// The following makes the layout stack header look similar to a tab bar.
521
layouttabbar {
522
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
523
background-color: theme-color.$surface-z0;
524
button {
526
@extend %button-flat-activatable;
527
}
528
> box > button {
530
margin: (40px - theme.$medium-size) / 2 0;
531
// border-radius: 0;
532
}
533
}
534
layouttab {
536
margin: 0 8px; // not working
537
border-style: none solid;
538
border-width: 1px;
539
border-color: theme-color.divider(theme-color.$on-surface);
540
box-shadow: inset 0 -2px theme-color.$primary;
541
background-color: theme-color.$surface-z1;
542
separator.vertical {
544
margin: 8px 4px;
545
}
546
button {
548
&,
549
&.text-button,
550
&.image-button {
551
margin-top: 8px;
552
margin-bottom: 8px;
553
padding: 0 4px;
554
}
555
}
556
// Close button styling for layouttab.
558
> box > button.close {
559
// border-radius: $circular-radius;
560
}
561
}
562
layout {
564
border: 1px solid theme-color.divider(theme-color.$on-surface);
565
-PnlDockBin-handle-size: 1;
566
}
567
entry.search-missing {
569
background-color: theme-color.$error;
570
color: theme-color.$on-error;
571
}
572
// tweak icons for treeviews
574
window.workbench treeview.image {
575
color: theme-color.hint(theme-color.$on-surface);
576
}
577
popover.popover-selector list {
579
padding: 8px - 2px;
580
row {
582
border-radius: theme.$corner-radius;
583
image {
585
&:dir(ltr) {
586
margin-right: 6px;
587
}
588
&:dir(rtl) {
590
margin-left: 6px;
591
}
592
}
593
.accel {
595
&:dir(ltr) {
596
margin-left: 6px;
597
}
598
&:dir(rtl) {
600
margin-right: 6px;
601
}
602
}
603
}
604
}
605
omnibar {
607
&.linked:not(.vertical) entry {
608
border-radius: theme.$corner-radius;
609
}
610
entry {
612
color: theme-color.hint(theme-color.$on-surface);
613
}
614
}
615
popover.omnibar list row:not(:last-child) {
617
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
618
}
619
entry.preferences-search {
621
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
622
box-shadow: none;
623
background-color: transparent;
624
// doesn't work properly
626
&:dir(ltr) {
627
// border-right: 1px solid divider($on-surface);
628
}
629
&:dir(rtl) {
631
// border-left: 1px solid divider($on-surface);
632
}
633
}
634
preferences stacksidebar.sidebar {
636
list {
637
// background-color: $surface-z0;
638
}
639
&:dir(ltr),
641
&:dir(rtl) {
642
list {
643
border-style: none;
644
}
645
}
646
list separator {
648
@extend %hide_separators;
649
}
650
}
651
preferences > box > box {
653
&:dir(ltr) {
654
border-right: 1px solid theme-color.divider(theme-color.$on-surface);
655
}
656
&:dir(rtl) {
658
border-left: 1px solid theme-color.divider(theme-color.$on-surface);
659
}
660
}
661
popover.messagepopover {
663
&.background {
664
padding: 0;
665
}
666
.popover-action-area button {
668
@extend %button-flat-basic;
669
padding: 8px 16px;
671
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
672
border-radius: 0;
673
&:first-child {
675
border-bottom-left-radius: theme.$corner-radius;
676
}
677
&:last-child {
679
border-bottom-right-radius: theme.$corner-radius;
680
}
681
}
682
.popover-content-area {
684
margin: 16px;
685
}
686
}
687
popover.transfers list {
689
background-color: transparent;
690
row:not(:first-child) {
692
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
693
}
694
row > box {
696
padding: 10px;
697
}
698
}
699
dockbin {
701
border: 1px solid theme-color.divider(theme-color.$on-surface);
702
-PnlDockBin-handle-size: 1;
703
}
704
dockpaned {
706
border: 1px solid theme-color.divider(theme-color.$on-surface);
707
}
708
eggsearchbar box.search-bar {
710
padding: 0 8px;
711
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
712
background-color: theme-color.$surface-z0;
713
}
714
docktabstrip {
716
padding: 0 8px;
717
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
718
background-color: theme-color.$surface-z0;
719
}
720
docktab {
722
transition: theme.$transition,
723
background-size 0ms,
724
background-image 0ms;
725
min-height: theme.$small-size;
726
min-width: theme.$small-size;
727
margin-bottom: -1px;
728
padding: theme.$container-padding 6px;
729
border-width: 1px; // for reorderable tabs
731
border-color: transparent; //
732
box-shadow: inset 0 -2px transparent;
734
background-image: radial-gradient(circle, theme-color.$primary 10%, transparent 0%);
735
background-repeat: no-repeat;
736
background-position: center;
737
background-size: 0% 0%;
738
color: theme-color.hint(theme-color.$on-surface);
740
font-weight: 500;
741
&:hover {
743
background-color: theme-color.hover-overlay(theme-color.$on-surface);
744
}
745
&:checked {
747
transition: theme.$transition,
748
background-size theme.$ripple-duration theme.$ease-out,
749
background-image theme.$ripple-duration + theme.$ripple-fade-out-duration theme.$ease-out;
750
box-shadow: inset 0 -2px theme-color.$primary;
751
background-color: transparent;
752
background-image: radial-gradient(circle, transparent 10%, transparent 0%);
753
background-size: 1000% 1000%;
754
color: theme-color.$on-surface;
755
}
756
}
757
dockoverlayedge {
759
background-color: theme-color.$surface-z0;
760
docktabstrip {
762
padding: 0;
763
border: none;
764
}
765
&.left-edge docktab:checked {
767
box-shadow: inset -2px 0 theme-color.$primary;
768
}
769
&.right-edge docktab:checked {
771
box-shadow: inset 2px 0 theme-color.$primary;
772
}
773
}
774
pillbox {
776
background-color: theme-color.$surface-z0;
777
border-radius: theme.$corner-radius;
778
}
779
buildperspective row {
781
// padding: 10px;
782
}
783
layoutpane entry.search {
785
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
786
box-shadow: none;
787
background-color: theme-color.$surface-z1;
788
}
789
editortweak entry.search {
791
margin-bottom: -1px;
792
box-shadow: none;
793
background-color: transparent;
794
}
795
//
797
// let's tweak hard-coded elements
798
//
799
.gb-search-entry-occurrences-tag {
801
box-shadow: none;
802
background-color: transparent;
803
}
804
// Keep search bar and layouttab height in sync.
806
// layouttabbar > box,
807
// eggsearchbar > revealer > box,
808
docktabstrip {
809
min-height: 39px;
810
}
811
eggsearchbar entry {
813
// min-height: 24px;
814
}
815
window.workbench preferences preferencesgroup list entry {
817
// background: none;
818
// min-height: 0px;
819
padding-top: 8px;
820
padding-bottom: 8px;
821
}
822
button.run-arrow-button {
824
// min-width: 12px;
825
padding-left: (theme.$medium-size - 16px) / 2;
826
padding-right: (theme.$medium-size - 16px) / 2;
827
}
828
//
830
// Additional styles for 3.26
831
//
832
button.dzlmenubutton image {
834
min-width: theme.$medium-size - 6px;
835
&.arrow {
837
min-width: theme.$medium-size - 9px;
838
}
839
}
840
button.dzlmenubuttonitem {
842
color: theme-color.$on-surface;
843
font-weight: normal;
844
&:disabled {
846
color: theme-color.disabled(theme-color.$on-surface);
847
}
848
}
849
idelayoutstackheader {
851
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
852
button:checked {
854
color: theme-color.$on-surface;
855
}
856
}
857
// utilities stack switcher
859
ideeditorutilities > dzldockpaned > box > stackswitcher {
860
padding: 8px 0;
861
background-color: theme-color.$surface-z0;
862
&:dir(ltr) {
864
border-right: 1px solid theme-color.divider(theme-color.$on-surface);
865
}
866
&:dir(rtl) {
868
border-left: 1px solid theme-color.divider(theme-color.$on-surface);
869
}
870
button {
872
border-radius: 0;
873
box-shadow: none;
874
background-color: transparent;
875
&:active {
877
background-image: radial-gradient(circle, rgba(theme-color.$primary, .7) 10%, transparent 0%);
878
}
879
&:checked {
881
background-color: transparent;
882
color: theme-color.$on-surface;
883
}
884
&:dir(ltr) {
886
margin-right: -1px;
887
&:checked {
889
box-shadow: inset -2px 0 theme-color.$primary;
890
}
891
}
892
&:dir(rtl) {
894
margin-left: -1px;
895
&:checked {
897
box-shadow: inset 2px 0 theme-color.$primary;
898
}
899
}
900
}
901
}
902
// buildui panel
904
ideeditorsidebar notebook header {
905
background: transparent;
906
}
907
popover.messagepopover {
909
// padding: 0;
910
list {
912
border: 1px solid theme-color.divider(theme-color.$on-surface);
913
background-clip: padding-box;
914
row:not(:last-child) {
916
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
917
}
918
}
919
}
920
// Workaround for hard-coded .title color
922
dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row:selected {
923
.title {
924
// color: @theme_selected_fg_color;
925
}
926
background-color: theme-color.$primary;
928
color: theme-color.$on-primary;
929
}
930
// Workaround for hard-coded button background
932
#titlebar_container .suggestionbutton button {
933
// background-color: @content_view_bg;
934
// background-image: none;
935
padding: 0;
937
border-radius: 0;
938
box-shadow: inset 0 0 0 9999px theme-color.$titlebar;
939
&:backdrop {
941
box-shadow: inset 0 0 0 9999px theme-color.$titlebar-backdrop;
942
}
943
// For some reason background-image doesn't work well with transition :(
945
image {
946
transition:
947
box-shadow theme.$state-duration theme.$ease-out,
948
background-color theme.$ripple-duration theme.$ease-out;
949
min-width: theme.$medium-size;
950
min-height: theme.$medium-size;
951
border-radius: theme.$circular-radius;
952
box-shadow: inset 0 0 0 9999px transparent;
953
}
954
&:hover image {
956
box-shadow: inset 0 0 0 9999px theme-color.hover-overlay(theme-color.$on-titlebar);
957
}
958
&:focus image {
960
box-shadow: inset 0 0 0 9999px theme-color.focus-overlay(theme-color.$on-titlebar);
961
}
962
&:active image {
964
background-color: theme-color.pressed-overlay(theme-color.$on-titlebar);
965
}
966
}
967
/**
969
* Photos
970
*/
971
// Based on:
973
// https://gitlab.gnome.org/GNOME/gnome-photos/blob/master/data/Adwaita.css
974
GdMainIconView.content-view {
976
-GdMainIconView-icon-size: 48;
977
// Make spinner visible on both dark and bright backgrounds w/o making
979
// it look ugly/weird.
980
&.cell:active {
981
// color: disabled($on-surface);
982
}
983
}
984
.documents-counter {
986
margin: 8px;
987
border-radius: theme.$circular-radius;
988
box-shadow: shadow.$z4;
989
background-color: theme-color.$primary;
990
color: theme-color.$on-primary;
991
font-weight: bold;
992
}
993
.photos-entry-tag {
995
@extend .entry-tag;
996
}
997
.documents-scrolledwin.frame {
999
border-style: none;
1000
background-color: transparent;
1001
frame.content-view > border {
1003
border-style: none;
1004
background-color: transparent;
1005
}
1006
}
1007
.photos-icon-bg {
1009
}
1010
.photos-fade-in {
1012
opacity: 1;
1013
transition: opacity theme.$state-duration theme.$ease-out;
1014
}
1015
.photos-fade-out {
1017
opacity: 0;
1018
transition: opacity theme.$state-duration theme.$ease-out;
1019
}
1020
.photos-collection-icon {
1022
}
1023
button.photos-filter-preview {
1025
color: theme-color.$on-surface;
1026
font-weight: normal;
1027
&:checked {
1029
background-color: theme-color.$selected-overlay;
1030
color: theme-color.$on-surface;
1031
image {
1033
color: theme-color.$on-dark;
1034
-gtk-icon-shadow: shadow.$text-shadow;
1035
}
1036
}
1037
}
1038
overlay grid.horizontal > revealer > scrolledwindow.frame {
1040
border-style: none;
1041
background-color: transparent;
1042
&:dir(ltr) {
1044
border-left-style: solid;
1045
}
1046
&:dir(rtl) {
1048
border-right-style: solid;
1049
}
1050
}
1051
/**
1053
* Music
1054
*/
1055
// The hard-coded CSS:
1057
// https://gitlab.gnome.org/GNOME/gnome-music/blob/master/data/application.css
1058
.side-panel:dir(ltr) {
1060
// border-width: 0 1px 0 0;
1061
border-style: solid;
1062
border-color: theme-color.divider(theme-color.$on-surface);
1063
}
1064
.side-panel:dir(rtl) {
1066
// border-width: 0 0 0 1px;
1067
border-style: solid;
1068
border-color: theme-color.divider(theme-color.$on-surface);
1069
}
1070
.side-panel .view {
1072
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
1073
background-image: image(theme-color.$surface-z0);
1074
&:hover {
1076
background-image: image(theme-color.hover-overlay(theme-color.$on-surface, $on: theme-color.$surface-z0));
1077
}
1078
}
1079
.side-panel .view:selected {
1081
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
1082
background-image: image(theme-color.$primary);
1083
&:hover {
1085
background-image: image(theme-color.hover-overlay(theme-color.$on-primary, $on: theme-color.$primary));
1086
}
1087
}
1088
.songs-list {
1090
// box-shadow: inset 0 -1px shade(@borders, 1.30);
1091
// background-color: @theme_bg_color;
1092
&:hover {
1094
background-image: image(theme-color.hover-overlay(theme-color.$on-surface));
1095
}
1096
}
1097
frame.documents-dropdown {
1099
@extend %toolbar-osd;
1100
margin: 8px;
1102
> border {
1104
border: none;
1105
}
1106
}
1107
box.vertical > revealer > toolbar.search-bar {
1109
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
1110
button > widget {
1112
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1113
// -GtkArrow-arrow-scaling: 1;
1114
}
1115
}
1116
/**
1118
* Terminal
1119
*/
1120
terminal-window notebook > header > box {
1122
// Remove hard-coded margin around button(s)
1123
margin: -2px;
1124
button {
1126
border-radius: 0;
1127
}
1128
}
1129
/**
1131
* To Do
1132
*/
1133
// less than 3.28
1135
task-list-view {
1136
taskrow {
1137
transition: theme.$transition;
1138
margin: 0 -8px;
1139
&:hover {
1141
transition: none;
1142
}
1143
label {
1145
margin: 0 8px;
1146
}
1147
image.dim-label {
1149
min-width: 16px;
1150
}
1151
}
1152
> box > revealer > box > button {
1154
margin: (12px * 2 - theme.$medium-size) / 2;
1155
.dim-label {
1157
color: inherit;
1158
}
1159
}
1160
}
1161
// 3.28 or later
1163
tasklistview {
1164
taskrow {
1165
outline: none;
1166
entry {
1168
&,
1169
&:focus,
1170
&:disabled {
1171
box-shadow: none;
1172
}
1173
}
1174
image.dim-label {
1176
min-width: 16px;
1177
}
1178
}
1179
> box > revealer > box > button {
1181
margin: (12px * 2 - theme.$medium-size) / 2;
1182
.dim-label {
1184
color: inherit;
1185
}
1186
}
1187
}
1188
/**
1190
* eog
1191
*/
1192
#eog-thumb-nav {
1194
scrolledwindow.frame {
1195
border-top: none;
1196
}
1197
}
1198
/**
1200
* Evolution
1201
*/
1202
frame.taskbar > border {
1204
border-style: solid none none;
1205
}
1206
box.vertical > paned.horizontal notebook widget .frame {
1208
border-style: none;
1209
}
1210
/**
1212
* gitg
1213
*/
1214
frame.commit-frame > border {
1216
border-style: solid none none;
1217
}
1218
/**
1220
* Characters
1221
*/
1222
box.dialog-vbox scrolledwindow.related {
1224
border: 1px solid theme-color.divider(theme-color.$on-surface);
1225
background-clip: padding-box;
1226
background-color: theme-color.$surface-z1;
1227
}
1228
list.categories {
1230
background-image: image(theme-color.$surface-z0);
1231
}
1232
/**
1234
* Boxes
1235
*/
1236
.transparent-bg + stack overlay > label {
1238
min-height: 24px;
1239
padding: 0 4px;
1240
border-radius: theme.$corner-radius;
1241
background-color: theme-color.$scrim;
1242
color: theme-color.$on-scrim;
1243
}
1244
/**
1246
* Evince
1247
*/
1248
// Color is needed for Evince to match hardcoded background-color,
1250
// since Documents app is also uses this style, background-color needs to be set accordingly.
1251
evview.content-view.view:selected {
1252
background-color: theme-color.$primary;
1253
color: theme-color.$on-primary;
1254
}
1255
/**
1257
* Polari
1258
*/
1259
// The hard-coded CSS:
1261
// https://gitlab.gnome.org/GNOME/polari/blob/master/data/resources/application.css
1262
// background-color is needed to match hard-coded row colors.
1264
// Just $primary is too harsh for activated rows, so add transparency.
1265
.polari-room-list row:selected {
1266
background-color: rgba(theme-color.$primary, .5);
1267
}
1268
/**
1270
* Fractal
1271
*/
1272
.message-input-area button {
1274
@extend %button-flat-activatable;
1275
}
1276
// To display the drop shadow
1278
button.osd.scroll_button {
1279
margin: 4px;
1280
}
1281
/**
1283
* Mines
1284
*/
1285
grid.minefield > button.tile {
1287
border-style: solid;
1288
}
1289