ASCII text
1
/************
2
* Nautilus *
3
************/
4
// based css:
5
// https://git.gnome.org/browse/nautilus/tree/src/resources/css/Adwaita.css
6
// hard-coded css:
7
// https://git.gnome.org/browse/nautilus/tree/src/resources/css/nautilus.css
8
.nautilus-window,
10
.nautilus-window notebook,
11
.nautilus-window notebook > stack {
12
background: $base_color;
13
}
14
.nautilus-canvas-item {
16
// border-radius: $md_radius;
17
}
18
.nautilus-canvas-item.dim-label,
20
.nautilus-list-dim-label {
21
// @extend .dim-label;
22
}
23
.nautilus-desktop.nautilus-canvas-item {
25
// background-color: scale-alpha(#000000, $lower_opacity);
26
color: $inversed_fg_color;
27
text-shadow: $z-depth-1;
28
}
29
.nautilus-desktop.nautilus-canvas-item:selected {
31
// color: $inversed_fg_color;
32
text-shadow: none;
33
}
34
// Toolbar
36
@keyframes needs_attention_keyframes {
37
from { background-color: transparent; }
38
to { background-color: $track_color; }
39
}
40
.nautilus-operations-button-needs-attention {
42
color: $accent_color;
43
animation: needs_attention_keyframes $longer_duration $standard_curve 2 alternate;
44
}
45
.nautilus-operations-button-needs-attention-multiple {
47
color: $accent_color;
48
animation: needs_attention_keyframes $longer_duration $standard_curve 4 alternate;
49
}
50
// Floating status bar
52
.nautilus-window .floating-bar {
53
@extend %osd;
54
// @extend .toolbar.osd;
56
min-height: 32px;
58
padding: 0;
59
border-style: solid solid none;
60
border-width: 1px;
61
border-color: $borders_color;
62
border-radius: (2px + 1px) (2px + 1px) 0 0;
63
background-color: $base_color;
64
background-clip: $extra_background_clip;
65
transition: $longer_transition, border-width 0;
66
&.bottom.left { // axes left border and border radius
68
margin-right: 8px - 1px;
69
border-left-style: none;
70
border-top-left-radius: 0;
71
}
72
&.bottom.right { // axes right border and border radius
74
margin-left: 8px - 1px;
75
border-right-style: none;
76
border-top-right-radius: 0;
77
}
78
button {
80
margin: (32px - $small_size) / 2;
81
@extend %small_button;
83
}
84
}
85
.disk-space-display {
87
// border-style: solid;
88
// border-width: 2px;
89
}
90
.disk-space-display.unknown {
92
background-color: $warning_color;
93
}
94
.disk-space-display.used {
96
background-color: $primary_color;
97
}
98
.disk-space-display.free {
100
background-color: $track_color;
101
color: $disabled_fg_color;
102
}
103
// View
105
.nautilus-list-view .view {
106
// border-bottom: 1px solid $borders_color;
107
}
108
// Hide superfluous treeview drop target indication
110
.nautilus-list-view .view.dnd {
111
// border-style: none;
112
}
113
// Libgd tag entries in the search. Sadly it requires this copy pasted css style.
115
// https://git.gnome.org/browse/libgd/tree/libgd/gd-tagged-entry-default.css
116
.documents-entry-tag {
117
// min-height: 24px;
118
margin: 3px -2px 3px 8px;
119
padding: 0 8px;
120
border-radius: $circular_radius;
121
box-shadow: none;
122
background-color: $primary_color;
123
color: $inversed_fg_color;
124
&:hover { box-shadow: $z-depth-1; }
126
}
127
.documents-entry-tag.button {
129
// @extend %simple_flat_button;
130
// min-height: 24px;
132
// min-width: 24px;
133
margin: 0 -2px;
134
padding: 4px;
135
border-radius: $circular_radius;
136
box-shadow: none;
137
color: $secondary_inversed_fg_color;
138
&:hover, &:active { color: $inversed_fg_color; }
140
}
141
// Workaround for the double border of the searchbar since we use a revealer which
143
// always allocates at least 1 pixel
144
.nautilus-window searchbar { border-top: 1px solid $borders_color; }
145
.nautilus-window .searchbar-container { margin-top: -1px; }
147
.nautilus-window headerbar > revealer > button { @extend %circular_button; }
149
.conflict-row:not(:selected) { background-color: mix($warning_color, $base_color, percentage($lower_opacity)); }
151
dialog.background > box.dialog-vbox.vertical > grid.horizontal {
153
> scrolledwindow.frame { border-style: none; }
154
> box.horizontal:last-child {
156
margin: -6px 0 0 -6px;
157
border-top: 1px solid $borders_color;
158
> label { margin: 0 8px; }
160
> box > button { border-radius: 0; }
162
}
163
}
164
.nautilus-menu-sort-heading {
166
// min-height: 26px;
167
// padding-left: 5px;
168
// padding-right: 5px;
169
margin: 1px 3px;
170
font-weight: 500;
171
&:disabled { color: $tertiary_fg_color; }
173
}
174
.nautilus-window > popover.menu {
176
padding: 3px;
177
> stack > box > box > box {
179
margin-top: -6px;
180
> box {
182
margin-bottom: -6px;
183
&.linked { margin-top: 1px; }
185
}
186
}
187
separator { margin-bottom: -2px; }
189
}
190
/*********
193
* gedit *
194
*********/
195
// based css:
196
// https://git.gnome.org/browse/gedit/tree/gedit/resources/css/gedit.adwaita.css
197
// hard-coded css:
198
// https://git.gnome.org/browse/gedit/tree/gedit/resources/css/gedit-style.css
199
// Only normal state is handle
201
.open-document-selector-name-label {
202
font-weight: bold;
203
}
204
// Only normal state is handle
206
.open-document-selector-path-label {
207
color: gtkalpha(currentColor, $hint_opacity);
208
font-size: smaller;
209
// @extend .dim-label;
211
}
212
.gedit-document-panel {
214
background-color: $lighter_bg_color;
215
}
216
.gedit-document-panel-group-row {
218
border-top: 1px solid $borders_color;
219
}
220
.gedit-document-panel-group-row:first-child {
222
border-top: none;
223
}
224
// Try to look as the notebook tab close button
226
.gedit-document-panel row button.flat {
227
margin-top: 8px;
228
margin-bottom: 8px;
229
@extend %small_button;
231
}
232
.gedit-side-panel-paned statusbar {
234
border-top: 1px solid $borders_color;
235
}
236
.gedit-search-slider {
238
margin: 4px 4px 8px;
239
entry {
241
&:dir(ltr),
242
&:dir(rtl) { // specificity bump
243
border-radius: 2px;
244
.gedit-search-entry-occurrences-tag {
246
all: unset;
247
color: gtkalpha(currentColor, $hint_opacity);
248
}
249
}
250
$buttons_width: $small_size * 2 + $container_padding * 3;
252
&:dir(ltr) {
254
margin-right: -$buttons_width;
255
padding-right: $buttons_width;
256
.gedit-search-entry-occurrences-tag { margin-left: $container_padding; }
258
image.right { margin-right: 0; }
260
}
261
&:dir(rtl) {
263
margin-left: -$buttons_width;
264
padding-left: $buttons_width;
265
.gedit-search-entry-occurrences-tag { margin-right: $container_padding; }
267
image.left { margin-left: 0; }
269
}
270
&.error ~ button {
272
color: $secondary_inversed_fg_color;
273
&:hover, &:active { color: $inversed_fg_color; }
275
&:disabled { color: $disabled_secondary_inversed_fg_color; }
277
}
278
}
279
button {
281
border: solid $container_padding transparent;
282
@extend %simple_flat_button;
284
&:dir(ltr),
286
&:dir(rtl) { @extend %small_button; } // specificity bump
287
&:last-child:dir(ltr),
289
&:not(:first-child):dir(rtl) { margin-left: -$container_padding / 2; }
290
&:first-child:dir(rtl),
292
&:not(:last-child):dir(ltr) { margin-right: -$container_padding / 2; }
293
}
294
}
295
frame.gedit-map-frame > border {
297
&:dir(ltr) { border-style: none none none solid; }
298
&:dir(rtl) { border-style: none solid none none; }
299
}
300
/**************
303
* Tweak Tool *
304
**************/
305
// hard-coded css:
306
// https://git.gnome.org/browse/gnome-tweak-tool/tree/data/shell.css
307
// the sidebar
309
.tweak-categories {
310
// padding: 4px 0;
311
// background-color: shade(@theme_bg_color, 0.99);
312
background-image: image($lighter_bg_color);
313
// hide separators
315
separator {
316
min-width: 0;
317
min-height: 0;
318
background: transparent;
319
}
320
}
321
.tweak {
323
padding: 3px;
324
// padding-top: 3px;
325
&.title:hover { box-shadow: none; }
327
}
328
.tweak-group-white,
330
.tweak-white,
331
.tweak-white:hover {
332
// background-color: white;
333
background-image: image($base_color);
334
}
335
.tweak-startup,
337
.tweak-startup:hover {
338
// background-color: lighter(shade(@theme_bg_color, 0.9));
339
background-image: image($base_color);
340
}
341
.tweak-group-startup {
343
// background-color: @view_separators;
344
background-image: image($base_color);
345
border: 1px solid $borders_color;
346
}
347
/***********
350
* Builder *
351
***********/
352
// based css:
353
// https://git.gnome.org/browse/gnome-builder/tree/data/theme
354
// hard-coded css:
355
// https://git.gnome.org/browse/gnome-builder/tree/data/theme/shared.css
356
// Titlebar adjustments for workbench
358
//
359
// This is needed due to our placement of headerbar inside of a
360
// stack. We were seeing black edges around the header bar, and
361
// improper radius on the headerbar.
362
//
363
workbench stack.titlebar {
364
padding: 0;
365
// box-shadow: none;
366
}
367
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
369
border-radius: 2px 2px 0 0;
370
// box-shadow: none;
371
}
372
perspectiveswitcher {
374
background-color: $bg_color;
375
}
376
perspectiveswitcher button:checked {
378
color: $primary_color;
379
}
380
// Layout tab and tab bar tweaks
382
// The following makes the layout stack header look similar to a tab bar.
383
layouttabbar {
384
border-bottom: 1px solid $borders_color;
385
background-color: $bg_color;
386
}
387
layouttabbar button { @extend %flat_button; }
389
layouttabbar > box > button {
391
margin: (40px - $medium_size) / 2 0;
392
// border-radius: 0;
393
}
394
layouttab {
396
margin: 0 8px; // not working
397
border-style: none solid;
398
border-width: 1px;
399
border-color: $borders_color;
400
box-shadow: inset 0 -2px $primary_color;
401
background-color: $base_color;
402
}
403
layouttab separator.vertical {
405
margin: 8px 4px;
406
}
407
layouttab button {
409
&.text-button, &.image-button, & {
410
margin-top: 8px;
411
margin-bottom: 8px;
412
padding: 0 4px;
413
}
414
}
415
// Close button styling for layouttab.
417
layouttab > box > button.close {
418
border-radius: $circular_radius;
419
}
420
layout {
422
border: 1px solid $borders_color;
423
-PnlDockBin-handle-size: 1;
424
}
425
entry.search-missing {
427
background-color: $error_color;
428
color: $inversed_fg_color;
429
}
430
// tweak icons for treeviews
432
workbench treeview.image { color: gtkalpha(currentColor, $hint_opacity); }
433
workbench treeview.image:selected { color: $tertiary_inversed_fg_color; }
434
dockbin {
436
border: 1px solid $borders_color;
437
-PnlDockBin-handle-size: 1;
438
}
439
dockpaned {
441
border: 1px solid $borders_color;
442
}
443
eggsearchbar box.search-bar {
445
padding: 0 8px;
446
border-bottom: 1px solid $borders_color;
447
background-color: $bg_color;
448
}
449
docktabstrip {
451
padding: 0 8px;
452
border-bottom: 1px solid $borders_color;
453
background-color: $bg_color;
454
}
455
docktab {
457
transition: $longer_transition;
458
min-height: $small_size;
459
min-width: $small_size;
460
margin-bottom: -1px;
461
padding: $container_padding 6px;
462
outline-offset: -6px;
464
border-width: 1px; // for reorderable tabs
466
border-color: transparent; //
467
color: $secondary_fg_color;
469
font-weight: 500;
470
&:hover {
472
box-shadow: inset 0 -2px $track_color;
473
color: $fg_color;
474
}
475
&:checked {
477
animation: tab_ripple_effect $longer_duration * 3 $deceleration_curve;
478
box-shadow: inset 0 -2px $primary_color;
479
color: $fg_color;
480
}
481
}
482
dockoverlayedge {
484
background-color: $bg_color;
485
}
486
dockoverlayedge docktabstrip {
488
padding: 0;
489
border: none;
490
}
491
dockoverlayedge.left-edge docktab {
493
&:hover { box-shadow: inset -2px 0 $track_color; }
494
&:checked { box-shadow: inset -2px 0 $primary_color; }
495
}
496
dockoverlayedge.right-edge docktab {
498
&:hover { box-shadow: inset 2px 0 $track_color; }
499
&:checked { box-shadow: inset 2px 0 $primary_color; }
500
}
501
pillbox {
503
background-color: $bg_color;
504
border-radius: 2px;
505
}
506
buildperspective row {
508
padding: 10px;
509
}
510
layoutpane entry.search {
512
@extend %entry.flat;
513
box-shadow: inset 0 -1px $borders_color;
515
background-color: $base_color;
516
}
517
editortweak entry.search {
519
@extend %entry.flat;
520
margin-bottom: -1px;
522
box-shadow: none;
523
}
524
//
526
// let's tweak hard-coded elements
527
//
528
// styling for editor search
530
frame.gb-search-frame {
531
// border-bottom-left-radius: 5px;
532
border-bottom-right-radius: 5px;
533
}
534
.gb-search-entry-occurrences-tag {
536
box-shadow: none;
537
background-color: transparent;
538
}
539
// Keep search bar and layouttab height in sync.
541
docktabstrip {
542
min-height: 39px;
543
}
544
layouttabbar > box {
546
// min-height: 39px;
547
}
548
eggsearchbar > revealer > box {
550
// min-height: 39px;
551
}
552
eggsearchbar entry {
554
// min-height: 24px;
555
}
556
workbench preferences preferencesgroup list entry {
558
// background: none;
559
// min-height: 0px;
560
padding-top: 8px;
561
padding-bottom: 8px;
562
}
563
/**********
566
* Photos *
567
**********/
568
// based css:
569
// https://git.gnome.org/browse/gnome-photos/tree/data/Adwaita.css
570
GdMainIconView.content-view {
572
-GdMainIconView-icon-size: 48;
573
}
574
// Make spinner visible on both dark and bright backgrounds w/o making
576
// it look ugly/weird.
577
GdMainIconView.content-view.cell:active {
578
// color: $tertiary_fg_color;
579
}
580
.documents-counter {
582
margin: 8px;
583
border-radius: $circular_radius;
584
box-shadow: $z-depth-2;
585
background-color: $accent_color;
586
color: $inversed_fg_color;
587
font-weight: bold;
588
}
589
.photos-entry-tag {
591
@extend .documents-entry-tag;
592
}
593
.documents-scrolledwin.frame {
595
border-style: none;
596
}
597
.photos-icon-bg {
599
}
600
.photos-fade-in {
602
opacity: 1;
603
transition: opacity $shorter_duration $deceleration_curve;
604
}
605
.photos-fade-out {
607
opacity: 0;
608
transition: opacity $shorter_duration $deceleration_curve;
609
}
610
.photos-collection-icon {
612
}
613
overlay grid.horizontal > revealer > scrolledwindow.frame {
615
&:dir(ltr) { border-style: none none none solid; }
616
&:dir(rtl) { border-style: none solid none none; }
617
}
618
/*********
621
* Music *
622
*********/
623
// hard-coded css:
624
// https://git.gnome.org/browse/gnome-music/tree/data/application.css
625
.side-panel:dir(ltr) {
627
// border-width: 0 1px 0 0;
628
border-style: solid;
629
border-color: $borders_color;
630
}
631
.side-panel:dir(rtl) {
633
// border-width: 0 0 0 1px;
634
border-style: solid;
635
border-color: $borders_color;
636
}
637
.side-panel .view {
639
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
640
background-image: image($lighter_bg_color);
641
&:hover { background-image: image(mix($fg_color, $lighter_bg_color, percentage(0.05))); }
643
}
644
.side-panel .view:selected {
646
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
647
background-image: image($primary_color);
648
&:hover { background-image: image(mix($inversed_fg_color, $primary_color, percentage(0.05))); }
650
}
651
.playlists-list {
653
// box-shadow: inset 0 -1px @view_separators;
654
}
655
.songs-list {
657
// box-shadow: inset 0 1px shade(@borders, 1.30);
658
// background-color: @theme_bg_color;
659
&:hover { background-image: image($row_track_color); }
661
}
662
frame.documents-dropdown {
664
@extend toolbar.osd;
665
margin: 8px;
667
> border { border: none; }
669
}
670
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
672
border-bottom: 1px solid $borders_color;
673
button > widget {
675
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
676
// -GtkArrow-arrow-scaling: 1;
677
}
678
}
679
/*********
682
* To Do *
683
*********/
684
task-row {
685
transition: $shorter_transition;
686
margin: 0 -4px;
687
&:hover { transition: none; }
689
label { margin: 0 8px; }
691
image { margin: 0 4px; }
693
}
694
task-list-view > box > revealer > box > button {
696
min-height: $medium_size;
697
margin: -4px;
698
padding: 0 12px;
699
label { margin: 0 8px; }
701
image { margin: 0 4px; }
703
}
704
/*******
707
* eog *
708
*******/
709
#eog-thumb-nav {
710
scrolledwindow { border-top: none; }
711
button { -gtk-outline-radius: 2px; }
713
}
714
/*************
717
* Evolution *
718
*************/
719
frame.taskbar > border { border-style: solid none none; }
720
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
722
/********
725
* gitg *
726
********/
727
frame.commit-frame > border { border-style: solid none none; }
728
/**************
731
* Characters *
732
**************/
733
box.dialog-vbox scrolledwindow.related { border: 1px solid $borders_color; }
734
list.categories { background-image: image($lighter_bg_color); }
736
/**************
739
* Calculator *
740
**************/
741
button.title label { min-height: $medium_size; }
742
/************
745
* Terminix *
746
************/
747
.terminix-background box.vertical > widget > box.horizontal {
748
padding: 3px 0 2px;
749
// border-bottom: 1px solid $borders_color;
750
button {
752
padding: 4px 8px;
753
&.image-button { padding: 4px; }
755
}
756
}
757
.terminix-background revealer > frame > border {
759
// border-style: none none solid;
760
border-style: none;
761
}
762
button.image-button.session-new-button { min-width: $medium_size - 4px; }
764
overlay > revealer.left > scrolledwindow.frame,
766
overlay > revealer.right > scrolledwindow.frame {
767
border-style: none;
768
box-shadow: $z-depth-4;
769
}
770
overlay > revealer.left > scrolledwindow.frame {
772
margin-right: 32px;
773
// border-style: none solid none none;
774
}
775
overlay > revealer.right > scrolledwindow.frame {
777
margin-left: 32px;
778
// border-style: none none none solid;
779
}
780
.terminix-session-sidebar { background-image: image($lighter_bg_color); }
782
/***********
785
* Eclipse *
786
***********/
787
window.background > box.vertical > scrolledwindow > widget toolbar {
788
padding: 2px;
789
separator,
791
button { margin: 2px; }
792
button { border-radius: 2px; }
794
}
795
/***********
798
* Firefox *
799
***********/
800
window.background > widget > menubar {
801
color: $secondary_inversed_fg_color;
802
&:hover { color: $inversed_fg_color; }
804
&:disabled { color: $disabled_secondary_inversed_fg_color; }
806
}
807
window.background > menu > menuitem > label:disabled { color: $disabled_fg_color; }
809
window.background > window.background > menu > separator { color: $borders_color; }
811
window.background > widget > frame { color: rgba(0, 0, 0, 0.2); }
813
window.background > widget > checkbutton > check,
815
window.background > widget > radiobutton > radio {
816
margin: 0;
817
padding: 0;
818
}
819
window.background > widget > radiobutton > radio:checked {
821
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")),
822
-gtk-recolor(url("assets/radio-checked-symbolic.png")));
823
border-image: none;
824
}
825
/***********
828
* Synapse *
829
***********/
830
window.background > box.vertical > widget > widget:selected { background-color: $primary_color; }
831
/*********
834
* Unity *
835
*********/
836
// based css:
837
// http://bazaar.launchpad.net/~ubuntu-art-pkg/ubuntu-themes/trunk/view/head:/Ambiance/gtk-3.20/apps/unity.css
838
// Decorations
840
UnityDecoration {
841
-UnityDecoration-extents: 28px 0 0 0;
842
-UnityDecoration-input-extents: 8px;
843
-UnityDecoration-shadow-offset-x: 0;
845
-UnityDecoration-shadow-offset-y: 3px;
846
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
847
-UnityDecoration-active-shadow-radius: 18px;
848
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
849
-UnityDecoration-inactive-shadow-radius: 6px;
850
-UnityDecoration-glow-size: 8px;
852
-UnityDecoration-glow-color: $primary_color;
853
-UnityDecoration-title-indent: 4px;
855
-UnityDecoration-title-fade: 32px;
856
-UnityDecoration-title-alignment: 0.0;
857
}
858
UnityDecoration.top {
860
padding: 0 2px;
861
border-style: none;
862
border-radius: 2px 2px 0 0;
863
// box-shadow: inset 0 1px $secondary_highlight_color;
864
box-shadow: inset 0 1px scale-alpha(#FFFFFF, 0.1);
865
background-color: $secondary_titlebar_color;
866
color: $inversed_fg_color;
867
}
868
UnityDecoration.top:backdrop {
870
color: $secondary_inversed_fg_color;
871
}
872
UnityDecoration.left,
874
UnityDecoration.right {
875
}
876
UnityDecoration.bottom {
878
}
879
UnityDecoration.menuitem,
881
UnityDecoration .menuitem {
882
color: gtkalpha(currentColor, $enabled_opacity);
883
}
884
UnityDecoration.menubar.menuitem:hover,
886
UnityDecoration.menubar .menuitem *:hover {
887
box-shadow: inset 0 -2px currentColor;
888
background-color: transparent;
889
color: currentColor;
890
}
891
.background:not(.csd) headerbar:not(.titlebar) {
893
border-radius: 0;
894
box-shadow: none;
895
&.inline-toolbar { border-style: none; }
897
}
898
SheetStyleDialog.unity-force-quit {
900
// background-color: $bg_color;
901
}
902
// Panel Style
904
UnityPanelWidget,
905
.unity-panel {
906
background-color: $topbar_color;
907
background-image: image($topbar_color);
908
color: $inversed_fg_color;
909
}
910
UnityPanelWidget:backdrop,
912
.unity-panel:backdrop {
913
color: $secondary_inversed_fg_color;
914
}
915
.unity-panel.menubar,
917
.unity-panel .menubar {
918
}
919
.unity-panel.menuitem,
921
.unity-panel .menuitem {
922
color: gtkalpha(currentColor, $enabled_opacity);
923
}
924
.unity-panel.menubar.menuitem:hover,
926
.unity-panel.menubar .menuitem *:hover {
927
box-shadow: inset 0 -2px currentColor;
928
background-color: transparent;
929
color: currentColor;
930
}
931
@keyframes playbackmenuitem_spinner {
933
to { -gtk-icon-transform: rotate(1turn); }
934
}
935
.menu IdoPlaybackMenuItem.menuitem:active {
937
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
938
animation: playbackmenuitem_spinner 1s infinite linear;
939
color: $primary_color;
940
}
941