Most features done

This commit is contained in:
Schmelczer András 2019-12-23 11:31:53 +01:00
parent cdaa423b8a
commit c8679b77bf
43 changed files with 803 additions and 648 deletions

View file

@ -1,4 +1,5 @@
@import "style/vars";
@import "style/mixins";
* {
margin: 0;
@ -28,14 +29,22 @@ html {
}
}
html {
background-color: $background-end;
}
body {
width: $body-width;
margin: auto;
font: $text-font;
@include main-font();
& > * {
margin-top: $normal-margin;
}
&::-webkit-scrollbar-track,
&::-webkit-scrollbar {
background-color: $scrollbar-color;
background-color: transparent;
width: 12px;
}
&::-webkit-scrollbar-thumb {
@ -48,27 +57,53 @@ img,
video {
width: 100%;
height: auto;
object-fit: contain;
border-radius: $border-radius;
}
a {
display: inline-block;
position: relative;
@include insignificant-font();
text-decoration: none;
position: relative;
cursor: pointer;
border-bottom: solid $line-width $light-accent-color;
color: $accent-color;
display: inline-block;
overflow: hidden;
$border-shift: 10px;
transition: transform $slow-transition-time;
&:before {
content: "";
display: block;
position: absolute;
width: 100%;
height: $line-width;
bottom: 0;
z-index: 1;
background: linear-gradient(
90deg,
$card-color 0,
transparentize($card-color, 1) 4px,
transparentize($card-color, 1) calc(100% - 4px),
$card-color 100%
);
}
&:after {
content: "";
width: 0;
height: $line-width;
position: absolute;
left: 0;
bottom: -$line-width;
background-color: $accent-color;
transition: width $transition-time;
display: block;
width: calc(100% + #{$border-shift});
height: 100%;
z-index: 0;
border-bottom: $line-width dotted $accent-color;
transition: transform $slow-transition-time;
}
&:hover {
width: 100%;
&:hover {
&:after {
transform: translateX(-$border-shift);
}
}
}