[gnome-contacts/nielsdg/gtk4-papercuts] editor: Cleanup and improve styling

[Niels De Graef <nielsdg src gnome org>]

commit 11b9c9232945c72912ae344591d07da12a945860
Author: Niels De Graef <nielsdegraef gmail com>
Date:   Thu Feb 3 10:25:41 2022 +0100

    editor: Cleanup and improve styling
    
    * Use a single class for "main widgets" of a property editor and use
      widget names to specify further (eg. don't create a "main-entry" class
      but use entry.main-widget instead). This helps in keeping things
      consistent
    * Fixup some margins and paddings. For example, the birthday row doesn't
      look smaller than the rest anymore.
    * Use the margins to vertically align icons iso centering them
    * Fix a warning when setting an address

 data/ui/style.css                 | 30 ++++++++++++++----------------
 src/contacts-contact-editor.vala  |  2 +-
 src/contacts-editor-property.vala | 10 ++++++----
 3 files changed, 21 insertions(+), 21 deletions(-)
---
diff --git a/data/ui/style.css b/data/ui/style.css
index 47ecbb0e..4e68694c 100644
--- a/data/ui/style.css
+++ b/data/ui/style.css
@@ -71,31 +71,29 @@ flowboxchild.circular {
 }
 
   .contacts-editor-property .contacts-property-icon,
-  .contacts-editor-property .contacts-editor-main-entry image {
-    margin: 12px;
+  .contacts-editor-property entry.contacts-editor-main-widget image {
+    margin: 12px 12px;
+  }
+
+  .contacts-editor-property entry.contacts-editor-main-widget {
+    padding: 4px 6px 4px 0; /* left padding is for the icon */
   }
 
-  .contacts-editor-property .contacts-editor-main-entry {
-    padding: 6px 6px 6px 0; /* left padding is for the icon */
+  .contacts-editor-property button.contacts-editor-main-widget {
+    padding: 10px 0;
   }
 
 /* Class for editing postal address */
-.contacts-editor-address entry {
-  border-radius: 0;
-  border-width: 1px 1px 0 1px;
-  padding: 6px 6px;
+.contacts-editor-address {
+  padding-top: 6px;
+  padding-bottom: 6px;
 }
 
-  .contacts-editor-address entry:first-child {
-    border-radius: 4px 4px 0 0;
-  }
-
-  .contacts-editor-address entry:last-child {
-    border-radius: 0 0 4px 4px;
-    border-width: 1px;
+  .contacts-editor-address entry {
+    padding: 6px 3px;
   }
 
-/* Widget to edit a birthday */
+/* Widget to edit a birthday (_not_ the row itself) */
 .contacts-editor-birthday {
   margin: 12px;
 }
diff --git a/src/contacts-contact-editor.vala b/src/contacts-contact-editor.vala
index 805b3c0b..c68b4358 100644
--- a/src/contacts-contact-editor.vala
+++ b/src/contacts-contact-editor.vala
@@ -97,7 +97,7 @@ public class Contacts.ContactEditor : Gtk.Box {
 
     this.name_entry.changed.connect (() => {
       foreach (var p in this.individual.personas) {
-        var name_p = p as NameDetails;
+        unowned var name_p = p as NameDetails;
         if (name_p != null) {
           name_p.full_name = this.name_entry.get_text ();
         }
diff --git a/src/contacts-editor-property.vala b/src/contacts-editor-property.vala
index 47aa9bf0..888d5a97 100644
--- a/src/contacts-editor-property.vala
+++ b/src/contacts-editor-property.vala
@@ -170,15 +170,15 @@ public class Contacts.AddressEditor : Gtk.Box {
       append (this.entries[i]);
 
       var prop_name = AddressEditor.postal_element_props[i];
-      entries[i].changed.connect (() => {
-        details.value.set (prop_name, this.entries[i].text);
+      this.entries[i].changed.connect ((editable) => {
+        details.value.set (prop_name, editable.text);
         changed ();
       });
     }
   }
 
   public bool is_empty () {
-    foreach (var entry in entries) {
+    foreach (var entry in this.entries) {
       if (entry.get_text () != "") {
         return false;
       }
@@ -268,6 +268,7 @@ public class Contacts.EditorPropertyRow : Adw.Bin {
       unowned var icon_name = Utils.get_icon_name_for_property (this.ptype);
       if (icon_name != null) {
         var icon = new Gtk.Image.from_icon_name (icon_name);
+        icon.valign = Gtk.Align.START;
         icon.add_css_class ("contacts-property-icon");
         icon.tooltip_text = Utils.get_display_name_for_property (this.ptype);
         box.prepend (icon);
@@ -276,6 +277,7 @@ public class Contacts.EditorPropertyRow : Adw.Bin {
 
     // Set the actual widget
     // (mimic Adw.ActionRow's "activatable-widget")
+    widget.add_css_class ("contacts-editor-main-widget");
     box.append (widget);
     this.listbox.row_activated.connect ((activated_row) => {
       if (row == activated_row)
@@ -305,7 +307,7 @@ public class Contacts.EditorPropertyRow : Adw.Bin {
     entry.text = text;
     entry.placeholder_text = placeholder;
     entry.add_css_class ("flat");
-    entry.add_css_class ("contacts-editor-main-entry");
+
     // Set the icon as part of the GtkEntry, to avoid it being outside of the
     // margin
     unowned var icon_name = Utils.get_icon_name_for_property (this.ptype);