feat: move styles out of App.vue and modularize

This commit is contained in:
Marcus Mietz 2020-08-26 19:14:37 +02:00
parent e0f67441bd
commit d7e8f55b41
4 changed files with 133 additions and 0 deletions

49
src/scss/base.scss Normal file
View file

@ -0,0 +1,49 @@
@import url("https://fonts.googleapis.com/css?family=Exo:300,300i,900,900i|Fira+Sans+Extra+Condensed:300,700&display=swap");
@import "variables";
@import "mixins";
@import "flex";
* {
box-sizing: border-box;
}
:root {
font-family: "Fira Sans Extra Condensed", sans-serif;
font-size: 16px;
line-height: 1.5;
text-size-adjust: 100%;
}
.bubbles {
background-color: $bg-color-dark;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -1;
&::before,
&::after {
content: "";
position: absolute;
border-radius: 100%;
}
&::before {
background-color: rgba(lighten($bg-color-dark, 10%), 0.7);
height: 80vw;
width: 80vw;
bottom: -45vw;
right: -25vw;
}
&::after {
background-color: rgba(lighten($bg-color-dark, 10%), 0.7);
height: 80vw;
width: 80vw;
bottom: -25vw;
right: -50vw;
}
}