firq-dev-website/src/layouts/taSection.astro
2023-03-06 13:30:35 +01:00

48 lines
969 B
Text

---
export interface Props {
title: string;
abovetext?: string;
}
const { abovetext, title } = Astro.props;
let h2text;
if (abovetext === undefined) {
h2text = "The full list of my completed TAs can be found on my Youtube channel."
} else {
h2text = ""
}
---
<div>
<h1>{title}</h1>
<h2>{h2text}</h2>
<div class="container ta-container">
<slot />
</div>
</div>
<style>
div > div {
row-gap: 1.5em;
column-gap: 1.5em;
justify-content: center;
align-self: center;
display: flex;
flex-flow: row wrap;
padding: 1em;
}
h1 {
color: white;
margin: 0.5rem 0px 0.5rem 0.5em;
padding: 0.25rem 0.75rem;
width: max-content;
background-color: var(--c-darkgray);
}
h2 {
color: white;
font-size: 16px;
font-weight: 600;
margin: 5;
line-height: 20px;
text-align: center;
}
</style>