Fluffy/WebsiteArchive
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/Fluffys-website.git synced 2025-06-04 01:33:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

New page

Browse source
This commit is contained in:
Michał Gdula 2022-11-12 20:46:40 +00:00
parent 5dab307513
commit 364a2558ff
61 changed files with 1309 additions and 608 deletions
Download patch file Download diff file Expand all files Collapse all files

113
css/_hero.scss Normal file
View file

@ -0,0 +1,113 @@
.heroSpacing {
margin: 0;
padding: 0;
width: 100%;
height: 20rem;
display: block;
background-color: $black-darker;
}
.hero {
margin: 0;
padding: 1rem;
width: 100%;
height: 20rem;
display: flex;
flex-direction: column;
gap: 1rem;
position: absolute;
top: 3rem;
box-sizing: border-box;
background-color: $black;
overflow: hidden;
pointer-events: none;
user-select: none;
h1 {
margin: 0;
padding: 0;
font-family: $font-header;
font-size: 2.5rem;
font-weight: 800;
font-stretch: ultra-expanded;
color: $white;
transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
z-index: +2;
}
p {
margin: 0;
padding: 0;
font-family: $font-body;
font-size: 1rem;
font-weight: 600;
font-stretch: semi-expanded;
color: $white;
z-index: +2;
}
img {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
opacity: 1;
filter: blur(2px) brightness(0.7);
object-fit: cover;
object-position: center;
position: absolute;
top: 0;
left: 0;
z-index: +1;
}
}
.hero_scrolled {
padding: 0.5rem 1rem;
height: 3rem;
top: 0;
justify-content: center;
background-color: $black-darker;
border-radius: 0.5rem 0.5rem 0 0;
pointer-events: all;
h1 {
font-size: 1.5rem;
}
p {
display: none;
}
img {
opacity: 0;
}
}