improved scss notation

This commit is contained in:
2024-02-01 13:32:21 +01:00
parent b8b26b775c
commit e4eb93c180
3 changed files with 59 additions and 61 deletions

View File

@@ -1,32 +1,32 @@
main { main {
background-image: url("/diagonal_lines_home.png"); background-image: url("/diagonal_lines_home.png");
padding-inline: 10vw; padding-inline: 10vw;
}
.home-main-box { .home-main-box {
padding-block: 7vh; padding-block: 7vh;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
}
.home-title { .home-title-box {
justify-self: flex-start;
margin-right: 5vw;
.home-title {
margin: 0; margin: 0;
color: #FFF; color: #FFF;
font-family: "Tanker-Regular"; font-family: "Tanker-Regular";
} }
.home-title-box { .using-engines {
justify-self: flex-start; width: 21vw;
margin-right: 5vw; }
} }
}
.content { .content {
justify-self: flex-end; justify-self: flex-end;
margin: 0; margin: 0;
max-width: 450px; max-width: 450px;
} }
.using-engines {
width: 21vw;
} }

View File

@@ -29,10 +29,6 @@ b {
color: $accent; color: $accent;
} }
.content { a {
a {
color: $link; color: $link;
text-decoration: underline;
margin: 0;
}
} }

View File

@@ -1,18 +1,3 @@
nav {
justify-self: flex-start;
display: inline-flex;
}
.navbar-entry {
display: flex;
flex-direction: column;
align-items: center;
}
.highlighter {
margin-top: -10px;
}
header { header {
padding-top: 2.5vh; padding-top: 2.5vh;
padding-bottom: 2.5vh; padding-bottom: 2.5vh;
@@ -20,25 +5,42 @@ header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
}
.logo { .logo {
margin-right: 2.5vw; margin-right: 2.5vw;
width: 40px; width: 40px;
} }
a { nav {
justify-self: flex-start;
display: inline-flex;
.navbar-entry {
display: flex;
flex-direction: column;
align-items: center;
a {
color: white; color: white;
text-decoration: none; text-decoration: none;
text-align: center; text-align: center;
margin-inline: 0.9vw; margin-inline: .9vw;
} }
.active { .active {
font-family: "Satoshi-Bold"; font-family: "Satoshi-Bold";
color: #7eca9c; color: #7eca9c;
} }
.social { .highlighter {
margin-top: -10px;
}
}
}
.social {
width: 22px; width: 22px;
margin-inline: .5vw;
}
} }