Changeset View
Changeset View
Standalone View
Standalone View
src/gtk3/widgets/_sidebar.scss
1 | @charset "UTF-8"; | 1 | @charset "UTF-8"; | ||
---|---|---|---|---|---|
2 | 2 | | |||
3 | /*********** | 3 | /*********** | ||
4 | * Sidebar * | 4 | * Sidebar * | ||
5 | ***********/ | 5 | ***********/ | ||
6 | 6 | | |||
7 | @mixin selected-item-highlight { | ||||
8 | @if $new-highlight { | ||||
9 | background-color: gtk("@theme_selected_bg_color"); | ||||
10 | color: gtk("@theme_button_foreground_active"); | ||||
11 | border-right: 3px solid gtk("@theme_button_decoration_focus"); | ||||
12 | border-top: 0; | ||||
13 | border-bottom: 0; | ||||
14 | border-left: 0; | ||||
15 | border-radius: 0px; | ||||
16 | } | ||||
17 | } | ||||
18 | @mixin selected-item-highlight-rtl { | ||||
19 | @if $new-highlight { | ||||
20 | background-color: gtk("@theme_selected_bg_color"); | ||||
21 | color: gtk("@theme_button_foreground_active"); | ||||
22 | border-left: 3px solid gtk("@theme_button_decoration_focus"); | ||||
23 | border-top: 0; | ||||
24 | border-bottom: 0; | ||||
25 | border-right: 0; | ||||
26 | border-radius: 0px; | ||||
27 | } | ||||
28 | } | ||||
29 | | ||||
7 | .sidebar { | 30 | .sidebar { | ||
8 | border: none; | 31 | border: none; | ||
9 | background-color: w_color(normal); | 32 | background-color: gtk("@theme_bg_color"); | ||
10 | &:selected { | 33 | &:selected { | ||
11 | @extend %selected_items; | 34 | @extend %selected_items; | ||
12 | } | 35 | } | ||
13 | &:backdrop { background-color: backdrop(w_color(normal))} | 36 | &:backdrop { | ||
37 | background-color: gtk("@theme_unfocused_bg_color"); | ||||
38 | } | ||||
39 | row { | ||||
40 | transition: all 150ms $ease-out-quad; | ||||
41 | | ||||
42 | &:hover { transition: none; } | ||||
43 | | ||||
44 | &.activatable { | ||||
45 | border: 0; | ||||
46 | &:dir(ltr) { | ||||
47 | border-right: 3px solid transparent; | ||||
48 | } | ||||
49 | &:dir(rtl) { | ||||
50 | border-left: 3px solid transparent; | ||||
51 | } | ||||
52 | | ||||
53 | &.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411 | ||||
54 | | ||||
55 | &:hover:dir(ltr) { | ||||
56 | @include selected-item-highlight(); | ||||
57 | } | ||||
58 | &:hover:dir(rtl) { | ||||
59 | @include selected-item-highlight-rtl(); | ||||
60 | } | ||||
61 | | ||||
62 | &:active:dir(ltr) { | ||||
63 | @include selected-item-highlight(); | ||||
64 | } | ||||
65 | &:active:dir(rtl) { | ||||
66 | @include selected-item-highlight-rtl(); | ||||
67 | } | ||||
68 | | ||||
69 | &:selected { | ||||
70 | &:dir(ltr) { | ||||
71 | @include selected-item-highlight(); | ||||
72 | } | ||||
73 | &:dir(rtl) { | ||||
74 | @include selected-item-highlight-rtl(); | ||||
75 | } | ||||
76 | | ||||
77 | &:active { | ||||
78 | &:dir(ltr) { | ||||
79 | @include selected-item-highlight(); | ||||
80 | } | ||||
81 | &:dir(rtl) { | ||||
82 | @include selected-item-highlight-rtl(); | ||||
83 | } | ||||
84 | } | ||||
85 | | ||||
86 | &.has-open-popup, | ||||
87 | &:hover { | ||||
88 | &:dir(ltr) { | ||||
89 | @include selected-item-highlight(); | ||||
90 | } | ||||
91 | &:dir(rtl) { | ||||
92 | @include selected-item-highlight-rtl(); | ||||
93 | } | ||||
94 | } | ||||
95 | | ||||
96 | &:backdrop { | ||||
97 | background-color: gtk("@theme_unfocused_selected_bg_color_alt"); | ||||
98 | } | ||||
99 | } | ||||
100 | } | ||||
101 | | ||||
102 | &:selected { @extend %selected_items; } | ||||
103 | } | ||||
14 | } | 104 | } | ||
15 | 105 | | |||
16 | // Places sidebar is a special case, since the view here have to look like chrome not content, so we override text color | 106 | // Places sidebar is a special case, since the view here have to look like chrome not content, so we override text color | ||
17 | placessidebar { | 107 | placessidebar { | ||
18 | > viewport.frame { border-style: none; } | 108 | > viewport.frame { border-style: none; } | ||
19 | 109 | | |||
20 | row { | 110 | row { | ||
21 | // Needs overriding of the GtkListBoxRow padding | 111 | // Needs overriding of the GtkListBoxRow padding | ||
22 | min-height: 36px; | 112 | min-height: 36px; | ||
23 | padding: 0px; | 113 | padding: 0px; | ||
24 | 114 | | |||
25 | // Using margins/padding directly in the SidebarRow | 115 | // Using margins/padding directly in the SidebarRow | ||
26 | // will make the animation of the new bookmark row jump | 116 | // will make the animation of the new bookmark row jump | ||
27 | > revealer { padding: 0 14px; } | 117 | > revealer { padding: 0 14px; } | ||
28 | 118 | | |||
29 | &:selected { color: s_color(text); } | 119 | &:selected { | ||
120 | color: gtk("@theme_selected_fg_color"); | ||||
121 | } | ||||
30 | 122 | | |||
31 | &:disabled { color: insensitive(w_color(text)); } | 123 | &:disabled { | ||
124 | color: gtk("@insensitive_fg_color"); | ||||
125 | } | ||||
32 | 126 | | |||
33 | &:backdrop { | 127 | &:backdrop { | ||
34 | color: backdrop(w_color(text)); | 128 | color: gtk("@theme_unfocused_fg_color"); | ||
35 | 129 | | |||
36 | &:selected { color: backdrop(s_color(normal)); } | 130 | &:selected { | ||
131 | color: gtk("@theme_unfocused_selected_bg_color_alt"); | ||||
132 | } | ||||
37 | 133 | | |||
38 | &:disabled { color: backdrop(insensitive(w_color(text))); } | 134 | &:disabled { | ||
135 | color: gtk("@insensitive_unfocused_fg_color"); | ||||
136 | } | ||||
39 | } | 137 | } | ||
40 | 138 | | |||
41 | image.sidebar-icon { | 139 | image.sidebar-icon { | ||
42 | 140 | | |||
43 | &:dir(ltr) { padding-right: 8px; } | 141 | &:dir(ltr) { padding-right: 8px; } | ||
44 | &:dir(rtl) { padding-left: 8px; } | 142 | &:dir(rtl) { padding-left: 8px; } | ||
45 | } | 143 | } | ||
46 | 144 | | |||
Show All 20 Lines | |||||
67 | 165 | | |||
68 | &.sidebar-placeholder-row { | 166 | &.sidebar-placeholder-row { | ||
69 | padding: 0 8px; | 167 | padding: 0 8px; | ||
70 | min-height: 2px; | 168 | min-height: 2px; | ||
71 | background-image: none; | 169 | background-image: none; | ||
72 | background-clip: content-box; | 170 | background-clip: content-box; | ||
73 | } | 171 | } | ||
74 | 172 | | |||
75 | &.sidebar-new-bookmark-row { color: s_color(normal); } | 173 | &.sidebar-new-bookmark-row { | ||
174 | color: gtk("@theme_selected_bg_color"); | ||||
175 | } | ||||
76 | 176 | | |||
77 | // &:drop(active):not(:disabled) { | 177 | // &:drop(active):not(:disabled) { | ||
78 | // color: $drop_target_color; | 178 | // color: $drop_target_color; | ||
79 | // box-shadow: inset 0 1px $drop_target_color, | 179 | // box-shadow: inset 0 1px $drop_target_color, | ||
80 | // inset 0 -1px $drop_target_color; | 180 | // inset 0 -1px $drop_target_color; | ||
81 | // | 181 | // | ||
82 | // &:selected { | 182 | // &:selected { | ||
83 | // color: $selected_fg_color; | 183 | // color: $selected_fg_color; | ||
▲ Show 20 Lines • Show All 41 Lines • Show Last 20 Lines |