Sidebar | Improving the UX

[aadeshkulkarni]

UI/UX issues with Sidebar

1. Checkbox color (blue) increases visual instability by adding a third color to the sidebar. Changing it to shades of gray will improve UX.
2. Go back button is unnecessarily getting focus due to blue bg-color.
3. Accordion title hover changes bg color and adds underline to title. Underline is unnecessary, causes visual instability.
4. Accordion title does not have user's progress (For instance, 3/4 done. Something that apps like Udemy have)
5. Scrolling is required. But scrollbar can be hidden. The scrollbar uglifies the UI. It's possible to keep scrolling functionality without showing scrollbar. (And this is already implemented in other pages of cms)
6. Accordion children elements look congested. They can have some space to breathe. Looks visually depressing at this moment.

---

Existing UI (Dark mode)

Proposed UI (Dark mode)

---

Existing UI (Light mode)

Proposed UI (Light mode)

---

[aadeshkulkarni]

I have made the proposed changes on my dev instance. If the maintainers feel like moving forward with this, I can raise a PR.

[nihar-hegde]

instead of completely removing the scrollbar a custom scrollbar can be implemented

[hxdy-1]

@aadeshkulkarni @nihar-hegde why u guys have not raised a PR yet? custom scroll bar looks way better here!

[aadeshkulkarni]

Waiting on @hkirat to provide his feedback before picking it up.