Merge lp:~danrabbit/pantheon-notify/ui-fixes into lp:~tombeckmann/pantheon-notify/trunk

Proposed by Daniel Fore
Status: Merged
Merged at revision: 17
Proposed branch: lp:~danrabbit/pantheon-notify/ui-fixes
Merge into: lp:~tombeckmann/pantheon-notify/trunk
Diff against target: 138 lines (+39/-12) (has conflicts)
3 files modified
data/notifications.css (+12/-6)
src/notification.vala (+17/-6)
src/pantheon-notify.vala (+10/-0)
Text conflict in src/notification.vala
Text conflict in src/pantheon-notify.vala
To merge this branch: bzr merge lp:~danrabbit/pantheon-notify/ui-fixes
Reviewer Review Type Date Requested Status
Tom Beckmann Pending
Review via email: mp+102980@code.launchpad.net

Description of the change

Just some UI fixes.

CSS - I'm just keeping the critical and low states the same as the normal ones for now. I'll come back and replace those with some good ones after I've had time to make some nice mocks. Adding -unico-inner-stroke for the top highlight and reverted the outer border to a single color stroke.

Text padding - Text should now have sane padding all the way around it and not run into the edge of the window in any way

Icons - Using the nice big 48px icons from the mockup for super easy recognition and for consistency with gtk.dialog

