panels
panels
is an object within the theme property for overriding styles wrappers for Views.
<Vizzly.Dashboard
// ...
theme={{
panels: {
background: "#fff",
borderRadius: "8px",
padding: "0.75rem 1rem",
},
}}
/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc posuere ligula a rutrum sagittis. Duis at libero fermentum, eleifend dui vitae, auctor dui. Nunc pharetra metus eros, sit amet congue urna condimentum et. Vestibulum sodales mi at magna lacinia facilisis. Morbi vitae vehicula est.
Panels
Panels are featured within <Vizzly.Dashboard/>
in the following loctions:
- All filled dashboard cells (Views) are within a
panels
wrapper. - In the View Library, all saved Views are within a
panels
wrapper.
Default Values
import Vizzly, { type VizzlyTheming } from "@vizzly/dashboard"
export function Dashboard() {
const theme: VizzlyTheming.Base = {
panels: {
// Default Values
border: "0",
background: "#fff",
boxShadow:
"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
borderRadius: "8px",
padding: "0.75rem 1rem",
},
}
return (
<Vizzly.Dashboard
// ...
theme={theme}
/>
)
}