chight/Web-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

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