diff --git a/src/App.tsx b/src/App.tsx index bb8411f..4036c9e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -45,6 +45,9 @@ const useStyles = makeStyles((theme: Theme) => padding: theme.spacing(3, 3), minHeight: 310 }, + boxButton: { + padding: theme.spacing(3, 3) + }, boxHeader: { padding: theme.spacing(3, 3), height: theme.spacing(headerOffset), @@ -65,7 +68,8 @@ const useStyles = makeStyles((theme: Theme) => header: { backgroundColor: "#0b1216", color: "#f8f8f8", - padding: theme.spacing(9, 0, 6 + headerOffset), + textAlign: "center", + padding: theme.spacing(3, 0, 6 + headerOffset), marginBottom: -theme.spacing(headerOffset) }, button: { diff --git a/src/Header.tsx b/src/Header.tsx index 6182c01..ab2adae 100644 --- a/src/Header.tsx +++ b/src/Header.tsx @@ -5,7 +5,11 @@ import Typography from "@material-ui/core/Typography"; const useStyles = makeStyles((theme: Theme) => createStyles({ - root: { + title: { + // color: theme.palette.text.secondary, + }, + subtitle: { + color: theme.palette.text.secondary, margin: theme.spacing(3, 0, 0) }, lightBulb: { @@ -14,6 +18,21 @@ const useStyles = makeStyles((theme: Theme) => }, link: { color: theme.palette.primary.main + }, + logoContainer: { + display: "flex", + alignItems: "center", + justifyContent: "center", + marginBottom: theme.spacing(4) + }, + logo: { + width: "25px", + marginRight: "4px" + }, + logoText: { + display: "inline", + fontSize: "1.1rem", + fontWeight: 500 } }) ); @@ -22,14 +41,17 @@ export default function Header() { const classes = useStyles(); return ( <> - +
+ logo + Commons Stack +
+ + Augmented Token Bonding Curve Design - - Experiment and test augmented token bonding curves, part of the{" "} - - Commons Stack - + + + Experiment and test augmented token bonding curves ); diff --git a/src/app.css b/src/app.css index 65ee8bc..9474f9b 100644 --- a/src/app.css +++ b/src/app.css @@ -1,4 +1,4 @@ #root { - background-color: #202930; + background-color: #152128; min-height: 100vh; }