keannu125/Ivy-Frontend
1
0
Fork 0
mirror of https://github.com/lemeow125/Ivy-Frontend.git synced 2025-05-14 10:31:07 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Polished design for dashboard and made elements size responsive to viewport

Browse source
This commit is contained in:
Keannu Christian Bernasol 2023-02-17 20:33:45 +08:00
parent 2acfc48e1c
commit 810c805452
3 changed files with 102 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/components/DashboardContainer/DashboardContainer.tsx
View file

@ -2,28 +2,29 @@ import React from "react";
export interface props {
children: React.ReactNode;
width: string;
height: string;
}
export default function DashboardContainer(props: props) {
return (
<div
style={{
display: "flex",
flexDirection: "column",
alignSelf: "flex-start",
justifyContent: "left",
backgroundColor: "#1d3b33",
borderRadius: 16,
padding: 8,
paddingLeft: 48,
width: props.width,
height: props.height,
lineHeight: 0.4,
}}
>
{props.children}
<div style={{ marginRight: 32, marginLeft: 32 }}>
<div
style={{
display: "flex",
flexDirection: "column",
alignSelf: "flex-start",
justifyContent: "left",
backgroundColor: "#1d3b33",
borderRadius: 16,
padding: 16,
width: "100%",
height: "100%",
lineHeight: 0.4,
marginLeft: 8,
marginRight: 8,
}}
>
{props.children}
</div>
</div>
);
}