0xMRTT/webcompile
1
0
Fork 0
forked from ProjectSegfault/website
Code Pull Requests Activity

move footer to the bottom and align member socials

Browse Source
This commit is contained in:
Akis 2022-06-18 20:53:25 +03:00
parent 928e025114
commit 05231b6967
4 changed files with 47 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.html
View File

@ -13,6 +13,6 @@
%sveltekit.head%
</head>
<body>
<div>%sveltekit.body%</div>
%sveltekit.body%
</body>
</html>

3
src/lib/Footer.svelte
View File

@ -33,6 +33,9 @@
display: flex;
flex-direction: column;
font-size: 20px;
position: absolute;
bottom: 0;
width: calc(100vw - 2rem);
}
hr {

6
src/lib/app.css
View File

@ -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 {

66
src/routes/contact.md
View File

@ -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 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>
<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>
<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>