diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/components/logo.tsx | 4 | ||||
-rw-r--r-- | src/components/navbar.tsx | 3 | ||||
-rw-r--r-- | src/components/page.tsx | 14 | ||||
-rw-r--r-- | src/pages/home.jsx | 7 |
4 files changed, 22 insertions, 6 deletions
diff --git a/src/components/logo.tsx b/src/components/logo.tsx index 1d1f3c6..b0f358f 100644 --- a/src/components/logo.tsx +++ b/src/components/logo.tsx @@ -6,7 +6,7 @@ export function LogoDark() { <circle cx="6.5" cy="6.5" r="4.5" fill="var(--disk-b)"/> <circle cx="6.5" cy="17.5" r="4.5" fill="var(--disk-a)"/> <circle cx="17.5" cy="17.5" r="4.5" fill="var(--disk-b)"/> - <circle cx="17.5" cy="6.5" r="3.5" stroke="var(--text)" stroke-width="2"/> + <circle cx="17.5" cy="6.5" r="3.5" stroke="var(--text)" strokeWidth="2"/> </svg> </div> ); @@ -20,7 +20,7 @@ export function LogoLight() { <circle cx="6.5" cy="6.5" r="4.5" fill="var(--disk-b)"/> <circle cx="6.5" cy="17.5" r="4.5" fill="var(--disk-a)"/> <circle cx="17.5" cy="17.5" r="4.5" fill="var(--disk-b)"/> - <circle cx="17.5" cy="6.5" r="3.5" stroke="var(--background)" stroke-width="2"/> + <circle cx="17.5" cy="6.5" r="3.5" stroke="var(--background)" strokeWidth="2"/> </svg> </div> ); diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx index 45818b3..904e64a 100644 --- a/src/components/navbar.tsx +++ b/src/components/navbar.tsx @@ -38,7 +38,7 @@ var NavBarSettingsAreaStyle: CSSProperties = { left: 0 } -function NavBar() { +export function NavBar() { return ( <div className="navbar" style={NavBarStyle}> <div style={NavBarItemStyle}><LogoDark/></div> @@ -54,4 +54,3 @@ function NavBar() { ); } -export default NavBar; diff --git a/src/components/page.tsx b/src/components/page.tsx new file mode 100644 index 0000000..03a6fbc --- /dev/null +++ b/src/components/page.tsx @@ -0,0 +1,14 @@ +import { Component, CSSProperties } from 'react'; + +var CenteredPageStyle: CSSProperties = { + maxWidth: 783, + margin: "0 auto" +} + +export class CenteredPage extends Component { + render () { + return <div style={CenteredPageStyle}> + {this.props.children} + </div> + } +} diff --git a/src/pages/home.jsx b/src/pages/home.jsx index b9d7926..547f3e9 100644 --- a/src/pages/home.jsx +++ b/src/pages/home.jsx @@ -1,10 +1,13 @@ -import NavBar from '../components/navbar'; +import { NavBar } from '../components/navbar'; +import { CenteredPage } from '../components/page.tsx'; function HomePage() { return ( <div> <NavBar /> - <div>Zalige content op deze pagina yo</div> + <CenteredPage> + <div>Zalige content op deze pagina yo</div> + </CenteredPage> </div> ); } |