[Bug]: Navigation Menu (sidebar) CSS transition is janky with sharp corners
RayBB opened this issue · 2 comments
⚠️ This issue respects the following points: ⚠️
- This is a bug, not a question or a configuration/webserver/proxy issue.
- This issue is not already reported on Github OR Nextcloud Community Forum (I've searched it).
- Nextcloud Server is up to date. See Maintenance and Release Schedule for supported versions.
- I agree to follow Nextcloud's Code of Conduct.
Bug description
When you collapse a navigation menu there is a moment of jank where everything is overlapped, and the corner is sharp and looks bad. You can see it in this video.
This only occurs on the desktop view, the transition works nice if you have a smaller viewport.
I know this isn't a big issue and questioned if it is even worth reporting but I see so many people complain NC is buggy and has all these problems. While I haven't felt that myself, I do feel that having UI issues like this can contribute to that feeling.
I couldn't find another issue reporting this but I'm not even entirely sure if this is the right repo.
I'd be happy to take a look and submit a PR. I'd just like to make sure this hasn't been fixed yet on the latest branch and the issue matters enough that someone would review it before I try getting a dev environment setup.
I think the file that will need to be changed is apps.scss
Edit: Actually NcAppNavigation.vue in nextcloud-libraries/nextcloud-vue should be changed.
This fix seems to be to change &--close to be just margin-left: -300px; (or margin-left: $navigation-width). For mobile to look nice we also need to remove the :not portion of this line.
Video of fix
Tasks.-.Storage.Share.-.4.March.2024.mp4
Screenshot of the moment of jank
PS: I also posted about this on lemmy and reddit.
Steps to reproduce
- Go to tasks, contacts, or any app with a collapsible sidebar
- Collapse and open it
Expected behavior
It collapses smoothly
Installation method
None
Nextcloud Server version
27
Operating system
None
PHP engine version
None
Web server
None
Database engine version
None
Is this bug present after an update or on a fresh install?
None
Are you using the Nextcloud Server Encryption module?
None
What user-backends are you using?
- Default user-backend (database)
- LDAP/ Active Directory
- SSO - SAML
- Other
Configuration report
No response
List of activated Apps
No response
Nextcloud Signing status
No response
Nextcloud Logs
No response
Additional info
No response
Thanks for your report. 👍
You should indeed:
- Test with latest
masterbranch first. There is a Docker image available to easily deploy it. - Submit your PR to https://github.com/nextcloud-libraries/nextcloud-vue
Confirmed it on master with your image. Your image makes it every easy so thanks!
Will look into contributing to nextcloud-vue following their development setup guide.