Copied and pasted most recent App.jsx into Dashboard.jsx

This commit is contained in:
2025-07-23 21:31:18 +00:00
parent 20ca59ad82
commit cde87274c6
+52 -36
View File
@@ -13,42 +13,58 @@ export default function Dashboard() {
const [view, setView] = useState("widget"); const [view, setView] = useState("widget");
return ( return (
<> <>
<Global // change the background color of widget shadow when moving <Global // change the background color of widget shadow when moving
styles={css` styles={css`
.react-grid-placeholder { .react-grid-placeholder {
background: #c0d2e3ff !important; background: #c0d2e3ff !important;
border-color: #a9b6c2ff !important; border-color: #a9b6c2ff !important;
box-shadow: 0 0 10px #c0d2e3ff !important; box-shadow: 0 0 10px #c0d2e3ff !important;
opacity: 1 !important; opacity: 1 !important;
border-radius: 5px; border-radius: 5px;
} }
.react-resizable-handle-se { .react-resizable-handle-se {
position: sticky; position: absolute;
right: 0; bottom: 0;
bottom: 0; z-index: 1;
} border-radius: 5px;
`} }
/>
<Grid css={styles} * {
templateRows="1fr 11fr" scrollbar-width: thin; /* Firefox */
templateColumns="1fr 20fr" scrollbar-color: #a0aec0 transparent; /* Firefox */
height="100vh" }
width="100vw"
> /* Chrome, Edge, Safari */
<GridItem rowSpan={1} colSpan={2}> ::-webkit-scrollbar {
<Header /> width: 8px;
</GridItem> }
<GridItem colSpan={1}> ::-webkit-scrollbar-thumb {
<Sidebar onChangeView={ setView } /> background-color: rgba(100, 100, 100, 0.4);
</GridItem> border-radius: 4px;
<GridItem colSpan={1} width="100%"> }
<Canvas view={ view }/> ::-webkit-scrollbar-track {
</GridItem> background: transparent;
</Grid> }
`}
/>
<Grid css={styles}
templateRows="1fr 11fr"
templateColumns="1fr 20fr"
height="100vh"
width="100vw"
>
<GridItem rowSpan={1} colSpan={2}>
<Header />
</GridItem>
<GridItem colSpan={1}>
<Sidebar />
</GridItem>
<GridItem colSpan={1} width="100%">
<Canvas />
</GridItem>
</Grid>
</> </>
); );
} }