css improvements

This commit is contained in:
2024-02-10 19:33:05 +01:00
parent 1ef0cdec90
commit 00dc8b5d4f
6 changed files with 18 additions and 10 deletions

View File

@@ -2,10 +2,10 @@ footer {
display: flexbox;
align-items: center;
text-align: center;
position: absolute;
bottom: 0;
width: 100%;
margin-bottom: 2vh;
a {
color: white;
&[target="_blank"]::after {

View File

@@ -8,8 +8,7 @@ main{
background-image: url("/diagonal_lines_home.png");
background-size: cover;
background-repeat: repeat;
margin-inline: -.10vw;
height: 75vh;
min-height: 75vh;
padding-inline: 10vw;
.home-main-box {
@@ -42,6 +41,6 @@ main{
justify-self: flex-end;
margin: 0;
margin-top: 2vh;
max-width: 450px;
max-width: 500px;
}
}

View File

@@ -10,6 +10,7 @@ body {
font-size: 16px;
position: relative;
min-height: 95vh;
}
h1 {
@@ -41,7 +42,7 @@ main {
background-color: $second-content-clr;
border-radius: 25px;
border: 1px solid lighten($second-content-clr, 16%);
width: 42vw;
width: 30vw;
padding: 2vh;
margin-inline: 10vw;
margin-bottom: 11vh;
@@ -64,14 +65,16 @@ a {
height: 20px;
vertical-align: -0.125em;
content: " ";
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 3v2h3.59l-9.83 9.83l1.41 1.41L19 6.41V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7h-2z'/%3E%3C/svg%3E")
$external_svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 3v2h3.59l-9.83 9.83l1.41 1.41L19 6.41V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7h-2z'/%3E%3C/svg%3E");
-webkit-mask: $external_svg
no-repeat center;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 3v2h3.59l-9.83 9.83l1.41 1.41L19 6.41V10h2V3m-2 16H5V5h7V3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7h-2z'/%3E%3C/svg%3E")
mask: $external_svg
no-repeat center;
background-color: $link; /* This will color the SVG */
}
&.social::after {
content: none;
display: unset;
}
}

View File

@@ -24,10 +24,15 @@ header {
align-items: center;
a {
color: white;
color: lighten($accent,30);
text-decoration: none;
text-align: center;
margin-inline: .9vw;
transition: color 0.5s;
font-family: "Satoshi-Bold";
&:hover{
color: $accent;
}
}
.active {
@@ -44,6 +49,6 @@ header {
.social {
width: 22px;
margin-inline: .5vw;
margin-inline: .2vw;
}
}