aronmal/liljudd-website
1
0
Fork 0
mirror of https://git.moonleay.net/Websites/liljudd-website.git synced 2025-07-27 11:42:04 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix: moved scss and css to seperate file, fixed overflow

Browse source 
chore: added folders to gitignore

Signed-off-by: moonleay <contact@moonleay.net>
This commit is contained in:
moonleay 2023-11-09 18:06:03 +01:00
parent 906ca7806e
commit ab864e0247
10 changed files with 250 additions and 244 deletions
Download patch file Download diff file Expand all files Collapse all files

100
src/components/Footer.astro
View file

@ -1,5 +1,5 @@
---
import '../styles/components/Footer.scss'
---
<footer>
@ -70,101 +70,3 @@
</p>
</div>
</footer>
<style lang="scss">
footer {
align-items: center;
margin: 100px 1px 0 0;
background-color: rgba(0, 0, 0, 0.4);
backdrop-filter: blur(5px);
bottom: 0;
width: 100%;
padding: 5px;
.footerIcon {
display: block;
text-align: center;
.footerImage {
max-width: initial;
max-height: initial;
width: 48px;
margin: 0.5rem auto;
}
.footerImageNote {
font-size: 0.75rem;
}
}
.footerTable {
padding: 20px 0;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
h3 {
margin-bottom: 8px;
}
}
.footerLinks {
display: flex;
flex-direction: column;
align-items: baseline;
a {
position: relative;
color: #ffffff;
text-decoration: none;
&:hover {
color: #ffffff;
}
&::before {
content: "";
position: absolute;
display: block;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
transform: scaleX(0);
transform-origin: left;
background-color: #ffffff;
transition: transform 0.3s ease;
}
&:hover::before {
transform: scaleX(1);
}
}
}
.footerNotice {
margin: 0 auto;
text-align: center;
font-size: 0.75rem;
}
@media (min-width: 768px) {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 0px;
margin: 0 auto;
.footerIcon {
grid-column: span 1;
justify-self: center;
}
.footerTable {
grid-column: span 3;
}
.footerNotice {
grid-column: span 4;
}
}
}
</style>