Merge lp:~elementary-apps/pantheon-mail/link-dialog-hig into lp:~elementary-apps/pantheon-mail/trunk

[Danielle Foré]

composer-widget.vala:
* Add icon, primary, and secondary text to link dialog
* Code style
* Remove dialog close button
* Make dialog unresizable

[David Hewitt (davidmhewitt)]

All looks/works great. I have one minor piece of feedback though. When you open the dialog, then go off to your web browser to copy the link, when you come back, the pre-filled "http://" in the text box is no longer selected. So you then have to either delete that or select it before pasting your link.

It would be good if that got re-selected when the dialog was brought into focus again if it's not too much work.

Unmerged revisions

2231. By Danielle Foré on 2017-02-03

make link dialog adhere to HIG

=== modified file 'src/client/composer/composer-widget.vala'
--- src/client/composer/composer-widget.vala	2016-07-07 19:36:17 +0000
+++ src/client/composer/composer-widget.vala	2017-02-03 02:21:55 +0000
@@ -1915,30 +1915,49 @@
             existing_link = true;
             dialog.add_buttons(Stock._REMOVE, Gtk.ResponseType.REJECT);
         }
-        
-        dialog.add_buttons(Stock._CANCEL, Gtk.ResponseType.CANCEL, Stock._OK,
-            Gtk.ResponseType.OK);
-        
-        Gtk.Entry entry = new Gtk.Entry();
+
+        var icon = new Gtk.Image.from_icon_name ("insert-link", Gtk.IconSize.DIALOG);
+        icon.valign = Gtk.Align.START;
+
+        var primary_label = new Gtk.Label (_("Where Should This Link Go?"));
+        primary_label.get_style_context ().add_class ("primary");
+        primary_label.xalign = 0;
+
+        var secondary_label = new Gtk.Label (_("First, find the page on the web that you want to link to. Then, copy the web address from your browser's address bar and paste it into the box below."));
+        secondary_label.wrap = true;
+        secondary_label.max_width_chars = 60;
+        secondary_label.xalign = 0;
+        
+        var entry = new Gtk.Entry ();
+        entry.activates_default = true;
+        entry.text = link;
+        entry.move_cursor (Gtk.MovementStep.BUFFER_ENDS, 0, false);
+
         entry.changed.connect(() => {
             // Only allow OK when there's text in the box.
             dialog.set_response_sensitive(Gtk.ResponseType.OK, 
                 !Geary.String.is_empty(entry.text.strip()));
         });
-        
-        dialog.width_request = 350;
-        dialog.get_content_area().spacing = 7;
-        dialog.get_content_area().border_width = 10;
-        dialog.get_content_area().pack_start(new Gtk.Label("Link URL:"));
-        dialog.get_content_area().pack_start(entry);
+
+        var grid = new Gtk.Grid ();
+        grid.column_spacing = 12;
+        grid.row_spacing = 6;
+        grid.margin = 10;   
+        grid.margin_top = 0;
+        grid.attach (icon, 0, 0, 1, 2);
+        grid.attach (primary_label, 1, 0, 1, 1);
+        grid.attach (secondary_label, 1, 1, 1, 1);
+        grid.attach (entry, 1, 2, 1, 1);
+
+        dialog.add_buttons (_("Cancel"), Gtk.ResponseType.CANCEL, _("Link"), Gtk.ResponseType.OK);
+        dialog.get_action_area ().margin = 4;
+        dialog.get_content_area ().add (grid);
         dialog.get_widget_for_response(Gtk.ResponseType.OK).can_default = true;
+        dialog.deletable = false;
+        dialog.resizable = false;
         dialog.set_default_response(Gtk.ResponseType.OK);
         dialog.show_all();
-        
-        entry.set_text(link);
-        entry.activates_default = true;
-        entry.move_cursor(Gtk.MovementStep.BUFFER_ENDS, 0, false);
-        
+
         int response = dialog.run();
         
         // Re-establish selection, since selecting text in the Entry will de-select all