To post a comment you must log in.

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
=== modified file 'data/notifications.css'
--- data/notifications.css 2012-04-21 18:21:59 +0000
+++ data/notifications.css 2012-04-21 19:53:20 +0000
@@ -5,23 +5,29 @@
5* {5* {
6 /*-notify-shadow: 0px 2px 18px alpha (#000, 0.60);*/6 /*-notify-shadow: 0px 2px 18px alpha (#000, 0.60);*/
7 7
8 border-radius: 4px;8 border-radius: 5px;
9 border-width: 1px;9 border-width: 1px;
10 border-style: solid;10 border-style: solid;
11 -unico-inner-stroke-width: 1px;
11 12
12 border-color: alpha (#000, 0.3);13 border-color: alpha (#000, 0.3);
13 border-top-color: #fbfbfb;14
15 -unico-inner-stroke-gradient: -gtk-gradient (linear,
16 left bottom, left top,
17 from (alpha (#fff, 0.40)),
18 color-stop (0.20, alpha (#fff, 0.10)),
19 color-stop (0.80, alpha (#fff, 0.10)),
20 to (#fff));
14 21
15 background-color: alpha (#f9f9f9, 0.9);22 background-color: alpha (#f8f8f8, 0.9);
16}23}
1724
18/*low priority*/25/*low priority*/
19.low {26.low {
20 background-color: alpha (#f9f9f9, 0.5);27 /*background-color: alpha (#f9f9f9, 0.5);*/
21}28}
2229
23/*high priority*/30/*high priority*/
24.critical {31.critical {
25 background-color: alpha (#f50000, 0.9);32 /*background-color: alpha (#f50000, 0.9);*/
26 border-top-color: #f00;
27}33}
28\ No newline at end of file34\ No newline at end of file
2935
=== modified file 'src/notification.vala'
--- src/notification.vala 2012-04-21 19:46:06 +0000
+++ src/notification.vala 2012-04-21 19:53:20 +0000
@@ -90,9 +90,15 @@
90 90
91 text = new Clutter.Text.with_text ("", "");91 text = new Clutter.Text.with_text ("", "");
92 92
93 text.x = SHADOW + 60;
93 this.set_text (name, body);94 this.set_text (name, body);
95<<<<<<< TREE
94 text.add_constraint (new Clutter.BindConstraint (draw, Clutter.BindCoordinate.HEIGHT, -SHADOW*2-5));96 text.add_constraint (new Clutter.BindConstraint (draw, Clutter.BindCoordinate.HEIGHT, -SHADOW*2-5));
95 text.width = WIDTH - (text.x+SHADOW);97 text.width = WIDTH - (text.x+SHADOW);
98=======
99 text.add_constraint (new Clutter.BindConstraint (draw, Clutter.BindCoordinate.HEIGHT, -SHADOW * 2 - 9));
100 text.width = WIDTH - (text.x+SHADOW) - 6;
101>>>>>>> MERGE-SOURCE
96 text.line_wrap = true;102 text.line_wrap = true;
97 text.line_wrap_mode = Pango.WrapMode.WORD_CHAR;103 text.line_wrap_mode = Pango.WrapMode.WORD_CHAR;
98 text.ellipsize = Pango.EllipsizeMode.END;104 text.ellipsize = Pango.EllipsizeMode.END;
@@ -117,12 +123,17 @@
117 123
118 124
119 text.y = SHADOW+8;125 text.y = SHADOW+8;
126<<<<<<< TREE
120 tex.y = SHADOW+8;127 tex.y = SHADOW+8;
121 tex.x = SHADOW+5;128 tex.x = SHADOW+5;
122 text.x = tex.x + tex.width + 5;129 text.x = tex.x + tex.width + 5;
123 130
124 category.x = WIDTH-(42+SHADOW);131 category.x = WIDTH-(42+SHADOW);
125 category.y = tex.y;132 category.y = tex.y;
133=======
134 tex.y = SHADOW+3;
135 tex.x = SHADOW+3;
136>>>>>>> MERGE-SOURCE
126 137
127 this.width = WIDTH;138 this.width = WIDTH;
128 this.reactive = true;139 this.reactive = true;
@@ -234,21 +245,21 @@
234 } else {245 } else {
235 try {246 try {
236 tex.set_from_icon_name (new Gtk.Image (), 247 tex.set_from_icon_name (new Gtk.Image (),
237 hints.lookup ("image-path").get_string (), Gtk.IconSize.DND);248 hints.lookup ("image-path").get_string (), Gtk.IconSize.DIALOG);
238 } catch (Error e) { warning (e.message); }249 } catch (Error e) { warning (e.message); }
239 }250 }
240 } else if (icon != "") { /*app_icon*/251 } else if (icon != "") { /*app_icon*/
241 debug ("Using app icon");252 debug ("Using app icon");
242 try {253 try {
243 tex.set_from_icon_name (new Gtk.Image (), icon, Gtk.IconSize.DND);254 tex.set_from_icon_name (new Gtk.Image (), icon, Gtk.IconSize.DIALOG);
244 } catch (Error e) { //not an icon name? try a stock icon255 } catch (Error e) { //not an icon name? try a stock icon
245 try {256 try {
246 print ("Trying stock icon %s\n", icon);257 print ("Trying stock icon %s\n", icon);
247 tex.set_from_stock (new Gtk.Image (), icon, Gtk.IconSize.DND);258 tex.set_from_stock (new Gtk.Image (), icon, Gtk.IconSize.DIALOG);
248 } catch (Error e) { //still not? well... the app name perhaps?259 } catch (Error e) { //still not? well... the app name perhaps?
249 try {260 try {
250 print ("Trying app icon %s\n", app);261 print ("Trying app icon %s\n", app);
251 tex.set_from_icon_name (new Gtk.Image (), app, Gtk.IconSize.DND);262 tex.set_from_icon_name (new Gtk.Image (), app, Gtk.IconSize.DIALOG);
252 } catch (Error e) { warning (e.message); } //hm...263 } catch (Error e) { warning (e.message); } //hm...
253 }264 }
254 }265 }
@@ -264,11 +275,11 @@
264 } else {275 } else {
265 try { /*icon from the app perhaps?*/276 try { /*icon from the app perhaps?*/
266 debug ("Using app name");277 debug ("Using app name");
267 tex.set_from_icon_name (new Gtk.Image (), app.down (), Gtk.IconSize.DND);278 tex.set_from_icon_name (new Gtk.Image (), app.down (), Gtk.IconSize.DIALOG);
268 } catch (Error e) {279 } catch (Error e) {
269 debug ("Using fallback");280 debug ("Using fallback");
270 try { /*dialog-information icon as fallback*/281 try { /*dialog-information icon as fallback*/
271 tex.set_from_icon_name (new Gtk.Image (), "dialog-information", Gtk.IconSize.DND);282 tex.set_from_icon_name (new Gtk.Image (), "dialog-information", Gtk.IconSize.DIALOG);
272 } catch (Error e) { warning (e.message); }283 } catch (Error e) { warning (e.message); }
273 }284 }
274 }285 }
275286
=== modified file 'src/pantheon-notify.vala'
--- src/pantheon-notify.vala 2012-04-21 19:45:28 +0000
+++ src/pantheon-notify.vala 2012-04-21 19:53:20 +0000
@@ -1,6 +1,16 @@
11
2<<<<<<< TREE
2public const int WIDTH = 300;3public const int WIDTH = 300;
3public const int HEIGHT = 76; //56+2*10px shadow4public const int HEIGHT = 76; //56+2*10px shadow
5=======
6public const string NOTIFY_STYLE = """
7
8""";
9
10// FIXME: Width and Height should automatically take shadow into account
11public const int WIDTH = 320; //300 + (2 * 10)px shadow
12public const int HEIGHT = 76; //56 + (2 * 10)px shadow
13>>>>>>> MERGE-SOURCE
4public const int SHADOW = 10;14public const int SHADOW = 10;
5public const int EXPIRE = 7000; //in ms15public const int EXPIRE = 7000; //in ms
616

Subscribers

People subscribed via source and target branches

to all changes: