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
/*********
152
* gedit *
153
*********/
154
// based css:
155
// https://git.gnome.org/browse/gedit/tree/gedit/resources/css/gedit.adwaita.css
156
// hard-coded css:
157
// https://git.gnome.org/browse/gedit/tree/gedit/resources/css/gedit-style.css
158
// Only normal state is handle
160
.open-document-selector-name-label {
161
font-weight: bold;
162
}
163
// Only normal state is handle
165
.open-document-selector-path-label {
166
color: gtkalpha(currentColor, $hint_opacity);
167
font-size: smaller;
168
// @extend .dim-label;
170
}
171
.gedit-document-panel {
173
background-color: $lighter_bg_color;
174
}
175
.gedit-document-panel-group-row {
177
border-top: 1px solid $borders_color;
178
}
179
.gedit-document-panel-group-row:first-child {
181
border-top: none;
182
}
183
// Try to look as the notebook tab close button
185
.gedit-document-panel row button.flat {
186
margin-top: 8px;
187
margin-bottom: 8px;
188
@extend %small_button;
190
}
191
.gedit-side-panel-paned statusbar {
193
border-top: 1px solid $borders_color;
194
}
195
.gedit-search-slider {
197
margin: 4px 4px 8px;
198
entry {
200
&:dir(ltr),
201
&:dir(rtl) { // specificity bump
202
border-radius: 2px;
203
.gedit-search-entry-occurrences-tag {
205
all: unset;
206
color: gtkalpha(currentColor, $hint_opacity);
207
}
208
}
209
$buttons_width: $small_size * 2 + $container_padding * 3;
211
&:dir(ltr) {
213
margin-right: -$buttons_width;
214
padding-right: $buttons_width;
215
.gedit-search-entry-occurrences-tag { margin-left: $container_padding; }
217
image.right { margin-right: 0; }
219
}
220
&:dir(rtl) {
222
margin-left: -$buttons_width;
223
padding-left: $buttons_width;
224
.gedit-search-entry-occurrences-tag { margin-right: $container_padding; }
226
image.left { margin-left: 0; }
228
}
229
&.error ~ button {
231
color: $secondary_inversed_fg_color;
232
&:hover, &:active { color: $inversed_fg_color; }
234
&:disabled { color: $disabled_secondary_inversed_fg_color; }
236
}
237
}
238
button {
240
border: solid $container_padding transparent;
241
@extend %simple_flat_button;
243
&:dir(ltr),
245
&:dir(rtl) { @extend %small_button; } // specificity bump
246
&:last-child:dir(ltr),
248
&:not(:first-child):dir(rtl) { margin-left: -$container_padding / 2; }
249
&:first-child:dir(rtl),
251
&:not(:last-child):dir(ltr) { margin-right: -$container_padding / 2; }
252
}
253
}
254
frame.gedit-map-frame > border {
256
&:dir(ltr) { border-style: none none none solid; }
257
&:dir(rtl) { border-style: none solid none none; }
258
}
259
/**************
262
* Tweak Tool *
263
**************/
264
// hard-coded css:
265
// https://git.gnome.org/browse/gnome-tweak-tool/tree/data/shell.css
266
// the sidebar
268
.tweak-categories {
269
// padding: 4px 0;
270
// background-color: shade(@theme_bg_color, 0.99);
271
background-image: image($lighter_bg_color);
272
// hide separators
274
separator {
275
min-width: 0;
276
min-height: 0;
277
background: transparent;
278
}
279
}
280
.tweak {
282
padding: 3px;
283
// padding-top: 3px;
284
&.title:hover { box-shadow: none; }
286
}
287
.tweak-group-white,
289
.tweak-white,
290
.tweak-white:hover {
291
// background-color: white;
292
background-image: image($base_color);
293
}
294
.tweak-startup,
296
.tweak-startup:hover {
297
// background-color: lighter(shade(@theme_bg_color, 0.9));
298
background-image: image($base_color);
299
}
300
.tweak-group-startup {
302
// background-color: @view_separators;
303
background-image: image($base_color);
304
border: 1px solid $borders_color;
305
}
306
/***********
309
* Builder *
310
***********/
311
// based css:
312
// https://git.gnome.org/browse/gnome-builder/tree/data/theme
313
// hard-coded css:
314
// https://git.gnome.org/browse/gnome-builder/tree/data/theme/shared.css
315
// Titlebar adjustments for workbench
317
//
318
// This is needed due to our placement of headerbar inside of a
319
// stack. We were seeing black edges around the header bar, and
320
// improper radius on the headerbar.
321
//
322
workbench stack.titlebar {
323
padding: 0;
324
// box-shadow: none;
325
}
326
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
328
border-radius: 2px 2px 0 0;
329
// box-shadow: none;
330
}
331
perspectiveswitcher {
333
background-color: $bg_color;
334
}
335
perspectiveswitcher button:checked {
337
color: $primary_color;
338
}
339
// Layout tab and tab bar tweaks
341
// The following makes the layout stack header look similar to a tab bar.
342
layouttabbar {
343
border-bottom: 1px solid $borders_color;
344
background-color: $bg_color;
345
}
346
layouttabbar button { @extend %flat_button; }
348
layouttabbar > box > button {
350
margin: (40px - $medium_size) / 2 0;
351
// border-radius: 0;
352
}
353
layouttab {
355
margin: 0 8px; // not working
356
border-style: none solid;
357
border-width: 1px;
358
border-color: $borders_color;
359
box-shadow: inset 0 -2px $primary_color;
360
background-color: $base_color;
361
}
362
layouttab separator.vertical {
364
margin: 8px 4px;
365
}
366
layouttab button {
368
&.text-button, &.image-button, & {
369
margin-top: 8px;
370
margin-bottom: 8px;
371
padding: 0 4px;
372
}
373
}
374
// Close button styling for layouttab.
376
layouttab > box > button.close {
377
border-radius: $circular_radius;
378
}
379
layout {
381
border: 1px solid $borders_color;
382
-PnlDockBin-handle-size: 1;
383
}
384
entry.search-missing {
386
background-color: $error_color;
387
color: $inversed_fg_color;
388
}
389
// tweak icons for treeviews
391
workbench treeview.image { color: gtkalpha(currentColor, $hint_opacity); }
392
workbench treeview.image:selected { color: $tertiary_inversed_fg_color; }
393
dockbin {
395
border: 1px solid $borders_color;
396
-PnlDockBin-handle-size: 1;
397
}
398
dockpaned {
400
border: 1px solid $borders_color;
401
}
402
eggsearchbar box.search-bar {
404
padding: 0 8px;
405
border-bottom: 1px solid $borders_color;
406
background-color: $bg_color;
407
}
408
docktabstrip {
410
padding: 0 8px;
411
border-bottom: 1px solid $borders_color;
412
background-color: $bg_color;
413
}
414
docktab {
416
transition: $longer_transition,
417
background-size 0,
418
background-image 0;
419
min-height: $small_size;
420
min-width: $small_size;
421
margin-bottom: -1px;
422
padding: $container_padding 6px;
423
outline-offset: -6px;
425
border-width: 1px; // for reorderable tabs
427
border-color: transparent; //
428
background-image: radial-gradient(circle farthest-corner at center,
430
$primary_color 10%,
431
transparent 0%);
432
background-repeat: no-repeat;
433
background-position: center;
434
background-size: 0% 0%;
435
color: $secondary_fg_color;
437
font-weight: 500;
438
&:hover {
440
box-shadow: inset 0 -2px $track_color;
441
color: $fg_color;
442
}
443
&:checked {
445
transition: $longer_transition,
446
background-size $longer_duration $deceleration_curve,
447
background-image $longer_duration + $ripple_duration $deceleration_curve;
448
box-shadow: inset 0 -2px $primary_color;
449
background-image: radial-gradient(circle farthest-corner at center,
450
transparent 10%,
451
transparent 0%);
452
background-size: 1000% 1000%;
453
color: $fg_color;
454
}
455
}
456
dockoverlayedge {
458
background-color: $bg_color;
459
}
460
dockoverlayedge docktabstrip {
462
padding: 0;
463
border: none;
464
}
465
dockoverlayedge.left-edge docktab {
467
&:hover { box-shadow: inset -2px 0 $track_color; }
468
&:checked { box-shadow: inset -2px 0 $primary_color; }
469
}
470
dockoverlayedge.right-edge docktab {
472
&:hover { box-shadow: inset 2px 0 $track_color; }
473
&:checked { box-shadow: inset 2px 0 $primary_color; }
474
}
475
pillbox {
477
background-color: $bg_color;
478
border-radius: 2px;
479
}
480
buildperspective row {
482
padding: 10px;
483
}
484
layoutpane entry.search {
486
@extend %entry.flat;
487
box-shadow: inset 0 -1px $borders_color;
489
background-color: $base_color;
490
}
491
editortweak entry.search {
493
@extend %entry.flat;
494
margin-bottom: -1px;
496
box-shadow: none;
497
}
498
//
500
// let's tweak hard-coded elements
501
//
502
// styling for editor search
504
frame.gb-search-frame {
505
// border-bottom-left-radius: 5px;
506
border-bottom-right-radius: 5px;
507
}
508
.gb-search-entry-occurrences-tag {
510
box-shadow: none;
511
background-color: transparent;
512
}
513
// Keep search bar and layouttab height in sync.
515
docktabstrip {
516
min-height: 39px;
517
}
518
layouttabbar > box {
520
// min-height: 39px;
521
}
522
eggsearchbar > revealer > box {
524
// min-height: 39px;
525
}
526
eggsearchbar entry {
528
// min-height: 24px;
529
}
530
workbench preferences preferencesgroup list entry {
532
// background: none;
533
// min-height: 0px;
534
padding-top: 8px;
535
padding-bottom: 8px;
536
}
537
/**********
540
* Photos *
541
**********/
542
// based css:
543
// https://git.gnome.org/browse/gnome-photos/tree/data/Adwaita.css
544
GdMainIconView.content-view {
546
-GdMainIconView-icon-size: 48;
547
}
548
// Make spinner visible on both dark and bright backgrounds w/o making
550
// it look ugly/weird.
551
GdMainIconView.content-view.cell:active {
552
// color: $tertiary_fg_color;
553
}
554
.documents-counter {
556
margin: 8px;
557
border-radius: $circular_radius;
558
box-shadow: $z-depth-2;
559
background-color: $accent_color;
560
color: $inversed_fg_color;
561
font-weight: bold;
562
}
563
.photos-entry-tag {
565
@extend .documents-entry-tag;
566
}
567
.documents-scrolledwin.frame {
569
border-style: none;
570
}
571
.photos-icon-bg {
573
}
574
.photos-fade-in {
576
opacity: 1;
577
transition: opacity $shorter_duration $deceleration_curve;
578
}
579
.photos-fade-out {
581
opacity: 0;
582
transition: opacity $shorter_duration $deceleration_curve;
583
}
584
.photos-collection-icon {
586
}
587
overlay grid.horizontal > revealer > scrolledwindow.frame {
589
&:dir(ltr) { border-style: none none none solid; }
590
&:dir(rtl) { border-style: none solid none none; }
591
}
592
/*********
595
* Music *
596
*********/
597
// hard-coded css:
598
// https://git.gnome.org/browse/gnome-music/tree/data/application.css
599
.side-panel:dir(ltr) {
601
// border-width: 0 1px 0 0;
602
border-style: solid;
603
border-color: $borders_color;
604
}
605
.side-panel:dir(rtl) {
607
// border-width: 0 0 0 1px;
608
border-style: solid;
609
border-color: $borders_color;
610
}
611
.side-panel .view {
613
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
614
background-image: image($lighter_bg_color);
615
&:hover { background-image: image(mix($fg_color, $lighter_bg_color, percentage(0.05))); }
617
}
618
.side-panel .view:selected {
620
// background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
621
background-image: image($primary_color);
622
&:hover { background-image: image(mix($inversed_fg_color, $primary_color, percentage(0.05))); }
624
}
625
.playlists-list {
627
// box-shadow: inset 0 -1px @view_separators;
628
}
629
.songs-list {
631
// box-shadow: inset 0 1px shade(@borders, 1.30);
632
// background-color: @theme_bg_color;
633
&:hover { background-image: image($row_track_color); }
635
}
636
frame.documents-dropdown {
638
@extend toolbar.osd;
639
margin: 8px;
641
> border { border: none; }
643
}
644
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
646
border-bottom: 1px solid $borders_color;
647
button > widget {
649
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
650
// -GtkArrow-arrow-scaling: 1;
651
}
652
}
653
/*********
656
* To Do *
657
*********/
658
task-row {
659
transition: $shorter_transition;
660
margin: 0 -4px;
661
&:hover { transition: none; }
663
label { margin: 0 8px; }
665
image { margin: 0 4px; }
667
}
668
task-list-view > box > revealer > box > button {
670
min-height: $medium_size;
671
margin: -4px;
672
padding: 0 12px;
673
label { margin: 0 8px; }
675
image { margin: 0 4px; }
677
}
678
/*******
681
* eog *
682
*******/
683
#eog-thumb-nav {
684
scrolledwindow { border-top: none; }
685
button { -gtk-outline-radius: 2px; }
687
}
688
/*************
691
* Evolution *
692
*************/
693
frame.taskbar > border { border-style: solid none none; }
694
box.vertical > paned.horizontal notebook widget .frame { border-style: none; }
696
/********
699
* gitg *
700
********/
701
frame.commit-frame > border { border-style: solid none none; }
702
/**************
705
* Characters *
706
**************/
707
box.dialog-vbox scrolledwindow.related { border: 1px solid $borders_color; }
708
list.categories { background-image: image($lighter_bg_color); }
710
/**************
713
* Calculator *
714
**************/
715
button.title label { min-height: $medium_size; }
716
/************
719
* Terminix *
720
************/
721
.terminix-background box.vertical > widget > box.horizontal {
722
padding: 3px 0 2px;
723
// border-bottom: 1px solid $borders_color;
724
button {
726
padding: 4px 8px;
727
&.image-button { padding: 4px; }
729
}
730
}
731
.terminix-background revealer > frame > border {
733
// border-style: none none solid;
734
border-style: none;
735
}
736
button.image-button.session-new-button { min-width: $medium_size - 4px; }
738
overlay > revealer.left > scrolledwindow.frame,
740
overlay > revealer.right > scrolledwindow.frame {
741
border-style: none;
742
box-shadow: $z-depth-4;
743
}
744
overlay > revealer.left > scrolledwindow.frame {
746
margin-right: 32px;
747
// border-style: none solid none none;
748
}
749
overlay > revealer.right > scrolledwindow.frame {
751
margin-left: 32px;
752
// border-style: none none none solid;
753
}
754
.terminix-session-sidebar { background-image: image($lighter_bg_color); }
756
/***********
759
* Eclipse *
760
***********/
761
window.background > box.vertical > scrolledwindow > widget toolbar {
762
padding: 2px;
763
separator,
765
button { margin: 2px; }
766
button { border-radius: 2px; }
768
}
769
/***********
772
* Firefox *
773
***********/
774
window.background > widget > menubar {
775
color: $secondary_topbar_fg_color;
776
&:hover { color: $topbar_fg_color; }
778
&:disabled { color: $disabled_secondary_topbar_fg_color; }
780
}
781
window.background > menu > menuitem > label:disabled { color: $disabled_fg_color; }
783
window.background > window.background > menu > separator { color: $borders_color; }
785
window.background > widget > frame { color: rgba(0, 0, 0, 0.2); }
787
window.background > widget > checkbutton > check,
789
window.background > widget > radiobutton > radio {
790
margin: 0;
791
padding: 0;
792
}
793
window.background > widget > radiobutton > radio:checked {
795
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")),
796
-gtk-recolor(url("assets/radio-checked-symbolic.png")));
797
border-image: none;
798
}
799
/***********
802
* Synapse *
803
***********/
804
window.background > box.vertical > widget > widget:selected { background-color: $primary_color; }
805
/*********
808
* Unity *
809
*********/
810
// based css:
811
// http://bazaar.launchpad.net/~ubuntu-art-pkg/ubuntu-themes/trunk/view/head:/Ambiance/gtk-3.20/apps/unity.css
812
// Decorations
814
UnityDecoration {
815
-UnityDecoration-extents: 28px 0 0 0;
816
-UnityDecoration-input-extents: 8px;
817
-UnityDecoration-shadow-offset-x: 0;
819
-UnityDecoration-shadow-offset-y: 3px;
820
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
821
-UnityDecoration-active-shadow-radius: 18px;
822
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
823
-UnityDecoration-inactive-shadow-radius: 6px;
824
-UnityDecoration-glow-size: 8px;
826
-UnityDecoration-glow-color: $primary_color;
827
-UnityDecoration-title-indent: 4px;
829
-UnityDecoration-title-fade: 32px;
830
-UnityDecoration-title-alignment: 0.0;
831
}
832
UnityDecoration .top {
834
padding: 0 2px;
835
border-style: none;
836
border-radius: 2px 2px 0 0;
837
// box-shadow: inset 0 1px $topbar_highlight_color;
838
box-shadow: inset 0 1px if($light == 'true', scale-alpha(#FFFFFF, 0.2), scale-alpha(#FFFFFF, 0.1));
839
background-color: $secondary_titlebar_color;
840
color: $topbar_fg_color;
841
}
842
UnityDecoration .top:backdrop {
844
color: $secondary_topbar_fg_color;
845
}
846
UnityDecoration .left,
848
UnityDecoration .right {
849
}
850
UnityDecoration .bottom {
852
}
853
UnityDecoration .menuitem {
855
color: gtkalpha(currentColor, $enabled_opacity);
856
}
857
UnityDecoration .menuitem:hover {
859
box-shadow: inset 0 -2px currentColor;
860
background-color: transparent;
861
color: currentColor;
862
}
863
.background:not(.csd) headerbar:not(.titlebar) {
865
border-radius: 0;
866
box-shadow: none;
867
&.inline-toolbar { border-style: none; }
869
}
870
sheet-style-dialog.unity-force-quit {
872
// background-color: $bg_color;
873
}
874
// Panel Style
876
UnityPanelWidget,
877
.unity-panel {
878
background-color: $topbar_color;
879
background-image: image($topbar_color);
880
color: $topbar_fg_color;
881
}
882
UnityPanelWidget:backdrop,
884
.unity-panel:backdrop {
885
color: $secondary_topbar_fg_color;
886
}
887
.unity-panel.menubar,
889
.unity-panel .menubar {
890
}
891
.unity-panel.menuitem,
893
.unity-panel .menuitem {
894
color: gtkalpha(currentColor, $enabled_opacity);
895
}
896
.unity-panel.menubar.menuitem:hover,
898
.unity-panel.menubar .menuitem *:hover {
899
box-shadow: inset 0 -2px currentColor;
900
background-color: transparent;
901
color: currentColor;
902
}
903
@keyframes playbackmenuitem_spinner {
905
to { -gtk-icon-transform: rotate(1turn); }
906
}
907
.menu IdoPlaybackMenuItem.menuitem:active {
909
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
910
animation: playbackmenuitem_spinner 1s infinite linear;
911
color: $primary_color;
912
}
913