WIP: Resolve "UI Bugs and Design Changes"
What does this mr do?
Apply a whole bunch of small UI changes and solve some UI bugs.
- Change the "notification bell icon" to "notifications" on a medium sized screen
- Switch queue and hamburger menu (on mobile) → keep the menu positions consistent
- Show in the mobile menu if you have notifications
- Make selected menu item more subtle, not black. E.g. underline or dark blue
- Add animation to hamburger menu
- Fix personal user menu to match the whole menu
- Fix the footer on mobile such that the logo and the privacy statement are next to each other
- Give footer a margin-top to get a separation on mobile
- Add margins to mobile course view
- On notifications page (mobile), opening the menu => notifications item flashes blue
- On notifications page (mobile), make title and clear all button fit on one line
- While enqueued, the position in the queue is the most important => increase font of the number/center it
- Show rooms in lab info in a more structured way
Screenshots
-
Change the "notification bell icon" to "notifications" on a medium sized screen
-
Switch queue and hamburger menu (on mobile) → keep the menu positions consistent
-
Show in the mobile menu if you have notifications
![](/-/project/967/uploads/cba4be2c9df2207925f7cc111b9dccc4/Screenshot_2020-03-28_at_17.33.03.png)
- Make selected menu item more subtle
![](/-/project/967/uploads/b434c6d7453e59b5a620cc9cd84e5fea/Screenshot_2020-03-28_at_17.34.13.png)
-
Fix the footer on mobile such that the logo and the privacy statement are next to each other
![](/-/project/967/uploads/f52463f0d5b2247f114f71cb44683042/Screenshot_2020-03-28_at_17.35.38.png)
- Add margins to mobile course view
![](/-/project/967/uploads/533fa0f273eb3c821a030772c3240197/Screenshot_2020-03-28_at_17.36.21.png)
- On notifications page (mobile), make title and clear all button fit on one line
![](/-/project/967/uploads/fa8afac5f8042a4da393ab786126ca95/Screenshot_2020-03-28_at_17.37.00.png)
- While enqueued, the position in the queue is the most important => increase font of the number/center it
![](/-/project/967/uploads/0d08e3c898a57861df6c49161bb4de3b/Screenshot_2020-03-28_at_17.38.22.png)
![Screenshot_2020-03-28_at_17.38.37](/-/project/967/uploads/904ec23b071ad43c3ffe0b483fbf985e/Screenshot_2020-03-28_at_17.38.37.png)
Does this MR meet the acceptance criteria?
-
I have added a changelog entry to reflect the significant changes I made. -
Tests were created to test the feature. -
I have updated the documentation accordingly. -
I adhere to the style guide.
Closes #294 (closed)
Edited by Chris Lemaire