layout tweaks

This commit is contained in:
Matthias Kretschmann 2022-10-19 18:10:04 +01:00
parent a9d6a68545
commit 2e49e35c55
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 13 additions and 6 deletions

View File

@ -45,7 +45,7 @@ export default function HomePage(): ReactElement {
}, []) }, [])
return ( return (
<div className={styles.container}> <div className={styles.app}>
<Head> <Head>
<title>Ocean Protocol Status</title> <title>Ocean Protocol Status</title>
<meta <meta
@ -55,7 +55,7 @@ export default function HomePage(): ReactElement {
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
<header> <header className={styles.header}>
<LogoAsset className={styles.logo} /> <LogoAsset className={styles.logo} />
<h1 className={styles.title}>Ocean Protocol Status</h1> <h1 className={styles.title}>Ocean Protocol Status</h1>
@ -68,7 +68,7 @@ export default function HomePage(): ReactElement {
</p> </p>
</header> </header>
<main> <main className={styles.content}>
{isLoading ? ( {isLoading ? (
<div className={styles.loading}>Loading...</div> <div className={styles.loading}>Loading...</div>
) : error ? ( ) : error ? (

View File

@ -1,4 +1,4 @@
.container { .app {
padding: var(--spacer); padding: var(--spacer);
margin: 0 auto; margin: 0 auto;
background: url('../../node_modules/@oceanprotocol/art/waves/waves.svg') background: url('../../node_modules/@oceanprotocol/art/waves/waves.svg')
@ -7,11 +7,18 @@
} }
@media screen and (min-width: 50rem) { @media screen and (min-width: 50rem) {
.container { .app {
padding: calc(var(--spacer) * 2); padding: calc(var(--spacer) * 2);
} }
} }
.header,
.content,
.footer {
max-width: 70rem;
margin: 0 auto;
}
.footer { .footer {
padding: var(--spacer) 0; padding: var(--spacer) 0;
} }

View File

@ -14,7 +14,7 @@ export async function getData(): Promise<{ [key: string]: Status }> {
) )
// make sure 'general' is always the first key // make sure 'general' is always the first key
output = Object.assign({ general: output['general'] }, output) output = Object.assign({ general: output['general'] }, output)
console.log('Got new data', JSON.stringify(output)) console.log('Got new data', output)
return output return output
} catch (error) { } catch (error) {
console.error(error.message) console.error(error.message)