Started redesign

This commit is contained in:
Firq 2023-02-11 15:05:53 +01:00
parent 217c568ef1
commit c98c43100e
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
6 changed files with 169 additions and 27 deletions

View file

@ -0,0 +1,43 @@
---
export interface Props {
title: string;
}
const { title } = Astro.props;
---
<section>
<h1>{title}</h1>
<div>
<slot />
</div>
</section>
<style>
h1 {
color: white;
margin: 0.5rem 0px;
padding: 0.25rem 0.75rem;
width: max-content;
background-color: #1e1e1e;
}
div {
row-gap: 1em;
column-gap: 1em;
justify-content: center;
align-self: center;
display: flex;
flex-flow: row wrap;
padding: 1em;
}
@media (min-width: 512px) {
div {
justify-content: left;
}
}
div {
color: white;
font-size: 1em;
}
</style>

View file

@ -0,0 +1,31 @@
---
---
<div class="wrap">
<div>
<span>FIRQ FGO SITE</span>
<slot />
</div>
</div>
<style>
.wrap {
display: block;
}
.wrap > div {
display: flex;
padding: 15% 20%;
align-items: center;
justify-content: center;
flex-direction: column;
}
span {
display: inline-block;
padding: 0.1em;
font-weight: bold;
color: white;
font-size: 5em;
background-color: #1e1e1e;
}
</style>