I've done my best at trying to understand Layout managers but I can't get this working.
I'd really only like to tweak the baseline layout anyway. Is it possible to do this or do I need to set up a full alternative layout manager?
Can I confirm you are using @flowfuse/node-red-dashboard AKA dashboard 2 (not the original node-red-dashboard)
Also, can I confirm you are developing a new base layout to be compiled into the dashboard and submitted as a Pull Request to the repository on GitHub?
Is the tweak something that would be useful to others? If so would you consider it an enhancement or would the current behaviour need to be supported too?
Yep, @flowfuse/node-red-dashboard-2.0.
I'm only wanting to tweak it for my own project, not really to publish.
The main thing I want to do is change the behaviour of the navigation slide out.
It would be great if I could just replace the baseline layout for another Vuetify application layout or wireframe.
Ok, well that document is about developing functionality within, not tweaking an already installed (compiled) dashboard.
If you explain clearly what you are trying to achieve, there may be CSS or other man's of achieving your requirements or it may be you need to raise feature requests but we can't really suggest anything without knowing what you are trying to do.
It seems the baseline layout is based on the baseline wireframe. Of course I could be wrong about all that.
Is it possible to change the application layout or wireframe?
To be more clear, I'd like to replace the existing navigation drawer with the expand on hover one described here.
To support this, I suspect it will need to be baked in to baseline.vue (in the source) as optional settings for the v-navigation-drawer
Something like:
<v-navigation-drawer
:expand-on-hover="showOnHover"
:rail="showOnHover"
>
Here is a working example: Vuetify — Playground
HOWEVER: There then needs to be a way to surface the new option(s) to the node-red user (by a UI option in the ui-base node and/or a special control message to toggle the new option(s))
At least thats my take - @joepavitt would have to comment on whether this is the right approach and if it is something he wants in dashboard-2
3 Likes
Hey @Waz - great to know you're interested in doing this.
I re-architected the way layouts are rendered vs. Dashboard 1.0 so that this would be possible in Dashboard 2.0, the caveat is, it's not quite there yet.
Like a lot of things, its in the plans, but we haven't quite worked out a solid API for this just yet (like we do for third party widgets and plugins).
To your specific request though, the sidebar behaviour is something I would like to see configuarable anyway, so I'd be very open to see option introduced at the ui-base level to configure it! (Maybe at the ui-page level?)
Guys, thank you so much for the great answers. I feel stupid, I mixed up that part of the documentation was intended for re-compiling the source code, not to tweak the installation 
No wonder I couldn't find the ui/src/* folders 
Dashboard 2.0 is an amazing project. That fact we can now drop in Vuetify components is exciting.
@joepavitt you have a lot on your plate so any work you do towards this request of tweaking the base is much appreciated. I think this and multi-user are the cherries on top that makes this a full blown low-code app builder.
Looking forward to the webinar later this month.
1 Like
I would like to see the nav drawer pinned open with just icons (min px?). So a hover (or tap in whitespace on mobile) would pop the remaining part of the drawer out containing the text. Even better if the colours of those two can be dynamic but not crucial.
This might not even need the complexity of changing out the baseline/page. But then again I know nothing when it comes to that 
The current hamburger icon menu requires two clicks/taps to get to another page. A pinned icon pane only requires one.
Issue opened, any dtails you'd like to add please do so on the issue: Navigation Drawer - Configurable Styles · Issue #549 · FlowFuse/node-red-dashboard · GitHub
1 Like
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
