Contacts: Introduce 3-dot-menu in top right for Download and Delete

[jancborchardt]

Instead of showing these icons (and possibly more in the future) permanently, and without text, we should show a 3-dot-icon which will open a menu listing those actions. That will also save space on mobile to display the name more properly.

[xh3n1]

@jancborchardt : horizontal or vertical 3-dot-icon?

[jancborchardt]

@xh3n1 horizontal - simply use the class="icon-more" and our standard more-icon will be used. :)

[rutujasurve94]

@jancborchardt @xh3n1 I'd like to take this issue up. Could you point to the code base that displays the Download and delete icons and does more-icon mean 3 dot icon? We need a drop down menu that shows download and delete on clicking this icon. Could you point to a sample code base where such a thing is being done?

[jancborchardt]

@rutujasurve94 cool! The point in the code is findable by simply searching for the text – for example here for "download":
https://github.com/nextcloud/contacts/search?utf8=%E2%9C%93&q=download&type=
The templates/contactDetails.html is the correct file, with the occurences lower down (the first icon-download is only rotated to be a back button on mobile ;)

Documentation on the popover menu can be found in the design documentation at https://docs.nextcloud.com/server/13/developer_manual/design/popovermenu.html

Cheers :)

[rutujasurve94]

@jancborchardt thanks a lot. I'll get back to you soon with this.

[rutujasurve94]

Hey! @jancborchardt I've raised a pull request for this here: https://github.com/nextcloud/contacts/pull/500

[sleepypioneer]

Hi @jancborchardt and @rutujasurve94 I saw this was still open and was working on a similar issue for which this one helped me, as I have a solution I have also made a pull request #550 for this issue. I hope you don't mind @rutujasurve94 the notes you all shared were a great help!!