< Malline:Etusivu | Header
(Ak: Uusi sivu: .fp-header { display: flex; justify-content: center; align-items: center; }) |
Ei muokkausyhteenvetoa |
||
(19 välissä olevaa versiota samalta käyttäjältä ei näytetä) | |||
Rivi 1: | Rivi 1: | ||
.fp-header { | .fp-header { | ||
display: flex; | display: flex; | ||
flex-direction: column; | |||
justify-content: center; | justify-content: center; | ||
align-items: center; | align-items: center; | ||
margin-bottom: 2rem; | |||
} | |||
.fp-header img { | |||
max-width: 90vw; | |||
height: auto; | |||
} | |||
.fp-header-text { | |||
text-align: center; | |||
margin-bottom: 1rem; | |||
} | |||
.fp-header-text h1 { | |||
margin-top: 1rem; | |||
} | |||
.fp-header-socials { | |||
display: flex; | |||
gap: 0.25rem; | |||
flex-direction: column; | |||
justify-content: center; | |||
align-items: center; | |||
} | |||
.fp-header-social { | |||
border-radius: 8px; | |||
padding: 0.5rem 1rem; | |||
} | |||
.fp-header-social p { | |||
margin: 0; | |||
} | |||
.social-discord { | |||
background-color: #5865f2; | |||
height: 100%; | |||
display: block; | |||
} | |||
.social-minecraft { | |||
border: 1px solid rgba(0,0,0,0.05); | |||
} | |||
.loading-blur { | |||
filter: blur(1.5px); | |||
animation: blur 1.5s infinite alternate; | |||
} | |||
@keyframes blur { | |||
0% { filter: blur(1.5px); } | |||
100% { filter: blur(5px); } | |||
} | } |
Nykyinen versio 2. marraskuuta 2023 kello 20.13
.fp-header { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 2rem; } .fp-header img { max-width: 90vw; height: auto; } .fp-header-text { text-align: center; margin-bottom: 1rem; } .fp-header-text h1 { margin-top: 1rem; } .fp-header-socials { display: flex; gap: 0.25rem; flex-direction: column; justify-content: center; align-items: center; } .fp-header-social { border-radius: 8px; padding: 0.5rem 1rem; } .fp-header-social p { margin: 0; } .social-discord { background-color: #5865f2; height: 100%; display: block; } .social-minecraft { border: 1px solid rgba(0,0,0,0.05); } .loading-blur { filter: blur(1.5px); animation: blur 1.5s infinite alternate; } @keyframes blur { 0% { filter: blur(1.5px); } 100% { filter: blur(5px); } }