Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

make buttons edgy on mobile #698

Closed
wants to merge 2 commits into from

Conversation

szaimen
Copy link
Collaborator

@szaimen szaimen commented Apr 9, 2022

This is best reviewed like this: https://github.com/nextcloud/firstrunwizard/pull/698/files?diff=unified&w=1

Reason for this: I think edgy buttons look better for mobile:

Before After
image image
image image

Signed-off-by: szaimen szaimen@e.mail.de

For my own testing
docker run -it \
-e FIRSTRUNWIZARD_BRANCH=enh/noid/make-buttons-edgy-on-mobile \
-p 8443:443 \
-e TRUSTED_DOMAIN=192.168.146.128 \
--name nextcloud-easy-test \
ghcr.io/szaimen/nextcloud-easy-test:latest

@szaimen szaimen added this to the Nextcloud 24 milestone Apr 9, 2022
@szaimen szaimen requested a review from juliusknorr April 9, 2022 16:55
@szaimen szaimen force-pushed the enh/noid/make-buttons-edgy-on-mobile branch 7 times, most recently from 1270d40 to 13f4aed Compare April 9, 2022 17:28
@szaimen
Copy link
Collaborator Author

szaimen commented Apr 9, 2022

/compile amend /

Signed-off-by: szaimen <szaimen@e.mail.de>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
Copy link

@artonge artonge left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code looks good. But let's wait for the design team input before merging.

src/App.vue Show resolved Hide resolved
@szaimen
Copy link
Collaborator Author

szaimen commented Apr 11, 2022

/compile amend /

Signed-off-by: szaimen <szaimen@e.mail.de>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
@nextcloud-command nextcloud-command force-pushed the enh/noid/make-buttons-edgy-on-mobile branch from 4f226f2 to 584d1c9 Compare April 11, 2022 14:18
Copy link
Member

@jancborchardt jancborchardt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Reason for this: I think edgy buttons look better for mobile

:D love the reasoning.

Counter-proposal: We keep the circular buttons, but on mobile we move them to the bottom, with a bit of whitespace to the bottom and each of the sides respectively. Kind of like an Android FAB, but on both sides. Also easier to reach for fingers.

@szaimen
Copy link
Collaborator Author

szaimen commented Apr 11, 2022

Counter-proposal: We keep the circular buttons, but on mobile we move them to the bottom, with a bit of whitespace to the bottom and each of the sides respectively. Kind of like an Android FAB, but on both sides. Also easier to reach for fingers.

Prpblem with moving it to the bottom is that the buttons will overlap the content and other buttons in the templates which looks really weird, in my opinion. That is why they are positioned where they are currently...

@szaimen
Copy link
Collaborator Author

szaimen commented Apr 12, 2022

@jancborchardt what is your take on this?

Prpblem with moving it to the bottom is that the buttons will overlap the content and other buttons in the templates which looks really weird, in my opinion. That is why they are positioned where they are currently...

@nimishavijay
Copy link
Member

Looks interesting!
Most of our buttons are round (or have a pill-shape) so I'm wondering if it would be consistent with our designs 🤔

@szaimen
Copy link
Collaborator Author

szaimen commented Apr 13, 2022

Looks interesting! Most of our buttons are round (or have a pill-shape) so I'm wondering if it would be consistent with our designs 🤔

Not sure. Please decide and let me know to merge or to close :)

@szaimen
Copy link
Collaborator Author

szaimen commented Apr 14, 2022

I am fine with any decision but I need a decision here :)

@nimishavijay
Copy link
Member

I would keep the circular buttons, it is consistent with our style :)

@szaimen
Copy link
Collaborator Author

szaimen commented Apr 19, 2022

I would keep the circular buttons, it is consistent with our style :)

okay 👍

@szaimen szaimen closed this Apr 19, 2022
@szaimen szaimen deleted the enh/noid/make-buttons-edgy-on-mobile branch April 19, 2022 09:46
@jancborchardt
Copy link
Member

Sorry for late reply @szaimen · regardong the overlap issue, we can make sure that if left/right controls are present, that on mobile there's room for them below the modal?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants