Hotfix to allow pages to scroll

This commit is contained in:
Keannu Bernasol 2023-02-15 00:15:42 +08:00
parent 534993efc2
commit 32e7ab8830
3 changed files with 14 additions and 14 deletions

View file

@ -1,5 +1,6 @@
import React from "react"; import React from "react";
import Sidebar from "../Sidebar/Sidebar"; import Sidebar from "../Sidebar/Sidebar";
import styles from "../../styles";
export interface props { export interface props {
children: React.ReactNode; children: React.ReactNode;
@ -8,13 +9,11 @@ export interface props {
export default function Container(props: props) { export default function Container(props: props) {
return ( return (
<div> <div>
<div style={{ display: "flex", flexDirection: "row" }}> <div>
<div style={{ width: "85%", position: "fixed", left: "15%" }}>
{props.children}
</div>
<div style={{ width: "15%", position: "fixed" }}> <div style={{ width: "15%", position: "fixed" }}>
<Sidebar /> <Sidebar />
</div> </div>
<div style={styles.route_wrapper}>{props.children}</div>
</div> </div>
</div> </div>
); );

View file

@ -5,12 +5,10 @@ import styles from "../../styles";
export default function Dashboard() { export default function Dashboard() {
return ( return (
<div style={styles.background}>
<div style={styles.container}> <div style={styles.container}>
<AppLogo size={64} color="#6f9b78" /> <AppLogo size={64} color="#6f9b78" />
<p style={styles.text}>Ivy - Inventory Manager</p> <p style={styles.text}>Ivy - Inventory Manager</p>
<p style={styles.text}>Welcome to the Dashboard</p> <p style={styles.text}>Welcome to the Dashboard</p>
</div> </div>
</div>
); );
} }

View file

@ -1,14 +1,17 @@
const styles: { [key: string]: React.CSSProperties } = { const styles: { [key: string]: React.CSSProperties } = {
background: { route_wrapper: {
width: "85%",
position: "fixed",
left: "15%",
overflowY: "scroll",
height: "100%",
backgroundColor: "#0b2322", backgroundColor: "#0b2322",
display: "flex",
flexDirection: "column",
height: "100vh",
}, },
container: { container: {
display: "flex", display: "flex",
flexDirection: "column", flexDirection: "column",
flex: 1, flex: 1,
height: "100%",
alignItems: "center", alignItems: "center",
paddingTop: 32, paddingTop: 32,
}, },