ASCII text
1
@use "sass:color";
2
@use "sass:math";
3
@use "../../../theme";
4
@use "../../../theme-color";
5
@use "../common";
6
@use "../drawing";
7
/**
9
* Nautilus
10
*/
11
// Based on:
13
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/Adwaita.css
14
// The hard-coded CSS:
15
// https://gitlab.gnome.org/GNOME/nautilus/blob/master/src/resources/css/nautilus.css
16
.nautilus-window,
18
.nautilus-window notebook,
19
.nautilus-window notebook > stack {
20
// background-color: $surface-z0;
21
}
22
.nautilus-canvas-item {
24
// border-radius: $corner-radius;
25
}
26
.nautilus-canvas-item.dim-label,
28
.nautilus-list-dim-label {
29
color: theme-color.hint(theme-color.$on-surface);
30
}
31
.nautilus-desktop.nautilus-canvas-item {
33
@extend %iconview-desktop;
34
}
35
// Toolbar
37
@keyframes nautilus-operations-button-needs-attention {
39
to {
40
background-color: theme-color.focus-overlay(theme-color.$on-titlebar);
41
}
42
}
43
.nautilus-operations-button-needs-attention {
45
animation: nautilus-operations-button-needs-attention theme.$ripple-fade-out-duration theme.$ease 2 alternate;
46
}
47
.nautilus-operations-button-needs-attention-multiple {
49
animation: nautilus-operations-button-needs-attention theme.$ripple-fade-out-duration theme.$ease 6 alternate;
50
}
51
.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):not(:only-child).disclosure-button {
53
border-radius: theme.$circular-radius;
54
}
55
// Path bar
57
.path-bar-box {
59
transition: background-color theme.$duration theme.$ease-out;
60
margin: theme.$container-padding 0;
61
border-radius: theme.$corner-radius;
62
// reset the margin
64
button {
65
margin: 0;
66
}
67
&.width-maximized {
69
background-color: theme-color.entry-fill(theme-color.$on-titlebar);
70
}
71
// workaround for 3.30.1
73
&.background.frame {
74
border-style: none;
75
background-color: theme-color.entry-fill(theme-color.$on-titlebar);
76
}
77
// for 3.30
79
.path-bar button {
80
label:not(:only-child) {
81
&:first-child {
82
margin-left: 0;
83
}
84
&:last-child {
86
margin-right: 0;
87
}
88
}
89
}
90
// for 3.32
92
.nautilus-path-bar button:not(.suggested-action):not(.destructive-action) {
93
padding-left: (theme.$medium-size - 24px) / 2;
94
padding-right: (theme.$medium-size - 24px) / 2;
95
&.text-button {
97
min-width: 0;
98
}
99
label:not(:only-child) {
101
&:first-child {
102
margin-left: 0;
103
}
104
&:last-child {
106
margin-right: 0;
107
}
108
}
109
&.text-button.image-button image:not(:only-child) {
111
margin: 0;
112
}
113
&:last-child:dir(ltr),
115
&:first-child:dir(rtl) {
116
@extend %titlebar-button-checked;
117
}
118
}
119
}
120
// Floating status bar
122
.nautilus-window .floating-bar {
123
min-height: 32px;
124
padding: 0;
125
border-style: solid solid none;
126
border-width: 1px;
127
border-color: theme-color.divider(theme-color.$on-surface);
128
border-radius: (theme.$corner-radius + 1px) (theme.$corner-radius + 1px) 0 0;
129
background-clip: padding-box;
130
background-color: theme-color.$surface-z8;
131
// axes left border and border radius
133
&.bottom.left {
134
margin-right: 8px - 1px;
135
border-left-style: none;
136
border-top-left-radius: 0;
137
}
138
// axes right border and border radius
140
&.bottom.right {
141
margin-left: 8px - 1px;
142
border-right-style: none;
143
border-top-right-radius: 0;
144
}
145
button {
147
margin: (32px - theme.$small-size) / 2;
148
@extend %button-small;
150
}
151
}
152
.disk-space-display {
154
// border-style: solid;
155
// border-width: 2px;
156
&.unknown {
158
background-color: theme-color.stroke(theme-color.$on-surface);
159
color: theme-color.stroke(theme-color.$on-surface);
160
}
161
&.used {
163
background-color: theme-color.$primary;
164
color: theme-color.$primary;
165
}
166
&.free {
168
background-color: theme-color.fill(theme-color.$on-surface);
169
color: theme-color.fill(theme-color.$on-surface);
170
}
171
}
172
// View
174
// Hide superfluous treeview drop target indication
176
.nautilus-list-view .view:not(.dnd) {
177
// border-bottom: 1px solid divider($on-surface);
178
}
179
.nautilus-empty-state-icon + .large-title {
181
@extend .title-1;
182
color: theme-color.hint(theme-color.$on-surface);
183
}
184
.search-information {
186
padding: 2px;
187
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
188
}
189
.documents-entry-tag {
191
@extend .entry-tag;
192
}
193
.conflict-row:not(:selected) {
195
background-color: color.mix(theme-color.$warning, theme-color.$surface-z1, math.percentage(.3));
196
}
197
// Icon view
199
.nautilus-window flowboxchild {
200
.icon-background {
201
// background-color: black;
202
}
203
.icon-item-background {
205
padding: 4px;
206
border-radius: theme.$corner-radius;
207
}
208
&:selected {
210
background-color: transparent;
211
.icon-item-background {
213
background-color: theme-color.$selected-overlay;
214
}
215
}
216
}
217
// Batch rename dialog
219
dialog.background > box.dialog-vbox.vertical > grid.horizontal {
220
> scrolledwindow.frame {
221
border-style: none;
222
}
223
> box.horizontal:last-child {
225
margin: -6px 0 0 -6px;
226
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
227
> label {
229
margin: 0 8px;
230
}
231
> box > button {
233
border-radius: 0;
234
}
235
}
236
}
237
// Tweak to fix the messy sizing of the popover menu
239
.nautilus-window > popover.menu:not(:last-child) {
240
padding: 3px;
241
> stack > box > box > box {
243
margin-top: -6px;
244
> box {
246
margin-bottom: -6px;
247
&.linked {
249
margin-top: 1px;
250
}
251
}
252
}
253
separator {
255
margin-bottom: -2px;
256
}
257
}
258
.nautilus-menu-sort-heading {
260
// min-height: 26px;
261
// padding-left: 5px;
262
// padding-right: 5px;
263
margin: 1px 3px;
264
font-weight: 500;
265
&:disabled {
267
color: theme-color.hint(theme-color.$on-surface);
268
}
269
}
270
// Make operations button circular
272
.nautilus-window headerbar revealer > button {
273
border-radius: theme.$circular-radius;
274
}
275
// Ensure paned separator rendering. See issue #84 for details.
277
.nautilus-window paned > separator {
278
background-color: theme-color.$surface-z0;
279
}
280
/**
283
* gedit
284
*/
285
// Based on:
287
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit.adwaita.css
288
// The hard-coded CSS:
289
// https://gitlab.gnome.org/GNOME/gedit/blob/master/gedit/resources/css/gedit-style.css
290
// Only normal state is handle
292
.open-document-selector-name-label {
293
// font-weight: bold;
294
}
295
// Only normal state is handle
297
.open-document-selector-path-label {
298
color: theme-color.hint(theme-color.$on-surface);
299
font-size: smaller;
300
}
301
// Only normal state is handle
303
.open-document-selector-match {
304
background-color: theme-color.$warning;
305
color: theme-color.$on-warning;
306
}
307
.gedit-document-panel {
309
// Try to look as the notebook tab close button
310
row button.flat {
311
margin-top: 8px;
312
margin-bottom: 8px;
313
@extend %button-small;
315
}
316
}
317
.gedit-document-panel-group-row:not(:first-child) {
319
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
320
}
321
.gedit-side-panel-paned statusbar {
323
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
324
}
325
.gedit-search-slider {
327
margin: 4px 4px 8px;
328
.linked:not(.vertical) > entry {
330
border-radius: theme.$corner-radius;
331
@extend %entry_raised;
332
.gedit-search-entry-occurrences-tag {
334
all: unset;
335
color: theme-color.hint(theme-color.$on-surface);
336
}
337
$buttons_width: theme.$small-size * 2 + theme.$container-padding * 3;
339
&:dir(ltr) {
341
margin-right: -$buttons_width;
342
padding-right: $buttons_width;
343
.gedit-search-entry-occurrences-tag {
345
margin-left: theme.$container-padding;
346
}
347
image.right {
349
margin-right: 0;
350
}
351
}
352
&:dir(rtl) {
354
margin-left: -$buttons_width;
355
padding-left: $buttons_width;
356
.gedit-search-entry-occurrences-tag {
358
margin-right: theme.$container-padding;
359
}
360
image.left {
362
margin-left: 0;
363
}
364
}
365
&:not(.error) {
367
background-color: theme-color.$surface-z8;
368
}
369
&.error ~ button {
371
color: theme-color.hint(theme-color.$on-error);
372
@include drawing.ink-color(theme-color.$on-error, $button-style: "flat");
373
&:disabled {
375
color: theme-color.disabled-hint(theme-color.$on-error);
376
}
377
}
378
}
379
.linked:not(.vertical) > button {
381
border: solid theme.$container-padding transparent;
382
border-radius: theme.$circular-radius;
383
background-clip: padding-box;
384
@extend %button-flat-basic;
386
@extend %button-small;
387
&:last-child:dir(ltr),
389
&:not(:first-child):dir(rtl) {
390
margin-left: -(theme.$container-padding) / 2;
391
}
392
&:first-child:dir(rtl),
394
&:not(:last-child):dir(ltr) {
395
margin-right: -(theme.$container-padding) / 2;
396
}
397
}
398
}
399
frame.gedit-map-frame > border {
401
&:dir(ltr) {
402
border-style: none none none solid;
403
}
404
&:dir(rtl) {
406
border-style: none solid none none;
407
}
408
}
409
/**
411
* Tweaks
412
*/
413
// The hard-coded CSS:
415
// https://gitlab.gnome.org/GNOME/gnome-tweaks/blob/master/data/shell.css
416
// the sidebar
418
.tweak-categories {
419
// padding: 4px 0;
420
// background-color: shade(@theme_bg_color, 0.99);
421
background-image: image(theme-color.$surface-z0);
422
separator {
424
@extend %hide_separators;
425
}
426
}
427
.tweak {
429
// padding-top: 3px;
430
padding: 3px;
431
&.title:hover {
433
box-shadow: none;
434
}
435
}
436
.tweak-group-white,
438
.tweak-white,
439
.tweak-white:hover {
440
// background-color: white;
441
background-image: image(theme-color.$surface-z1);
442
}
443
.tweak-startup,
445
.tweak-startup:hover {
446
// background-color: lighter(shade(@theme_bg_color, 0.9));
447
background-image: image(theme-color.$surface-z1);
448
}
449
.tweak-group-startup {
451
border: 1px solid theme-color.divider(theme-color.$on-surface);
452
background-clip: padding-box;
453
// background-color: @view_separators;
454
background-image: image(theme-color.$surface-z1);
455
}
456
//
458
// Workaround for 3.26
459
//
460
row#Focus,
462
row#ClickMethod,
463
row#StaticWorkspaceTweak, // for 3.26.0
464
row#dynamic-workspaces,
465
row#PrimaryWorkspaceTweak, // for 3.26.0
466
row#workspaces-only-on-primary {
467
padding: 0;
468
border: 1px solid theme-color.divider(theme-color.$on-surface);
469
background-clip: padding-box;
470
background-image: image(theme-color.$surface-z1);
471
row:not(:last-child) {
473
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
474
}
475
&.tweak > list {
477
margin-top: -3px;
478
}
479
}
480
// Add more spaces between title and list
482
row#Focus,
483
row#ClickMethod,
484
row#PrimaryWorkspaceTweak, // for 3.26.0
485
row#workspaces-only-on-primary {
486
margin-top: 4px;
487
}
488
// Workaround for gnome-tweaks >= 3.34
490
// See https://github.com/nana-4/materia-theme/issues/432
491
leaflet.titlebar > .titlebar.tweak-titlebar-left,
492
leaflet.titlebar > .titlebar.tweak-titlebar-right,
493
hdyleaflet.titlebar > .titlebar.tweak-titlebar-left,
494
hdyleaflet.titlebar > .titlebar.tweak-titlebar-right {
495
background-color: inherit;
496
box-shadow: inherit;
497
// Remove only background-color transition.
498
// This shouldn't be necessary, but otherwise it gets lag...
499
transition: color theme.$duration theme.$ease-out;
500
+ separator {
502
background-color: inherit;
503
background-image: image(theme-color.divider(theme-color.$on-titlebar));
504
}
505
}
506
/**
508
* Builder
509
*/
510
// Based on (3.22):
512
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-22/data/theme
513
// Based on (3.24):
514
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-24/data/theme
515
// Based on (3.26):
516
// https://gitlab.gnome.org/GNOME/gnome-builder/tree/gnome-builder-3-26/data/themes
517
// Layout tab and tab bar tweaks
519
// The following makes the layout stack header look similar to a tab bar.
520
layouttabbar {
521
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
522
background-color: theme-color.$surface-z0;
523
button {
525
@extend %button-flat-activatable;
526
}
527
> box > button {
529
margin: (40px - theme.$medium-size) / 2 0;
530
// border-radius: 0;
531
}
532
}
533
layouttab {
535
margin: 0 8px; // not working
536
border-style: none solid;
537
border-width: 1px;
538
border-color: theme-color.divider(theme-color.$on-surface);
539
box-shadow: inset 0 -2px theme-color.$primary;
540
background-color: theme-color.$surface-z1;
541
separator.vertical {
543
margin: 8px 4px;
544
}
545
button {
547
&,
548
&.text-button,
549
&.image-button {
550
margin-top: 8px;
551
margin-bottom: 8px;
552
padding: 0 4px;
553
}
554
}
555
// Close button styling for layouttab.
557
> box > button.close {
558
// border-radius: $circular-radius;
559
}
560
}
561
layout {
563
border: 1px solid theme-color.divider(theme-color.$on-surface);
564
-PnlDockBin-handle-size: 1;
565
}
566
entry.search-missing {
568
background-color: theme-color.$error;
569
color: theme-color.$on-error;
570
}
571
// tweak icons for treeviews
573
window.workbench treeview.image {
574
color: theme-color.hint(theme-color.$on-surface);
575
}
576
popover.popover-selector list {
578
padding: 8px - 2px;
579
row {
581
border-radius: theme.$corner-radius;
582
image {
584
&:dir(ltr) {
585
margin-right: 6px;
586
}
587
&:dir(rtl) {
589
margin-left: 6px;
590
}
591
}
592
.accel {
594
&:dir(ltr) {
595
margin-left: 6px;
596
}
597
&:dir(rtl) {
599
margin-right: 6px;
600
}
601
}
602
}
603
}
604
omnibar {
606
&.linked:not(.vertical) entry {
607
border-radius: theme.$corner-radius;
608
}
609
entry {
611
color: theme-color.hint(theme-color.$on-surface);
612
}
613
}
614
popover.omnibar list row:not(:last-child) {
616
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
617
}
618
entry.preferences-search {
620
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
621
box-shadow: none;
622
background-color: transparent;
623
// doesn't work properly
625
&:dir(ltr) {
626
// border-right: 1px solid divider($on-surface);
627
}
628
&:dir(rtl) {
630
// border-left: 1px solid divider($on-surface);
631
}
632
}
633
preferences stacksidebar.sidebar {
635
list {
636
// background-color: $surface-z0;
637
}
638
&:dir(ltr),
640
&:dir(rtl) {
641
list {
642
border-style: none;
643
}
644
}
645
list separator {
647
@extend %hide_separators;
648
}
649
}
650
preferences > box > box {
652
&:dir(ltr) {
653
border-right: 1px solid theme-color.divider(theme-color.$on-surface);
654
}
655
&:dir(rtl) {
657
border-left: 1px solid theme-color.divider(theme-color.$on-surface);
658
}
659
}
660
popover.messagepopover {
662
&.background {
663
padding: 0;
664
}
665
.popover-action-area button {
667
@extend %button-flat-basic;
668
padding: 8px 16px;
670
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
671
border-radius: 0;
672
&:first-child {
674
border-bottom-left-radius: theme.$corner-radius;
675
}
676
&:last-child {
678
border-bottom-right-radius: theme.$corner-radius;
679
}
680
}
681
.popover-content-area {
683
margin: 16px;
684
}
685
}
686
popover.transfers list {
688
background-color: transparent;
689
row:not(:first-child) {
691
border-top: 1px solid theme-color.divider(theme-color.$on-surface);
692
}
693
row > box {
695
padding: 10px;
696
}
697
}
698
dockbin {
700
border: 1px solid theme-color.divider(theme-color.$on-surface);
701
-PnlDockBin-handle-size: 1;
702
}
703
dockpaned {
705
border: 1px solid theme-color.divider(theme-color.$on-surface);
706
}
707
eggsearchbar box.search-bar {
709
padding: 0 8px;
710
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
711
background-color: theme-color.$surface-z0;
712
}
713
docktabstrip {
715
padding: 0 8px;
716
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
717
background-color: theme-color.$surface-z0;
718
}
719
docktab {
721
transition: theme.$transition,
722
background-size 0ms,
723
background-image 0ms;
724
min-height: theme.$small-size;
725
min-width: theme.$small-size;
726
margin-bottom: -1px;
727
padding: theme.$container-padding 6px;
728
border-width: 1px; // for reorderable tabs
730
border-color: transparent; //
731
box-shadow: inset 0 -2px transparent;
733
background-image: radial-gradient(circle, theme-color.$primary 10%, transparent 0%);
734
background-repeat: no-repeat;
735
background-position: center;
736
background-size: 0% 0%;
737
color: theme-color.hint(theme-color.$on-surface);
739
font-weight: 500;
740
&:hover {
742
background-color: theme-color.hover-overlay(theme-color.$on-surface);
743
}
744
&:checked {
746
transition: theme.$transition,
747
background-size theme.$ripple-fade-in-duration theme.$ease-out,
748
background-image theme.$ripple-fade-in-duration + theme.$ripple-fade-out-duration theme.$ease-out;
749
box-shadow: inset 0 -2px theme-color.$primary;
750
background-color: transparent;
751
background-image: radial-gradient(circle, transparent 10%, transparent 0%);
752
background-size: 1000% 1000%;
753
color: theme-color.$on-surface;
754
}
755
}
756
dockoverlayedge {
758
background-color: theme-color.$surface-z0;
759
docktabstrip {
761
padding: 0;
762
border: none;
763
}
764
&.left-edge docktab:checked {
766
box-shadow: inset -2px 0 theme-color.$primary;
767
}
768
&.right-edge docktab:checked {
770
box-shadow: inset 2px 0 theme-color.$primary;
771
}
772
}
773
pillbox {
775
background-color: theme-color.$surface-z0;
776
border-radius: theme.$corner-radius;
777
}
778
buildperspective row {
780
// padding: 10px;
781
}
782
layoutpane entry.search {
784
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
785
box-shadow: none;
786
background-color: theme-color.$surface-z1;
787
}
788
editortweak entry.search {
790
margin-bottom: -1px;
791
box-shadow: none;
792
background-color: transparent;
793
}
794
//
796
// let's tweak hard-coded elements
797
//
798
.gb-search-entry-occurrences-tag {
800
box-shadow: none;
801
background-color: transparent;
802
}
803
// Keep search bar and layouttab height in sync.
805
// layouttabbar > box,
806
// eggsearchbar > revealer > box,
807
docktabstrip {
808
min-height: 39px;
809
}
810
eggsearchbar entry {
812
// min-height: 24px;
813
}
814
window.workbench preferences preferencesgroup list entry {
816
// background: none;
817
// min-height: 0px;
818
padding-top: 8px;
819
padding-bottom: 8px;
820
}
821
button.run-arrow-button {
823
// min-width: 12px;
824
padding-left: (theme.$medium-size - 16px) / 2;
825
padding-right: (theme.$medium-size - 16px) / 2;
826
}
827
//
829
// Additional styles for 3.26
830
//
831
button.dzlmenubutton image {
833
min-width: theme.$medium-size - 6px;
834
&.arrow {
836
min-width: theme.$medium-size - 9px;
837
}
838
}
839
button.dzlmenubuttonitem {
841
color: theme-color.$on-surface;
842
font-weight: normal;
843
&:disabled {
845
color: theme-color.disabled(theme-color.$on-surface);
846
}
847
}
848
idelayoutstackheader {
850
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
851
button:checked {
853
color: theme-color.$on-surface;
854
}
855
}
856
// utilities stack switcher
858
ideeditorutilities > dzldockpaned > box > stackswitcher {
859
padding: 8px 0;
860
background-color: theme-color.$surface-z0;
861
&:dir(ltr) {
863
border-right: 1px solid theme-color.divider(theme-color.$on-surface);
864
}
865
&:dir(rtl) {
867
border-left: 1px solid theme-color.divider(theme-color.$on-surface);
868
}
869
button {
871
border-radius: 0;
872
box-shadow: none;
873
background-color: transparent;
874
&:active {
876
background-image: radial-gradient(circle, rgba(theme-color.$primary, .7) 10%, transparent 0%);
877
}
878
&:checked {
880
background-color: transparent;
881
color: theme-color.$on-surface;
882
}
883
&:dir(ltr) {
885
margin-right: -1px;
886
&:checked {
888
box-shadow: inset -2px 0 theme-color.$primary;
889
}
890
}
891
&:dir(rtl) {
893
margin-left: -1px;
894
&:checked {
896
box-shadow: inset 2px 0 theme-color.$primary;
897
}
898
}
899
}
900
}
901
// buildui panel
903
ideeditorsidebar notebook header {
904
background: transparent;
905
}
906
popover.messagepopover {
908
// padding: 0;
909
list {
911
border: 1px solid theme-color.divider(theme-color.$on-surface);
912
background-clip: padding-box;
913
row:not(:last-child) {
915
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
916
}
917
}
918
}
919
// Workaround for hard-coded .title color
921
dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row:selected {
922
.title {
923
// color: @theme_selected_fg_color;
924
}
925
background-color: theme-color.$primary;
927
color: theme-color.$on-primary;
928
}
929
// Workaround for hard-coded button background
931
#titlebar_container .suggestionbutton button {
932
// background-color: @content_view_bg;
933
// background-image: none;
934
padding: 0;
936
border-radius: 0;
937
box-shadow: inset 0 0 0 9999px theme-color.$titlebar;
938
&:backdrop {
940
box-shadow: inset 0 0 0 9999px theme-color.$titlebar-backdrop;
941
}
942
// For some reason background-image doesn't work well with transition :(
944
image {
945
transition:
946
box-shadow theme.$duration theme.$ease-out,
947
background-color theme.$ripple-fade-in-duration theme.$ease-out;
948
min-width: theme.$medium-size;
949
min-height: theme.$medium-size;
950
border-radius: theme.$circular-radius;
951
box-shadow: inset 0 0 0 9999px transparent;
952
}
953
&:hover image {
955
box-shadow: inset 0 0 0 9999px theme-color.hover-overlay(theme-color.$on-titlebar);
956
}
957
&:focus image {
959
box-shadow: inset 0 0 0 9999px theme-color.focus-overlay(theme-color.$on-titlebar);
960
}
961
&:active image {
963
background-color: theme-color.pressed-overlay(theme-color.$on-titlebar);
964
}
965
}
966
/**
968
* Photos
969
*/
970
// Based on:
972
// https://gitlab.gnome.org/GNOME/gnome-photos/blob/master/data/Adwaita.css
973
GdMainIconView.content-view {
975
-GdMainIconView-icon-size: 48;
976
// Make spinner visible on both dark and bright backgrounds w/o making
978
// it look ugly/weird.
979
&.cell:active {
980
// color: disabled($on-surface);
981
}
982
}
983
.documents-counter {
985
margin: 8px;
986
border-radius: theme.$circular-radius;
987
box-shadow: theme.$shadow-z4;
988
background-color: theme-color.$primary;
989
color: theme-color.$on-primary;
990
font-weight: bold;
991
}
992
.photos-entry-tag {
994
@extend .entry-tag;
995
}
996
.documents-scrolledwin.frame {
998
border-style: none;
999
background-color: transparent;
1000
frame.content-view > border {
1002
border-style: none;
1003
background-color: transparent;
1004
}
1005
}
1006
.photos-icon-bg {
1008
}
1009
.photos-fade-in {
1011
opacity: 1;
1012
transition: opacity theme.$duration theme.$ease-out;
1013
}
1014
.photos-fade-out {
1016
opacity: 0;
1017
transition: opacity theme.$duration theme.$ease-out;
1018
}
1019
.photos-collection-icon {
1021
}
1022
button.photos-filter-preview {
1024
color: theme-color.$on-surface;
1025
font-weight: normal;
1026
&:checked {
1028
background-color: theme-color.$selected-overlay;
1029
color: theme-color.$on-surface;
1030
image {
1032
color: theme-color.$on-dark;
1033
-gtk-icon-shadow: theme.$text-shadow;
1034
}
1035
}
1036
}
1037
overlay grid.horizontal > revealer > scrolledwindow.frame {
1039
border-style: none;
1040
background-color: transparent;
1041
&:dir(ltr) {
1043
border-left-style: solid;
1044
}
1045
&:dir(rtl) {
1047
border-right-style: solid;
1048
}
1049
}
1050
/**
1052
* Music
1053
*/
1054
// The hard-coded CSS:
1056
// https://gitlab.gnome.org/GNOME/gnome-music/blob/master/data/application.css
1057
.side-panel:dir(ltr) {
1059
// border-width: 0 1px 0 0;
1060
border-style: solid;
1061
border-color: theme-color.divider(theme-color.$on-surface);
1062
}
1063
.side-panel:dir(rtl) {
1065
// border-width: 0 0 0 1px;
1066
border-style: solid;
1067
border-color: theme-color.divider(theme-color.$on-surface);
1068
}
1069
.side-panel .view {
1071
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
1072
background-image: image(theme-color.$surface-z0);
1073
&:hover {
1075
background-image: image(theme-color.hover-overlay(theme-color.$on-surface, $on: theme-color.$surface-z0));
1076
}
1077
}
1078
.side-panel .view:selected {
1080
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
1081
background-image: image(theme-color.$primary);
1082
&:hover {
1084
background-image: image(theme-color.hover-overlay(theme-color.$on-primary, $on: theme-color.$primary));
1085
}
1086
}
1087
.songs-list {
1089
// box-shadow: inset 0 -1px shade(@borders, 1.30);
1090
// background-color: @theme_bg_color;
1091
&:hover {
1093
background-image: image(theme-color.hover-overlay(theme-color.$on-surface));
1094
}
1095
}
1096
frame.documents-dropdown {
1098
@extend %toolbar-osd;
1099
margin: 8px;
1101
> border {
1103
border: none;
1104
}
1105
}
1106
box.vertical > revealer > toolbar.search-bar {
1108
border-bottom: 1px solid theme-color.divider(theme-color.$on-surface);
1109
button > widget {
1111
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1112
// -GtkArrow-arrow-scaling: 1;
1113
}
1114
}
1115
/**
1117
* Terminal
1118
*/
1119
terminal-window notebook > header > box {
1121
// Remove hard-coded margin around button(s)
1122
margin: -2px;
1123
button {
1125
border-radius: 0;
1126
}
1127
}
1128
/**
1130
* To Do
1131
*/
1132
// less than 3.28
1134
task-list-view {
1135
taskrow {
1136
transition: theme.$transition;
1137
margin: 0 -8px;
1138
&:hover {
1140
transition: none;
1141
}
1142
label {
1144
margin: 0 8px;
1145
}
1146
image.dim-label {
1148
min-width: 16px;
1149
}
1150
}
1151
> box > revealer > box > button {
1153
margin: (12px * 2 - theme.$medium-size) / 2;
1154
.dim-label {
1156
color: inherit;
1157
}
1158
}
1159
}
1160
// 3.28 or later
1162
tasklistview {
1163
taskrow {
1164
outline: none;
1165
entry {
1167
&,
1168
&:focus,
1169
&:disabled {
1170
box-shadow: none;
1171
}
1172
}
1173
image.dim-label {
1175
min-width: 16px;
1176
}
1177
}
1178
> box > revealer > box > button {
1180
margin: (12px * 2 - theme.$medium-size) / 2;
1181
.dim-label {
1183
color: inherit;
1184
}
1185
}
1186
}
1187
/**
1189
* eog
1190
*/
1191
#eog-thumb-nav {
1193
scrolledwindow.frame {
1194
border-top: none;
1195
}
1196
}
1197
/**
1199
* Evolution
1200
*/
1201
frame.taskbar > border {
1203
border-style: solid none none;
1204
}
1205
box.vertical > paned.horizontal notebook widget .frame {
1207
border-style: none;
1208
}
1209
/**
1211
* gitg
1212
*/
1213
frame.commit-frame > border {
1215
border-style: solid none none;
1216
}
1217
/**
1219
* Characters
1220
*/
1221
box.dialog-vbox scrolledwindow.related {
1223
border: 1px solid theme-color.divider(theme-color.$on-surface);
1224
background-clip: padding-box;
1225
background-color: theme-color.$surface-z1;
1226
}
1227
list.categories {
1229
background-image: image(theme-color.$surface-z0);
1230
}
1231
/**
1233
* Boxes
1234
*/
1235
.transparent-bg + stack overlay > label {
1237
min-height: 24px;
1238
padding: 0 4px;
1239
border-radius: theme.$corner-radius;
1240
background-color: theme-color.$scrim;
1241
color: theme-color.$on-scrim;
1242
}
1243
/**
1245
* Evince
1246
*/
1247
// Color is needed for Evince to match hardcoded background-color,
1249
// since Documents app is also uses this style, background-color needs to be set accordingly.
1250
evview.content-view.view:selected {
1251
background-color: theme-color.$primary;
1252
color: theme-color.$on-primary;
1253
}
1254
/**
1256
* Polari
1257
*/
1258
// The hard-coded CSS:
1260
// https://gitlab.gnome.org/GNOME/polari/blob/master/data/resources/application.css
1261
// background-color is needed to match hard-coded row colors.
1263
// Just $primary is too harsh for activated rows, so add transparency.
1264
.polari-room-list row:selected {
1265
background-color: rgba(theme-color.$primary, .5);
1266
}
1267
/**
1269
* Fractal
1270
*/
1271
.message-input-area button {
1273
@extend %button-flat-activatable;
1274
}
1275
// To display the drop shadow
1277
button.osd.scroll_button {
1278
margin: 4px;
1279
}
1280
/**
1282
* Mines
1283
*/
1284
grid.minefield > button.tile {
1286
border-style: solid;
1287
}
1288