diff options
| -rw-r--r-- | assets/public/css/app.css | 36 | ||||
| -rw-r--r-- | assets/src/components/Header.svelte | 5 | ||||
| -rw-r--r-- | assets/src/components/share/ShareStatus.svelte | 4 |
3 files changed, 30 insertions, 15 deletions
diff --git a/assets/public/css/app.css b/assets/public/css/app.css index 85d95ac..e23b16e 100644 --- a/assets/public/css/app.css +++ b/assets/public/css/app.css @@ -15,18 +15,36 @@ body { text-rendering: optimizeLegibility; } +h1 { + font-size: 35px; + font-weight: 400; +} + +p { + color: #626262; + font-size: 16px; + margin-bottom: 30px; +} + main { display: flex; - justify-content: space-around; align-items: center; height: 100%; - width: 66%; margin: auto; + justify-content: space-between; + width: 75%; } -h1 { - font-size: 35px; - font-weight: 400; +@media (max-width: 850px) { + main { + flex-direction: column; + justify-content: flex-start; + width: 100%; + } + + .left-segment { + margin-top: 10rem; + } } .left-segment { @@ -35,13 +53,5 @@ h1 { .right-segment { width: 315px; - height: 100%; - padding-top: 225px; box-sizing: border-box; } - -p { - color: #626262; - font-size: 16px; - margin-bottom: 30px; -} diff --git a/assets/src/components/Header.svelte b/assets/src/components/Header.svelte index c956ca9..61aa02a 100644 --- a/assets/src/components/Header.svelte +++ b/assets/src/components/Header.svelte @@ -10,9 +10,10 @@ <style> header { - padding: 5rem; - box-sizing: border-box; position: absolute; + display: flex; + padding: 4rem 4rem 3rem; + box-sizing: border-box; width: 100%; } </style> diff --git a/assets/src/components/share/ShareStatus.svelte b/assets/src/components/share/ShareStatus.svelte index 2a1cce3..da8531e 100644 --- a/assets/src/components/share/ShareStatus.svelte +++ b/assets/src/components/share/ShareStatus.svelte @@ -31,6 +31,10 @@ {/if} <style> + h1 { + margin-top: 0; + } + span { color: white; } |