Extending V13 Backoffice with Custom dashboard using UUI Library
c
Hey all, Looking to create just a simple welcome sort of dashboard to replace the default Umbraco one for clients. (Simple welcome message and a few links for getting in contact with myself, linking to some of my documentation e.t.c) Was trying to leverage the https://uui.umbraco.com/ library and thought I'd go with a simple Box Layout as the heading of the Dashboard which looks fine, Then thought i'd use the "Card" component to act as the few quicklinks. However simply adding 4 "" elements of course renders them underneath eachother. Is there a section Im missing on the Umbraco library on how Grid / Row / Column Layouts are achieved? The https://uui.umbraco.com/?path=/story/design-style-guide--layout link describes the idea, but I was expecting some elements prebuilt to handle certain configurations or am I mistaken?
d
Hi there! My experience thus far is that layout is your own responsibility. I usually go by: "If it's not explicitly in the storybook, then I have to make it myself"
s
Maybe get some inspiration from The Dashboard by @Markus Johansson : https://marketplace.umbraco.com/package/our.umbraco.thedashboard Source code: https://github.com/enkelmedia/TheDashboard
m
If you want the elements to not render underneath each other - just put them in a wrapping div and use display:flex?
c
Thanks for the suggestion @Sebastiaan ! Indeed @Markus Johansson I can do that, Was just expecting there to be some UI elements such as a (hypothetically speaking) with slots for say the But I expected wrong 😅
d
looking cool!
37 Views