diff options
author | Niels De Graef <nielsdegraef@gmail.com> | 2023-02-20 22:44:34 +0100 |
---|---|---|
committer | Niels De Graef <nielsdegraef@gmail.com> | 2023-02-21 15:02:47 +0000 |
commit | 0f2d408c1a3ec818f3f59fce5a04aeae88f2ef6c (patch) | |
tree | 047653f91d9186af074a3850d7d91344debcd391 /data | |
parent | cb544e27d7aa5e6debe19f7f6b57bb6937720bbb (diff) | |
download | gnome-contacts-0f2d408c1a3ec818f3f59fce5a04aeae88f2ef6c.tar.gz |
Add EditableAvatar custom widget
Rather than awkwardly shoehorning an `AdwAvatar` into a button, let's be
a bit more helpful and just overlay 2 buttons, one for editing and one
for deleting the avatar.
Fixes: https://gitlab.gnome.org/GNOME/gnome-contacts/-/issues/217
Fixes: https://gitlab.gnome.org/GNOME/gnome-contacts/-/issues/26
Diffstat (limited to 'data')
-rw-r--r-- | data/contacts.gresource.xml | 1 | ||||
-rw-r--r-- | data/ui/contacts-editable-avatar.ui | 47 | ||||
-rw-r--r-- | data/ui/style.css | 6 |
3 files changed, 52 insertions, 2 deletions
diff --git a/data/contacts.gresource.xml b/data/contacts.gresource.xml index 3d46685..e9158c1 100644 --- a/data/contacts.gresource.xml +++ b/data/contacts.gresource.xml @@ -18,6 +18,7 @@ <file compressed="true" preprocess="xml-stripblanks">ui/contacts-avatar-selector.ui</file> <file compressed="true" preprocess="xml-stripblanks">ui/contacts-contact-pane.ui</file> <file compressed="true" preprocess="xml-stripblanks">ui/contacts-crop-dialog.ui</file> + <file compressed="true" preprocess="xml-stripblanks">ui/contacts-editable-avatar.ui</file> <file compressed="true" preprocess="xml-stripblanks">ui/contacts-editor-menu.ui</file> <file compressed="true" preprocess="xml-stripblanks">ui/contacts-link-suggestion-grid.ui</file> <file compressed="true" preprocess="xml-stripblanks">ui/contacts-main-window.ui</file> diff --git a/data/ui/contacts-editable-avatar.ui b/data/ui/contacts-editable-avatar.ui new file mode 100644 index 0000000..1f2261f --- /dev/null +++ b/data/ui/contacts-editable-avatar.ui @@ -0,0 +1,47 @@ +<?xml version="1.0" encoding="UTF-8"?> +<interface> + <template class="ContactsEditableAvatar" parent="GtkWidget"> + <child> + <object class="GtkOverlay" id="overlay"> + <child type="overlay"> + <object class="AdwBin"> + <property name="halign">end</property> + <property name="valign">start</property> + <style> + <class name="contacts-cutout-button"/> + </style> + <child> + <object class="GtkButton"> + <property name="action-name">edit-avatar</property> + <property name="icon-name">document-edit-symbolic</property> + <property name="tooltip-text" translatable="yes">Change Avatar</property> + <style> + <class name="circular"/> + </style> + </object> + </child> + </object> + </child> + <child type="overlay"> + <object class="AdwBin"> + <property name="halign">end</property> + <property name="valign">end</property> + <style> + <class name="contacts-cutout-button"/> + </style> + <child> + <object class="GtkButton"> + <property name="action-name">delete-avatar</property> + <property name="icon-name">user-trash-symbolic</property> + <property name="tooltip-text" translatable="yes">Remove Avatar</property> + <style> + <class name="circular"/> + </style> + </object> + </child> + </object> + </child> + </object> + </child> + </template> +</interface> diff --git a/data/ui/style.css b/data/ui/style.css index f33ee8d..6593344 100644 --- a/data/ui/style.css +++ b/data/ui/style.css @@ -31,9 +31,11 @@ font-size: 20px; } -flowboxchild.circular { - padding: 4px; +/* Used to provide a little cutout around an overlayed circular button */ +.contacts-cutout-button { + background-color: @window_bg_color; border-radius: 9999px; + padding: 2px; } /* Contact Sheet/Editor common */ |