Changeset View
Changeset View
Standalone View
Standalone View
src/gtk3/widgets/_headerbar.scss
1 | @charset "UTF-8"; | 1 | @charset "UTF-8"; | ||
---|---|---|---|---|---|
2 | 2 | | |||
3 | /*************** | 3 | /*************** | ||
4 | * Header bars * | 4 | * Header bars * | ||
5 | ***************/ | 5 | ***************/ | ||
6 | 6 | | |||
7 | %titlebar, | 7 | %titlebar, | ||
8 | headerbar { | 8 | headerbar { | ||
9 | transition: none; | 9 | transition: none; | ||
10 | padding: 0px 6px; | 10 | padding: 0px 6px; | ||
11 | border-width: 0px 0px 1px 0px; | 11 | border-width: 0px 0px 1px 0px; | ||
12 | border-radius: 3px 3px 0px 0px; | 12 | border-radius: 3px 3px 0px 0px; | ||
13 | border-style: solid; | 13 | border-style: solid; | ||
14 | border-color: $border_color; | 14 | border-color: gtk("@borders"); | ||
15 | color: t_color(text); | 15 | color: gtk("@theme_titlebar_foreground"); | ||
16 | background-image: none; | 16 | background-image: none; | ||
17 | background-color: t_color(background); | 17 | background-color: gtk("@theme_titlebar_background"); | ||
18 | &:backdrop { | 18 | &:backdrop { | ||
19 | border-color: transparent; | 19 | border-color: transparent; | ||
20 | background-image: none; | 20 | background-image: none; | ||
21 | background-color: t_color(backdrop-background); | 21 | background-color: gtk("@theme_titlebar_background_backdrop"); | ||
22 | color: t_color(backdrop-text); | 22 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||
23 | box-shadow: none; | 23 | box-shadow: none; | ||
24 | } | 24 | } | ||
25 | label { | 25 | label { | ||
26 | font-weight: normal; | 26 | font-weight: normal; | ||
27 | &:backdrop { color: t_color(backdrop-text); } | 27 | &:backdrop { color: gtk("@theme_titlebar_foreground_backdrop"); } | ||
28 | } | 28 | } | ||
29 | .path-bar button { | 29 | .path-bar button { | ||
30 | color: t_color(text); | 30 | color: gtk("@theme_titlebar_foreground"); | ||
31 | font-weight: normal; | 31 | font-weight: normal; | ||
32 | &:backdrop { color: t_color(backdrop-text)} | 32 | &:backdrop { | ||
33 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||||
34 | } | ||||
33 | } | 35 | } | ||
34 | button { | 36 | button { | ||
35 | transition: none; | 37 | transition: none; | ||
36 | @include button(undecorated, $tc: t_color(text)); | 38 | @include button(undecorated); | ||
39 | color: gtk("@theme_titlebar_foreground"); | ||||
37 | 40 | | |||
38 | &.flat { | 41 | &.flat { | ||
39 | @include button(undecorated,$tc: t_color(text)); | 42 | @include button(undecorated); | ||
43 | color: gtk("@theme_titlebar_foreground"); | ||||
40 | } | 44 | } | ||
41 | &:hover { | 45 | &:hover { | ||
42 | @include button(hover, $tc: t_color(text)); | 46 | @include button(hover); | ||
43 | &:backdrop { border-color: t_color(backdrop-background); } | 47 | color: gtk("@theme_titlebar_foreground"); | ||
48 | &:backdrop { border-color: gtk("@theme_titlebar_background_backdrop"); } | ||||
44 | } | 49 | } | ||
45 | &:active, &:checked { | 50 | &:active, &:checked { | ||
46 | @include button(active); | 51 | @include button(active); | ||
47 | &:hover { | 52 | &:hover { | ||
48 | @include button(active-hover); | 53 | @include button(active-hover); | ||
49 | } | 54 | } | ||
50 | &:backdrop { | 55 | &:backdrop { | ||
51 | background-image: none; | 56 | background-image: none; | ||
52 | background-color: t_color(backdrop-background); | 57 | background-color: gtk("@theme_titlebar_background_backdrop"); | ||
53 | border-color: t_color(backdrop-background); | 58 | border-color: gtk("@theme_titlebar_background_backdrop"); | ||
54 | color: t_color(backdrop-text); | 59 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||
55 | } | 60 | } | ||
56 | } | 61 | } | ||
57 | 62 | | |||
58 | &.suggested-action { | 63 | &.suggested-action { | ||
59 | @extend %suggested-action; | 64 | @extend %suggested-action; | ||
60 | } | 65 | } | ||
61 | 66 | | |||
62 | &:backdrop { | 67 | &:backdrop { | ||
63 | border-color: transparent; | 68 | border-color: transparent; | ||
64 | background-image: none; | 69 | background-image: none; | ||
65 | background-color: t_color(backdrop-background); | 70 | background-color: gtk("@theme_titlebar_background_backdrop"); | ||
66 | color: t_color(backdrop-text); | 71 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||
67 | } | 72 | } | ||
68 | 73 | | |||
69 | &.flat:backdrop, &.flat:backdrop:disabled, &:disabled:backdrop { | 74 | &.flat:backdrop, &.flat:backdrop:disabled, &:disabled:backdrop { | ||
70 | background-image: none; | 75 | background-image: none; | ||
71 | background-color: t_color(backdrop-background); | 76 | background-color: gtk("@theme_titlebar_background_backdrop"); | ||
72 | color: t_color(backdrop-text); | 77 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||
73 | border-color: transparent; | 78 | border-color: transparent; | ||
74 | } | 79 | } | ||
75 | &.flat:disabled { | 80 | &.flat:disabled { | ||
76 | @extend %undecorated_button;; | 81 | @extend %undecorated_button;; | ||
77 | color: insensitive(t_color(text)); | 82 | color: gtk("@theme_titlebar_foreground_insensitive"); | ||
78 | } | 83 | } | ||
79 | &:disabled { | 84 | &:disabled { | ||
80 | background-color: transparent; | 85 | background-color: transparent; | ||
81 | background-image: none; | 86 | background-image: none; | ||
82 | border-color: transparent; | 87 | border-color: transparent; | ||
83 | color: insensitive(t_color(text)); | 88 | color: gtk("@theme_titlebar_foreground_insensitive"); | ||
84 | &:active, &:checked { | 89 | &:active, &:checked { | ||
85 | @include button(insensitive-active); | 90 | @include button(insensitive-active); | ||
86 | } | 91 | } | ||
87 | } | 92 | } | ||
88 | } | 93 | } | ||
89 | 94 | | |||
90 | .title { | 95 | .title { | ||
91 | font-weight: normal; | 96 | font-weight: normal; | ||
92 | padding: 0px 12px; | 97 | padding: 0px 12px; | ||
93 | &:backdrop { color: t_color(backdrop-text)} | 98 | &:backdrop { | ||
99 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||||
100 | } | ||||
94 | } | 101 | } | ||
95 | 102 | | |||
96 | .subtitle { | 103 | .subtitle { | ||
97 | font-size: smaller; | 104 | font-size: smaller; | ||
98 | padding: 0 12px; | 105 | padding: 0 12px; | ||
99 | @extend .dim-label; | 106 | @extend .dim-label; | ||
100 | &:backdrop { color: t_color(backdrop-text)} | 107 | &:backdrop { | ||
108 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||||
109 | } | ||||
101 | } | 110 | } | ||
102 | 111 | | |||
103 | separator { | 112 | separator { | ||
104 | border-width: 0px; | 113 | border-width: 0px; | ||
105 | background-color: transparent; | 114 | background-color: transparent; | ||
106 | background-image: none; | 115 | background-image: none; | ||
107 | border-color: transparent; | 116 | border-color: transparent; | ||
108 | } | 117 | } | ||
Show All 33 Lines | 146 | headerbar { | |||
142 | button { | 151 | button { | ||
143 | margin-top: 3px; | 152 | margin-top: 3px; | ||
144 | margin-bottom: 3px; | 153 | margin-bottom: 3px; | ||
145 | } | 154 | } | ||
146 | } | 155 | } | ||
147 | 156 | | |||
148 | %suggested-action { | 157 | %suggested-action { | ||
149 | background-image: none; | 158 | background-image: none; | ||
150 | background-color: b_color(active); | 159 | background-color: gtk("@theme_button_decoration_focus"); | ||
151 | &:hover { | 160 | &:hover { | ||
152 | background-color: b_color(hover); | 161 | background-color: gtk("@theme_button_decoration_hover"); | ||
153 | color: b_color(text) | 162 | color: gtk("@theme_button_foreground_normal"); | ||
154 | } | 163 | } | ||
155 | &:disabled { | 164 | &:disabled { | ||
156 | background-color: transparent; | 165 | background-color: transparent; | ||
157 | background-image: none; | 166 | background-image: none; | ||
158 | color: insensitive(t_color(text)); | 167 | color: gtk("@theme_titlebar_foreground_insensitive"); | ||
159 | &:active, &:checked { | 168 | &:active, &:checked { | ||
160 | @include button(insensitive-active); | 169 | @include button(insensitive-active); | ||
161 | } | 170 | } | ||
162 | } | 171 | } | ||
163 | &:backdrop { | 172 | &:backdrop { | ||
164 | background-color: t_color(backdrop-background); | 173 | background-color: gtk("@theme_titlebar_background_backdrop"); | ||
165 | border-color: transparent; | 174 | border-color: transparent; | ||
166 | color: t_color(backdrop-text); | 175 | color: gtk("@theme_titlebar_foreground_backdrop"); | ||
167 | &:disabled { | 176 | &:disabled { | ||
168 | color: insensitive(t_color(backdrop-text)); | 177 | color: gtk("@theme_titlebar_foreground_insensitive_backdrop"); | ||
169 | } | 178 | } | ||
170 | } | 179 | } | ||
171 | } | 180 | } |