Merge lp:~laney/ubuntu-themes/progressbars-16.04 into lp:ubuntu-themes

Proposed by Iain Lane on 2016-06-20
Status: Superseded
Proposed branch: lp:~laney/ubuntu-themes/progressbars-16.04
Merge into: lp:ubuntu-themes
Diff against target: 314 lines (+103/-76) (has conflicts)
8 files modified
Ambiance/gtk-3.0/gtk-main.css (+7/-0)
Ambiance/gtk-3.0/gtk-widgets-borders.css (+1/-26)
Ambiance/gtk-3.0/gtk-widgets.css (+27/-11)
Radiance/gtk-3.0/gtk-main.css (+7/-0)
Radiance/gtk-3.0/gtk-widgets-borders.css (+1/-26)
Radiance/gtk-3.0/gtk-widgets.css (+28/-11)
debian/changelog (+30/-0)
debian/control (+2/-2)
Text conflict in debian/changelog
To merge this branch: bzr merge lp:~laney/ubuntu-themes/progressbars-16.04
Reviewer Review Type Date Requested Status
Ubuntu Artwork Packagers 2016-06-20 Pending
Review via email: mp+297888@code.launchpad.net

Commit message

Re-style progress bars to fix them having a border but no background, for example in gnome-system-monitor.

Description of the change

Adds new CSS to style progress bars based on colours rather than images. This fixes the "empty progress bars" bug.

 * Adds new colours to gtk-main.css for progressbar
 * Removes border images from gtk-widgets-borders.css
 * Adds new CSS to gtk-widgets.css to colour borders correctly

Both Ambiance and Radiance are synced with these changes.

Thanks to raveit65 and the Ambiant-MATE project for the pointers.

Fixes lp:#1052936

To post a comment you must log in.

Unmerged revisions

480. By Iain Lane on 2016-06-20

Merge branch from willcooke to fix progress bar styling

479. By Iain Lane on 2016-05-24

releasing package ubuntu-themes version 14.04+16.04.20160415-0ubuntu2

478. By Iain Lane on 2016-05-24

Update Vcs-Bzr for 16.04

477. By Iain Lane on 2016-05-24

