fix: section spacing

This commit is contained in:
Ayo 2022-09-26 10:49:23 +02:00
parent a46a11298c
commit 8300bb6327
2 changed files with 100 additions and 106 deletions

View file

@ -4,8 +4,6 @@ export interface Props {
} }
const { title } = Astro.props; const { title } = Astro.props;
import Footer from '../components/Footer.astro';
--- ---
<!DOCTYPE html> <!DOCTYPE html>
@ -14,15 +12,14 @@ import Footer from '../components/Footer.astro';
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} /> <meta name="generator" content={Astro.generator} />
<meta name="theme-color" content="#3054bf"> <meta name="theme-color" content="#3054bf" />
<link rel="shortcut icon" type="image/png" href="/favicon.ico"> <link rel="shortcut icon" type="image/png" href="/favicon.ico" />
<title>{title}</title> <title>{title}</title>
</head> </head>
<body> <body>
<slot /> <slot />
</body>
</html> <style>
<style>
:root { :root {
--content-width: 700px; --content-width: 700px;
--font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem); --font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
@ -63,15 +60,13 @@ import Footer from '../components/Footer.astro';
background-position-y: 80%; background-position-y: 80%;
} }
} }
</style>
<style is:global>
</style>
<style is:global>
main { main {
margin: auto; margin: auto;
padding: 1em;
max-width: var(--content-width); max-width: var(--content-width);
padding: 1em;
} }
h1 { h1 {
@ -83,8 +78,8 @@ import Footer from '../components/Footer.astro';
} }
code { code {
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, font-family: Menlo, Monaco, Lucida Console, Liberation Mono,
Bitstream Vera Sans Mono, Courier New, monospace; DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
} }
a { a {
@ -104,6 +99,6 @@ import Footer from '../components/Footer.astro';
background-position-y: 100%; background-position-y: 100%;
border-radius: 0.4rem; border-radius: 0.4rem;
} }
</style>
</body>
</style> </html>

View file

@ -5,7 +5,6 @@ import Footer from "../components/Footer.astro";
--- ---
<Layout title="Ayo Ayco | Software Engineer + Web Developer"> <Layout title="Ayo Ayco | Software Engineer + Web Developer">
<main>
<section class="highlighted-section"> <section class="highlighted-section">
<div class="highlighted-section__content"> <div class="highlighted-section__content">
<h1 title="Ayo Ayco | Software Engineer + Web Developer"> <h1 title="Ayo Ayco | Software Engineer + Web Developer">
@ -22,6 +21,7 @@ import Footer from "../components/Footer.astro";
</a> </a>
</div> </div>
</section> </section>
<main>
<section class="cards-section"> <section class="cards-section">
<ul role="list" class="cards-section__grid"> <ul role="list" class="cards-section__grid">
<Card <Card
@ -124,7 +124,6 @@ import Footer from "../components/Footer.astro";
.cards-section { .cards-section {
margin: auto; margin: auto;
padding: 1em;
max-width: var(--content-width); max-width: var(--content-width);
} }