mirror of
https://github.com/Fluffy-Bean/Fluffys-website.git
synced 2024-12-29 10:46:06 +00:00
102 lines
1.4 KiB
SCSS
102 lines
1.4 KiB
SCSS
|
@import 'scss/variables';
|
||
|
@import 'scss/grid';
|
||
|
|
||
|
@import 'scss/normalize';
|
||
|
|
||
|
@import 'nav';
|
||
|
@import 'aside';
|
||
|
@import 'wrapper';
|
||
|
@import 'footer';
|
||
|
|
||
|
h1 {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
font-size: 2rem;
|
||
|
text-align: center;
|
||
|
font-weight: 600;
|
||
|
}
|
||
|
|
||
|
h2 {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
font-size: 1.5rem;
|
||
|
font-weight: 600;
|
||
|
}
|
||
|
|
||
|
h3 {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
font-size: 1rem;
|
||
|
font-weight: 600;
|
||
|
}
|
||
|
|
||
|
.title {
|
||
|
margin: 0;
|
||
|
padding: 2rem 0;
|
||
|
|
||
|
position: relative;
|
||
|
|
||
|
img {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
|
||
|
object-fit: cover;
|
||
|
|
||
|
filter: grayscale(100%);
|
||
|
|
||
|
transition: all 0.2s ease-in-out;
|
||
|
|
||
|
&:hover {
|
||
|
filter: grayscale(0%);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.btn {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
width: 100%;
|
||
|
height: auto;
|
||
|
|
||
|
background-color: transparent;
|
||
|
color: $white;
|
||
|
|
||
|
text-decoration: none;
|
||
|
|
||
|
display: flex;
|
||
|
justify-content: left;
|
||
|
align-items: center;
|
||
|
gap: 0.5rem;
|
||
|
|
||
|
border: none;
|
||
|
|
||
|
transition: all 0.2s ease-in-out;
|
||
|
cursor: pointer;
|
||
|
|
||
|
i {
|
||
|
opacity: 0;
|
||
|
transform: translateX(1rem);
|
||
|
transition: all 0.2s ease-in-out;
|
||
|
filter: blur(0.1rem);
|
||
|
}
|
||
|
|
||
|
&:hover {
|
||
|
i {
|
||
|
opacity: 1;
|
||
|
transform: translateX(0);
|
||
|
filter: blur(0);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
#funny {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
}
|