Merge lp:~3v1n0/ubuntu-themes/headerbar-maximized-destructive-suggested-actions into lp:ubuntu-themes

Proposed by Marco Trevisan (Treviño) on 2017-10-23
Status: Merged
Approved by: Iain Lane on 2017-11-14
Approved revision: 588
Merged at revision: 588
Proposed branch: lp:~3v1n0/ubuntu-themes/headerbar-maximized-destructive-suggested-actions
Merge into: lp:ubuntu-themes
Prerequisite: lp:~3v1n0/ubuntu-themes/headerbar-destructive-theming
Diff against target: 299 lines (+160/-0)
2 files modified
Ambiance/gtk-3.20/gtk-widgets.css (+80/-0)
Radiance/gtk-3.20/gtk-widgets.css (+80/-0)
To merge this branch: bzr merge lp:~3v1n0/ubuntu-themes/headerbar-maximized-destructive-suggested-actions
Reviewer Review Type Date Requested Status
Iain Lane 2017-10-23 Approve on 2017-11-14
Review via email: mp+332619@code.launchpad.net

Commit Message

Ambiance, Radiance: Use inverted gradient for button actions in maximized titlebars

To post a comment you must log in.
Iain Lane (laney) wrote :

thanks!

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'Ambiance/gtk-3.20/gtk-widgets.css'
2--- Ambiance/gtk-3.20/gtk-widgets.css 2017-10-23 09:36:06 +0000
3+++ Ambiance/gtk-3.20/gtk-widgets.css 2017-10-23 09:36:06 +0000
4@@ -2588,12 +2588,28 @@
5 border-radius: 12px;
6 }
7
8+.primary-toolbar button.suggested-action:not(:disabled),
9+.maximized headerbar button.suggested-action:not(:disabled),
10+.maximized .titlebar:not(headerbar) button.suggested-action:not(:disabled) {
11+ background-image: -gtk-gradient (linear, left top, left bottom,
12+ from (shade (@suggested_action_bg, 0.90)),
13+ to (shade (@suggested_action_bg, 1.10)));
14+}
15+
16 headerbar button.suggested-action:hover {
17 background-image: -gtk-gradient (linear, left top, left bottom,
18 from (shade (@suggested_action_bg, 0.93)),
19 to (shade (@suggested_action_bg, 0.75)));
20 }
21
22+.primary-toolbar button.suggested-action:hover,
23+.maximized headerbar button.suggested-action:hover,
24+.maximized .titlebar:not(headerbar) button.suggested-action:hover {
25+ background-image: -gtk-gradient (linear, left top, left bottom,
26+ from (shade (@suggested_action_bg, 0.75)),
27+ to (shade (@suggested_action_bg, 0.93)));
28+}
29+
30 headerbar button.suggested-action:backdrop:not(:disabled) * {
31 color: shade (white, 0.65);
32 }
33@@ -2604,12 +2620,28 @@
34 to (shade (@suggested_action_bg, 0.65)));
35 }
36
37+.primary-toolbar button.suggested-action:backdrop:not(:disabled),
38+.maximized headerbar button.suggested-action:backdrop:not(:disabled),
39+.maximized .titlebar:not(headerbar) button.suggested-action:backdrop:not(:disabled) {
40+ background-image: -gtk-gradient (linear, left top, left bottom,
41+ from (shade (@suggested_action_bg, 0.65)),
42+ to (shade (@suggested_action_bg, 0.65)));
43+}
44+
45 headerbar button.suggested-action:hover:backdrop {
46 background-image: -gtk-gradient (linear, left top, left bottom,
47 from (shade (@suggested_action_bg, 0.77)),
48 to (shade (@suggested_action_bg, 0.75)));
49 }
50
51+.primary-toolbar button.suggested-action:hover:backdrop,
52+.maximized headerbar button.suggested-action:hover:backdrop,
53+.maximized .titlebar:not(headerbar) button.suggested-action:hover:backdrop {
54+ background-image: -gtk-gradient (linear, left top, left bottom,
55+ from (shade (@suggested_action_bg, 0.75)),
56+ to (shade (@suggested_action_bg, 0.77)));
57+}
58+
59 headerbar button.suggested-action:hover:backdrop * {
60 color: shade (white, 0.67);
61 }
62@@ -2620,6 +2652,14 @@
63 to (shade (@suggested_action_bg, 0.65)));
64 }
65
66+.primary-toolbar button.suggested-action:active,
67+.maximized headerbar button.suggested-action:active,
68+.maximized .titlebar:not(headerbar) button.suggested-action:active {
69+ background-image: -gtk-gradient (linear, left top, left bottom,
70+ from (shade (@suggested_action_bg, 0.65)),
71+ to (shade (@suggested_action_bg, 0.80)));
72+}
73+
74 headerbar button.suggested-action:disabled * {
75 color: @fg_color;
76 text-shadow: none;
77@@ -2660,12 +2700,28 @@
78 border-radius: 12px;
79 }
80
81+.primary-toolbar button.destructive-action:not(:disabled),
82+.maximized headerbar button.destructive-action:not(:disabled),
83+.maximized .titlebar:not(headerbar) button.destructive-action:not(:disabled) {
84+ background-image: -gtk-gradient (linear, left top, left bottom,
85+ from (shade (@error_bg_color, 0.90)),
86+ to (shade (@error_bg_color, 1.10)));
87+}
88+
89 headerbar button.destructive-action:hover {
90 background-image: -gtk-gradient (linear, left top, left bottom,
91 from (shade (@error_bg_color, 0.93)),
92 to (shade (@error_bg_color, 0.75)));
93 }
94
95+.primary-toolbar button.destructive-action:hover,
96+.maximized headerbar button.destructive-action:hover,
97+.maximized .titlebar:not(headerbar) button.destructive-action:hover {
98+ background-image: -gtk-gradient (linear, left top, left bottom,
99+ from (shade (@error_bg_color, 0.75)),
100+ to (shade (@error_bg_color, 0.93)));
101+}
102+
103 headerbar button.destructive-action:backdrop:not(:disabled) * {
104 color: shade (white, 0.65);
105 }
106@@ -2676,12 +2732,28 @@
107 to (shade (@error_bg_color, 0.65)));
108 }
109
110+.primary-toolbar button.destructive-action:backdrop:not(:disabled),
111+.maximized headerbar button.destructive-action:backdrop:not(:disabled),
112+.maximized .titlebar:not(headerbar) button.destructive-action:backdrop:not(:disabled) {
113+ background-image: -gtk-gradient (linear, left top, left bottom,
114+ from (shade (@error_bg_color, 0.65)),
115+ to (shade (@error_bg_color, 0.65)));
116+}
117+
118 headerbar button.destructive-action:hover:backdrop {
119 background-image: -gtk-gradient (linear, left top, left bottom,
120 from (shade (@error_bg_color, 0.77)),
121 to (shade (@error_bg_color, 0.75)));
122 }
123
124+.primary-toolbar button.destructive-action:hover:backdrop,
125+.maximized headerbar button.destructive-action:hover:backdrop,
126+.maximized .titlebar:not(headerbar) button.destructive-action:hover:backdrop {
127+ background-image: -gtk-gradient (linear, left top, left bottom,
128+ from (shade (@error_bg_color, 0.75)),
129+ to (shade (@error_bg_color, 0.77)));
130+}
131+
132 headerbar button.destructive-action:hover:backdrop * {
133 color: shade (white, 0.67);
134 }
135@@ -2692,6 +2764,14 @@
136 to (shade (@error_bg_color, 0.65)));
137 }
138
139+.primary-toolbar button.destructive-action:active,
140+.maximized headerbar button.destructive-action:active,
141+.maximized .titlebar:not(headerbar) button.destructive-action:active {
142+ background-image: -gtk-gradient (linear, left top, left bottom,
143+ from (shade (@error_bg_color, 0.65)),
144+ to (shade (@error_bg_color, 0.80)));
145+}
146+
147 headerbar button.destructive-action:disabled * {
148 color: @fg_color;
149 text-shadow: none;
150
151=== modified file 'Radiance/gtk-3.20/gtk-widgets.css'
152--- Radiance/gtk-3.20/gtk-widgets.css 2017-10-23 09:36:06 +0000
153+++ Radiance/gtk-3.20/gtk-widgets.css 2017-10-23 09:36:06 +0000
154@@ -2589,12 +2589,28 @@
155 border-radius: 12px;
156 }
157
158+.primary-toolbar button.suggested-action:not(:disabled),
159+.maximized headerbar button.suggested-action:not(:disabled),
160+.maximized .titlebar:not(headerbar) button.suggested-action:not(:disabled) {
161+ background-image: -gtk-gradient (linear, left top, left bottom,
162+ from (shade (@suggested_action_bg, 0.90)),
163+ to (shade (@suggested_action_bg, 1.10)));
164+}
165+
166 headerbar button.suggested-action:hover {
167 background-image: -gtk-gradient (linear, left top, left bottom,
168 from (shade (@suggested_action_bg, 0.98)),
169 to (shade (@suggested_action_bg, 0.79)));
170 }
171
172+.primary-toolbar button.suggested-action:hover,
173+.maximized headerbar button.suggested-action:hover,
174+.maximized .titlebar:not(headerbar) button.suggested-action:hover {
175+ background-image: -gtk-gradient (linear, left top, left bottom,
176+ from (shade (@suggested_action_bg, 0.75)),
177+ to (shade (@suggested_action_bg, 0.93)));
178+}
179+
180 headerbar button.suggested-action:backdrop:not(:disabled) * {
181 color: alpha (white, 0.65);
182 }
183@@ -2605,12 +2621,28 @@
184 to (alpha (@suggested_action_bg, 0.80)));
185 }
186
187+.primary-toolbar button.suggested-action:backdrop:not(:disabled),
188+.maximized headerbar button.suggested-action:backdrop:not(:disabled),
189+.maximized .titlebar:not(headerbar) button.suggested-action:backdrop:not(:disabled) {
190+ background-image: -gtk-gradient (linear, left top, left bottom,
191+ from (alpha (@suggested_action_bg, 0.80)),
192+ to (alpha (@suggested_action_bg, 0.80)));
193+}
194+
195 headerbar button.suggested-action:hover:backdrop {
196 background-image: -gtk-gradient (linear, left top, left bottom,
197 from (alpha (@suggested_action_bg, 0.70)),
198 to (alpha (@suggested_action_bg, 0.69)));
199 }
200
201+.primary-toolbar button.suggested-action:hover:backdrop,
202+.maximized headerbar button.suggested-action:hover:backdrop,
203+.maximized .titlebar:not(headerbar) button.suggested-action:hover:backdrop {
204+ background-image: -gtk-gradient (linear, left top, left bottom,
205+ from (alpha (@suggested_action_bg, 0.69)),
206+ to (alpha (@suggested_action_bg, 0.70)));
207+}
208+
209 headerbar button.suggested-action:hover:backdrop * {
210 color: alpha (white, 0.67);
211 }
212@@ -2621,6 +2653,14 @@
213 to (shade (@suggested_action_bg, 0.70)));
214 }
215
216+.primary-toolbar button.suggested-action:active,
217+.maximized headerbar button.suggested-action:active,
218+.maximized .titlebar:not(headerbar) button.suggested-action:active {
219+ background-image: -gtk-gradient (linear, left top, left bottom,
220+ from (shade (@suggested_action_bg, 0.65)),
221+ to (shade (@suggested_action_bg, 0.80)));
222+}
223+
224 headerbar button.suggested-action:disabled * {
225 color: @fg_color;
226 text-shadow: none;
227@@ -2661,12 +2701,28 @@
228 border-radius: 12px;
229 }
230
231+.primary-toolbar button.destructive-action:not(:disabled),
232+.maximized headerbar button.destructive-action:not(:disabled),
233+.maximized .titlebar:not(headerbar) button.destructive-action:not(:disabled) {
234+ background-image: -gtk-gradient (linear, left top, left bottom,
235+ from (shade (@error_bg_color, 0.90)),
236+ to (shade (@error_bg_color, 1.10)));
237+}
238+
239 headerbar button.destructive-action:hover {
240 background-image: -gtk-gradient (linear, left top, left bottom,
241 from (shade (@error_bg_color, 0.93)),
242 to (shade (@error_bg_color, 0.75)));
243 }
244
245+.primary-toolbar button.destructive-action:hover,
246+.maximized headerbar button.destructive-action:hover,
247+.maximized .titlebar:not(headerbar) button.destructive-action:hover {
248+ background-image: -gtk-gradient (linear, left top, left bottom,
249+ from (shade (@error_bg_color, 0.75)),
250+ to (shade (@error_bg_color, 0.93)));
251+}
252+
253 headerbar button.destructive-action:backdrop:not(:disabled) * {
254 color: shade (white, 0.65);
255 }
256@@ -2677,12 +2733,28 @@
257 to (shade (@error_bg_color, 0.65)));
258 }
259
260+.primary-toolbar button.destructive-action:backdrop:not(:disabled),
261+.maximized headerbar button.destructive-action:backdrop:not(:disabled),
262+.maximized .titlebar:not(headerbar) button.destructive-action:backdrop:not(:disabled) {
263+ background-image: -gtk-gradient (linear, left top, left bottom,
264+ from (shade (@error_bg_color, 0.65)),
265+ to (shade (@error_bg_color, 0.65)));
266+}
267+
268 headerbar button.destructive-action:hover:backdrop {
269 background-image: -gtk-gradient (linear, left top, left bottom,
270 from (shade (@error_bg_color, 0.77)),
271 to (shade (@error_bg_color, 0.75)));
272 }
273
274+.primary-toolbar button.destructive-action:hover:backdrop,
275+.maximized headerbar button.destructive-action:hover:backdrop,
276+.maximized .titlebar:not(headerbar) button.destructive-action:hover:backdrop {
277+ background-image: -gtk-gradient (linear, left top, left bottom,
278+ from (shade (@error_bg_color, 0.75)),
279+ to (shade (@error_bg_color, 0.77)));
280+}
281+
282 headerbar button.destructive-action:hover:backdrop * {
283 color: shade (white, 0.67);
284 }
285@@ -2693,6 +2765,14 @@
286 to (shade (@error_bg_color, 0.65)));
287 }
288
289+.primary-toolbar button.destructive-action:active,
290+.maximized headerbar button.destructive-action:active,
291+.maximized .titlebar:not(headerbar) button.destructive-action:active {
292+ background-image: -gtk-gradient (linear, left top, left bottom,
293+ from (shade (@error_bg_color, 0.65)),
294+ to (shade (@error_bg_color, 0.80)));
295+}
296+
297 headerbar button.destructive-action:disabled * {
298 color: @fg_color;
299 text-shadow: none;

Subscribers

People subscribed via source and target branches