diff options
Diffstat (limited to 'components')
-rw-r--r-- | components/navbar.tsx | 21 | ||||
-rw-r--r-- | components/ui.tsx | 6 |
2 files changed, 17 insertions, 10 deletions
diff --git a/components/navbar.tsx b/components/navbar.tsx index 9a3f9ff..c62965a 100644 --- a/components/navbar.tsx +++ b/components/navbar.tsx @@ -27,11 +27,14 @@ export class NavBar extends Component { constructor(props: {}) { super(props); - if (typeof window === "undefined") return; // return if run on server - this.state.loggedIn = document.cookie.includes("token"); } render () { + if (typeof window !== "undefined") { // hot garbage but werks :tada: + var loggedIn = document.cookie.includes("token"); + if (this.state.loggedIn != loggedIn) + this.setState({ loggedIn }); + } return <div className="navbar" style={{ width: 48, height: "100%", @@ -60,13 +63,13 @@ export class NavBar extends Component { left: 0, backgroundColor: "var(--background)" }}> - <a href={this.state.loggedIn ? "/account" : "/login"} style={NavBarItemStyle}> - { - this.state.loggedIn ? - <AccountAvatar size={24} dummy round/> : - <PersonIcon/> - } - </a> + <a href={this.state.loggedIn ? "/account" : "/login"} style={NavBarItemStyle}> + { + this.state.loggedIn ? + <AccountAvatar size={24} dummy round/> : + <PersonIcon/> + } + </a> <a href="/settings" style={NavBarItemStyle}><SettingsIcon/></a> </div> </div> diff --git a/components/ui.tsx b/components/ui.tsx index 11b9ddd..f57a90a 100644 --- a/components/ui.tsx +++ b/components/ui.tsx @@ -12,6 +12,7 @@ export function Vierkant(props: { children?: ReactNode; className?: string; id?: string; + fullwidth?: boolean; }) { return <a style={{ padding: 24, @@ -22,7 +23,10 @@ export function Vierkant(props: { display: "inline-block", position: "relative", boxSizing: "border-box", - width: props.width ? props.width : undefined, + width: + props.width ? props.width : + props.fullwidth ? "calc(100% - 12px)" : + undefined, height: props.height ? props.height : undefined, ...props.style }} href={props.href} className={props.className} id={props.id}>{props.children}</a> |