Make left hand sidebar items collapsible and allow for sub-links
See original GitHub issue🚀 Feature Proposal
The left hand sidebar should make the items collapsible and allow for sub links.
Sidebar should look something like:
- Dashboard
- Patient
- New Patient
- Patient List
- Scheduling
- New Appointment
- Appointment Schedule
When accessing any route /patient/**, the Patients item should be highlighted.
When accessing any route /appointments/** the Scheduling item should be highlighted.
Sub items should also be properly marked active. (E.g. when New Patient screen is shown, Patient Item should be highlighted and New Patient item should be highlighted.
Clicking on any other section should collapse the previously selected section and expand the newly selected one.
Example
It should operate very similarly to http://demo.hospitalrun.io/
Technical Notes
Should remove dropdown links from Navbar.
Issue Analytics
- State:
- Created 4 years ago
- Comments:9 (8 by maintainers)
Top Results From Across the Web
React Sidebar with Dropdown Menu Tutorial - YouTube
Learn how to make a React Sidebar with Dropdown Menu. We will use react hooks and styled-components to create this sub navigation.
Read more >How to make collapsible list in sidebar - Stack Overflow
Try creating an object with the state of the collapsed elements, like this: const Sidebar = ({ title, children, data, opened, ...
Read more >How to Create an Expandable Sidebar Navigation Links
With this tutorial, you will get all of the needed HTML, CSS, and JS to create these expandable/collapsible navigational elements. HTML. The HTML...
Read more >How To Create a Collapsed Sidebar - W3Schools
Learn how to create a collapsible sidebar menu. ... use this if you want to push the page content to the right when...
Read more >Can you set the Quick Launch Menu as to default as collapsed ...
It's these simple things which makes us hold the rollout to modern pages. ... Right now it's opening the page associated to this...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

Here we have to hear something from @StefanoMiC too!
@sotous just the default white for any selected children. I’m not sure that a color separation between the selected parent and the selected child is necessary.