Adds Terminal specific CSS to change tab colours making it easier to
distinguish the current selected tab from the others. Design have reviewed
and ack'd. LP: #762349

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'Ambiance/gtk-3.0/gtk-main.css'
2--- Ambiance/gtk-3.0/gtk-main.css 2016-03-23 21:44:10 +0000
3+++ Ambiance/gtk-3.0/gtk-main.css 2016-06-20 09:44:28 +0000
4@@ -53,6 +53,13 @@
5
6 @define-color scrollbar_track_color mix(@base_color, black, 0.1); /* #e6e6e6 */
7
8+@define-color progressbar_fill_a shade(@theme_selected_bg_color, 1.07);
9+@define-color progressbar_fill_b shade(mix(@theme_selected_bg_color, @selected_bg_color, 0.10), 0.91);
10+@define-color button_border_active shade(@theme_selected_bg_color, 0.95);
11+@define-color progressbar_backdrop_fill_a shade(@backdrop_selected_bg_color, 1.07);
12+@define-color progressbar_backdrop_fill_b shade(mix(@backdrop_selected_bg_color, grey, 0.10), 0.91);
13+@define-color button_border_backdrop_active shade(@backdrop_selected_bg_color, 0.95);
14+
15 @import url("gtk-widgets-borders.css");
16 @import url("gtk-widgets-assets.css");
17 @import url("gtk-widgets.css");
18
19=== modified file 'Ambiance/gtk-3.0/gtk-widgets-borders.css'
20--- Ambiance/gtk-3.0/gtk-widgets-borders.css 2015-07-07 14:31:07 +0000
21+++ Ambiance/gtk-3.0/gtk-widgets-borders.css 2016-06-20 09:44:28 +0000
22@@ -53,8 +53,7 @@
23 .menubar.toolbar .entry.progressbar,
24 .menubar.toolbar .entry.progressbar,
25 .header-bar .entry.progressbar,
26-.header-bar .entry.progressbar,
27-.entry.progressbar {
28+.header-bar .entry.progressbar {
29 border-radius: 8px;
30 border-width: 0;
31 }
32@@ -219,30 +218,6 @@
33 border-image: url("assets/switch-button-on-disabled.png") 9 11 9 11 / 9px 11px 9px 11px stretch;
34 }
35
36-.progressbar,
37-.progressbar row,
38-.progressbar row:hover,
39-.progressbar row:selected,
40-.progressbar row:selected:focused {
41- border-image: url("assets/progressbar-horizontal-fill.png") 5 6 5 6 / 5px 6px 5px 6px stretch;
42-}
43-
44-.progressbar.vertical {
45- border-image: url("assets/progressbar-vertical-fill.png") 6 5 6 5 / 6px 5px 6px 5px stretch;
46-}
47-
48-.progressbar:backdrop,
49-.progressbar row:backdrop,
50-.progressbar row:hover:backdrop,
51-.progressbar row:selected:backdrop,
52-.progressbar row:selected:focused:backdrop {
53- border-image: url("assets/progressbar-horizontal-fill-backdrop.png") 5 6 5 6 / 5px 6px 5px 6px stretch;
54-}
55-
56-.progressbar.vertical:backdrop {
57- border-image: url("assets/progressbar-vertical-fill-backdrop.png") 6 5 6 5 / 6px 5px 6px 5px stretch;
58-}
59-
60 .scale.trough {
61 border-image: url("assets/scale-horizontal-trough.png") 2 6 2 6 / 2px 6px 2px 6px stretch;
62 }
63
64=== modified file 'Ambiance/gtk-3.0/gtk-widgets.css'
65--- Ambiance/gtk-3.0/gtk-widgets.css 2016-04-15 19:49:14 +0000
66+++ Ambiance/gtk-3.0/gtk-widgets.css 2016-06-20 09:44:28 +0000
67@@ -464,8 +464,7 @@
68 .primary-toolbar .entry.progressbar,
69 .primary-toolbar .entry.progressbar,
70 .header-bar .entry.progressbar,
71-.header-bar .entry.progressbar,
72-.entry.progressbar {
73+.header-bar .entry.progressbar {
74 background-image: -gtk-gradient (linear, left top, left bottom,
75 from (shade (@selected_bg_color, 0.8)),
76 color-stop (0.1, shade (@selected_bg_color, 0.9)),
77@@ -985,12 +984,21 @@
78 .progressbar row:hover,
79 .progressbar row:selected,
80 .progressbar row:selected:focused,
81-.progressbar row:nth-child(odd) {
82- border-radius: 8px;
83- border-width: 0px;
84- background-image: none;
85- background-color: #db6a3c;
86+.progressbar row:nth-child(odd),
87+.toolbar .progressbar,
88+.entry .progressbar {
89+ border-radius: 5px;
90 border-style: solid;
91+ border-width: 1px;
92+ background-image: linear-gradient(to bottom,
93+ @progressbar_fill_a,
94+ @progressbar_fill_b);
95+ border-top-color: shade(@button_border_active, 0.80);
96+ border-left-color: shade(@button_border_active, 0.85);
97+ border-right-color: shade(@button_border_active, 0.85);
98+ border-bottom-color: shade(@button_border_active, 0.80);
99+ color: @theme_fg_color;
100+ text-shadow: none;
101 }
102
103 .progressbar:backdrop,
104@@ -1000,10 +1008,18 @@
105 .progressbar row:selected:focused:backdrop,
106 .scale.highlight.bottom:backdrop,
107 .progressbar.vertical:backdrop {
108- border-radius: 8px;
109- border-width: 0px;
110- background-image: none;
111- background-color: @backdrop_filling_bg;
112+ border-radius: 5px;
113+ border-width: 1px;
114+ border-style: solid;
115+ background-image: linear-gradient(to bottom,
116+ @progressbar_fill_a,
117+ @progressbar_fill_b);
118+ border-top-color: shade(@button_border_backdrop_active, 0.80);
119+ border-left-color: shade(@button_border_backdrop_active, 0.85);
120+ border-right-color: shade(@button_border_backdrop_active, 0.85);
121+ border-bottom-color: shade(@button_border_backdrop_active, 0.80);
122+ color: @backdrop_fg_color;
123+ text-shadow: none;
124 }
125
126 .scale.highlight.left:insensitive {
127
128=== modified file 'Radiance/gtk-3.0/gtk-main.css'
129--- Radiance/gtk-3.0/gtk-main.css 2016-03-23 21:44:10 +0000
130+++ Radiance/gtk-3.0/gtk-main.css 2016-06-20 09:44:28 +0000
131@@ -52,6 +52,13 @@
132
133 @define-color scrollbar_track_color mix(@base_color, black, 0.1); /* #e6e6e6 */
134
135+@define-color progressbar_fill_a shade(@theme_selected_bg_color, 1.07);
136+@define-color progressbar_fill_b shade(mix(@theme_selected_bg_color, @selected_bg_color, 0.10), 0.91);
137+@define-color button_border_active shade(@theme_selected_bg_color, 0.95);
138+@define-color progressbar_backdrop_fill_a shade(@backdrop_selected_bg_color, 1.07);
139+@define-color progressbar_backdrop_fill_b shade(mix(@backdrop_selected_bg_color, grey, 0.10), 0.91);
140+@define-color button_border_backdrop_active shade(@backdrop_selected_bg_color, 0.95);
141+
142 @import url("gtk-widgets-borders.css");
143 @import url("gtk-widgets-borders-radiance.css");
144 @import url("gtk-widgets-assets.css");
145
146=== modified file 'Radiance/gtk-3.0/gtk-widgets-borders.css'
147--- Radiance/gtk-3.0/gtk-widgets-borders.css 2015-07-07 14:31:07 +0000
148+++ Radiance/gtk-3.0/gtk-widgets-borders.css 2016-06-20 09:44:28 +0000
149@@ -53,8 +53,7 @@
150 .menubar.toolbar .entry.progressbar,
151 .menubar.toolbar .entry.progressbar,
152 .header-bar .entry.progressbar,
153-.header-bar .entry.progressbar,
154-.entry.progressbar {
155+.header-bar .entry.progressbar {
156 border-radius: 8px;
157 border-width: 0;
158 }
159@@ -228,30 +227,6 @@
160 border-image: url("assets/switch-button-on-disabled.png") 9 11 9 11 / 9px 11px 9px 11px stretch;
161 }
162
163-.progressbar,
164-.progressbar row,
165-.progressbar row:hover,
166-.progressbar row:selected,
167-.progressbar row:selected:focused {
168- border-image: url("assets/progressbar-horizontal-fill.png") 5 6 5 6 / 5px 6px 5px 6px stretch;
169-}
170-
171-.progressbar.vertical {
172- border-image: url("assets/progressbar-vertical-fill.png") 6 5 6 5 / 6px 5px 6px 5px stretch;
173-}
174-
175-.progressbar:backdrop,
176-.progressbar row:backdrop,
177-.progressbar row:hover:backdrop,
178-.progressbar row:selected:backdrop,
179-.progressbar row:selected:focused:backdrop {
180- border-image: url("assets/progressbar-horizontal-fill-backdrop.png") 5 6 5 6 / 5px 6px 5px 6px stretch;
181-}
182-
183-.progressbar.vertical:backdrop {
184- border-image: url("assets/progressbar-vertical-fill-backdrop.png") 6 5 6 5 / 6px 5px 6px 5px stretch;
185-}
186-
187 .scale.trough {
188 border-image: url("assets/scale-horizontal-trough.png") 2 6 2 6 / 2px 6px 2px 6px stretch;
189 }
190
191=== modified file 'Radiance/gtk-3.0/gtk-widgets.css'
192--- Radiance/gtk-3.0/gtk-widgets.css 2016-04-15 19:49:14 +0000
193+++ Radiance/gtk-3.0/gtk-widgets.css 2016-06-20 09:44:28 +0000
194@@ -486,8 +486,7 @@
195 .primary-toolbar .entry.progressbar,
196 .primary-toolbar .entry.progressbar,
197 .header-bar .entry.progressbar,
198-.header-bar .entry.progressbar,
199-.entry.progressbar {
200+.header-bar .entry.progressbar {
201 background-image: -gtk-gradient (linear, left top, left bottom,
202 from (shade (@selected_bg_color, 0.8)),
203 color-stop (0.1, shade (@selected_bg_color, 0.9)),
204@@ -1008,12 +1007,22 @@
205 .progressbar row,
206 .progressbar row:hover,
207 .progressbar row:selected,
208-.progressbar row:selected:focused {
209- border-radius: 8px;
210- border-width: 0px;
211- background-image: none;
212- background-color: #db6a3c;
213+.progressbar row:selected:focused,
214+.progressbar row:nth-child(odd),
215+.toolbar .progressbar,
216+.entry .progressbar {
217+ border-radius: 5px;
218 border-style: solid;
219+ border-width: 1px;
220+ background-image: linear-gradient(to bottom,
221+ @progressbar_fill_a,
222+ @progressbar_fill_b);
223+ border-top-color: shade(@button_border_active, 0.80);
224+ border-left-color: shade(@button_border_active, 0.85);
225+ border-right-color: shade(@button_border_active, 0.85);
226+ border-bottom-color: shade(@button_border_active, 0.80);
227+ color: @theme_fg_color;
228+ text-shadow: none;
229 }
230
231 .progressbar:backdrop,
232@@ -1023,10 +1032,18 @@
233 .progressbar row:selected:focused:backdrop,
234 .scale.highlight.bottom:backdrop,
235 .progressbar.vertical:backdrop {
236- border-radius: 8px;
237- border-width: 0px;
238- background-image: none;
239- background-color: @backdrop_filling_bg;
240+ border-radius: 5px;
241+ border-width: 1px;
242+ border-style: solid;
243+ background-image: linear-gradient(to bottom,
244+ @progressbar_fill_a,
245+ @progressbar_fill_b);
246+ border-top-color: shade(@button_border_backdrop_active, 0.80);
247+ border-left-color: shade(@button_border_backdrop_active, 0.85);
248+ border-right-color: shade(@button_border_backdrop_active, 0.85);
249+ border-bottom-color: shade(@button_border_backdrop_active, 0.80);
250+ color: @backdrop_fg_color;
251+ text-shadow: none;
252 }
253
254 .scale.highlight.left:insensitive {
255
256=== modified file 'debian/changelog'
257--- debian/changelog 2016-06-15 19:52:44 +0000
258+++ debian/changelog 2016-06-20 09:44:28 +0000
259@@ -1,3 +1,4 @@
260+<<<<<<< TREE
261 ubuntu-themes (14.04+16.10.20160615.1-0ubuntu1) yakkety; urgency=medium
262
263 [ Matthieu James ]
264@@ -46,6 +47,35 @@
265
266 -- Sebastien Bacher <seb128@ubuntu.com> Fri, 15 Apr 2016 19:49:25 +0000
267
268+=======
269+ubuntu-themes (14.04+16.04.20160415-0ubuntu2) xenial; urgency=medium
270+
271+ [ Will Cooke ]
272+ * Adds Terminal specific CSS to change tab colours making it easier to
273+ distinguish the current selected tab from the others. Design have reviewed
274+ and ack'd. LP: #762349
275+
276+ [ Iain Lane ]
277+ * Update Vcs-Bzr for 16.04
278+
279+ -- Iain Lane <iain.lane@canonical.com> Tue, 24 May 2016 10:54:25 +0100
280+
281+ubuntu-themes (14.04+16.04.20160415-0ubuntu1) xenial; urgency=medium
282+
283+ [ Adolfo Jayme Barrientos ]
284+ * Add 1px padding to calendar widget elements; looks better. Thanks,
285+ Khurshid Alam. (LP: #1537794)
286+
287+ [ Matthieu James ]
288+ * Suru icon theme: normalization of arrows used in mono icons, plus
289+ minor additions or updates to existing designs. (LP: #1518934)
290+
291+ [ Will Cooke ]
292+ * Adds these fixes for Calendar: (LP: #1551744, #1558659)
293+
294+ -- Sebastien Bacher <seb128@ubuntu.com> Fri, 15 Apr 2016 19:49:25 +0000
295+
296+>>>>>>> MERGE-SOURCE
297 ubuntu-themes (14.04+16.04.20160324.1-0ubuntu1) xenial; urgency=medium
298
299 [ Marco Trevisan (TreviƱo) ]
300
301=== modified file 'debian/control'
302--- debian/control 2015-02-02 14:03:57 +0000
303+++ debian/control 2016-06-20 09:44:28 +0000
304@@ -12,8 +12,8 @@
305 # If you aren't a member of ~ubuntu-art-pkg but need to upload
306 # packaging changes, just go ahead. ~ubuntu-art-pkg will notice
307 # and sync up the code again.
308-Vcs-Bzr: https://code.launchpad.net/~ubuntu-art-pkg/ubuntu-themes/trunk
309-Vcs-Browser: https://bazaar.launchpad.net/~ubuntu-art-pkg/ubuntu-themes/trunk
310+Vcs-Bzr: https://code.launchpad.net/~ubuntu-art-pkg/ubuntu-themes/16.04
311+Vcs-Browser: https://bazaar.launchpad.net/~ubuntu-art-pkg/ubuntu-themes/16.04
312
313 Package: light-themes
314 Architecture: all

Subscribers

People subscribed via source and target branches