Improving the mobile css #180
Open
+254
−138
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Looks much better with the changes 👍 |
On the List page: - Timespans now can collapse when the page is < 550px in width - Moved the notes button to the far right side On settings page: - Removed the min width, this makes it fit nicely on mobile - Made the chips possible to go onto multiple lines, since otherwise long tag names would overflow (even on desktop)
|
Here are some pictures of the new changes to the list page: Details
Mobile / when the page is smaller in width: |
|
And a cropped view of the settings page on mobile: |
The changes here also improve the calendar when you click on a timespan. Previously it would be offscreen on my phone, and impossible to click the 3 dots to show more.
|
Preview of the most recent changes. The timespans wrap nicer now. The calendar page also has the popup fixed on mobile, since it also will wrap. It does go into the top left corner for some reason when the page resizes, but I think that's more a feature since it won't get lost on mobile. 2024-09-21_14-01-42.mp4 |
This doesn't full fix the sizing, but it helps greatly and should be good enough. I cannot think of any better way of improving these pages for mobile.
jmattheis
reviewed
Sep 22, 2024
jmattheis
requested changes
Sep 28, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This is still a work in progress, so I'm hoping for some feedback.
My plans for this are:
For the calendar, I:
Here is how it looks now on the week view on my phone:
Details