forked from ProjectSegfault/website
move footer to the bottom and align member socials
This commit is contained in:
parent
928e025114
commit
05231b6967
@ -13,6 +13,6 @@
|
||||
%sveltekit.head%
|
||||
</head>
|
||||
<body>
|
||||
<div>%sveltekit.body%</div>
|
||||
%sveltekit.body%
|
||||
</body>
|
||||
</html>
|
||||
|
@ -33,6 +33,9 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 20px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: calc(100vw - 2rem);
|
||||
}
|
||||
|
||||
hr {
|
||||
|
@ -20,10 +20,16 @@ body {
|
||||
background-color: var(--primary);
|
||||
color: var(--text);
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1rem;
|
||||
flex-grow: 1;
|
||||
padding-bottom: 200px;
|
||||
}
|
||||
|
||||
a {
|
||||
|
@ -21,29 +21,20 @@ description: Do you want to contact us?
|
||||
<div id="Active" style="display:none">
|
||||
<h1>People</h1>
|
||||
|
||||
<div>
|
||||
<span>Midou:</span>
|
||||
<a class="matrixcolored" href="https://matrix.to/#/@midou:projectsegfau.lt">[Matrix]</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<span>MrLeRien:</span>
|
||||
<a class="discordcolored" href="https://discord.com/users/213634643327582208">Discord</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>Odyssey:</span>
|
||||
<a class="matrixcolored" href="https://matrix.to/#/@odyssey346:projectsegfau.lt">[Matrix]</a>
|
||||
<a class="discordcolored" href="https://discord.com/users/315843700490240002">Discord</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>Devnol:</span>
|
||||
<a class="matrixcolored" href="https://matrix.to/#/@devnol:projectsegfau.lt">[Matrix]</a>
|
||||
<a class="discordcolored" href="https://discordapp.com/users/429353559566319626">Discord</a>
|
||||
</div>
|
||||
|
||||
<div class="parent">
|
||||
<div class="div1">Midou:</div>
|
||||
<a class="div2 matrixcolored" href="https://matrix.to/#/@midou:projectsegfau.lt">[Matrix]</a>
|
||||
<div class="div3"></div>
|
||||
<div class="div4">MrLeRien:</div>
|
||||
<a class="div5 discordcolored" href="https://discord.com/users/213634643327582208">Discord</a>
|
||||
<div class="div6"></div>
|
||||
<div class="div7">Odyssey:</div>
|
||||
<a class="div8 matrixcolored" href="https://matrix.to/#/@odyssey346:projectsegfau.lt">[Matrix]</a>
|
||||
<a class="div9 discordcolored" href="https://discord.com/users/315843700490240002">Discord</a>
|
||||
<div class="div10">Devnol:</div>
|
||||
<a class="div11 matrixcolored" href="https://matrix.to/#/@devnol:projectsegfau.lt">[Matrix]</a>
|
||||
<a class="div12 discordcolored" href="https://discordapp.com/users/429353559566319626">Discord</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button
|
||||
@ -66,15 +57,30 @@ onclick='document.getElementById("Active").style.display ="block"; document.getE
|
||||
font-family: var(--font-primary);
|
||||
}
|
||||
|
||||
#Active {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.parent {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, max-content);
|
||||
grid-template-rows: repeat(4, 1fr);
|
||||
grid-column-gap: 16px;
|
||||
grid-row-gap: 16px;
|
||||
max-width: 50%;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#Active > div {
|
||||
margin-top: 36px;
|
||||
margin-bottom: 36px;
|
||||
}
|
||||
.div1 { grid-area: 1 / 1 / 2 / 2; }
|
||||
.div2 { grid-area: 1 / 2 / 2 / 3; }
|
||||
.div3 { grid-area: 1 / 3 / 2 / 4; }
|
||||
.div4 { grid-area: 2 / 1 / 3 / 2; }
|
||||
.div5 { grid-area: 2 / 2 / 3 / 3; }
|
||||
.div6 { grid-area: 2 / 3 / 3 / 4; }
|
||||
.div7 { grid-area: 3 / 1 / 4 / 2; }
|
||||
.div8 { grid-area: 3 / 2 / 4 / 3; }
|
||||
.div9 { grid-area: 3 / 3 / 4 / 4; }
|
||||
.div10 { grid-area: 4 / 1 / 5 / 2; }
|
||||
.div11 { grid-area: 4 / 2 / 5 / 3; }
|
||||
.div12 { grid-area: 4 / 3 / 5 / 4; }
|
||||
|
||||
|
||||
|
||||
#Active a {
|
||||
border: none;
|
||||
@ -84,7 +90,6 @@ onclick='document.getElementById("Active").style.display ="block"; document.getE
|
||||
font-family: var(--font-primary);
|
||||
color: var(--secondary);
|
||||
text-decoration: none;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.matrixcolored {
|
||||
@ -95,4 +100,5 @@ onclick='document.getElementById("Active").style.display ="block"; document.getE
|
||||
background-color: #5865F2;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user