diff --git a/frontend/@dasig/styles/HTML.sass b/frontend/@dasig/styles/HTML.sass
index 92e9d1c..e330dc7 100644
--- a/frontend/@dasig/styles/HTML.sass
+++ b/frontend/@dasig/styles/HTML.sass
@@ -1,25 +1,16 @@
-@use '/src/styles/variables.sass' as vars
@use '/src/styles/fonts.sass' as fonts
-.body
- color: vars.$textColor
-
.inter
- @extend .body
font-family: fonts.$Inter
.roboto
- @extend .body
font-family: fonts.$Roboto
.montserrat
- @extend .body
font-family: fonts.$Montserrat
.open-sans
- @extend .body
font-family: fonts.$OpenSans
.public-sans
- @extend .body
font-family: fonts.$PublicSans
diff --git a/frontend/Makefile b/frontend/Makefile
index 836dc50..46f831e 100644
--- a/frontend/Makefile
+++ b/frontend/Makefile
@@ -1,4 +1,4 @@
-install:
+all:
deno install && deno install --allow-scripts=npm:sharp,npm:@parcel/watcher
dev:
diff --git a/frontend/configs/design.site.sass b/frontend/configs/design.site.sass
index d14273e..47a2fdd 100644
--- a/frontend/configs/design.site.sass
+++ b/frontend/configs/design.site.sass
@@ -1,5 +1,5 @@
-$lightBackground: #d4e0f0
-$darkBackground: #11141e
+$lightBackground: #e2e7f2
+$darkBackground: #0a152a
$mobile: 575.98px
$tablet: 768px
diff --git a/frontend/src/routes/index.sass b/frontend/src/routes/index.sass
index e193e74..cdf3faf 100644
--- a/frontend/src/routes/index.sass
+++ b/frontend/src/routes/index.sass
@@ -1,5 +1,3 @@
-@use '../styles/variables' as vars
-
h4
font-size: 1.1rem
font-weight: 300
diff --git a/frontend/src/styles/app.sass b/frontend/src/styles/app.sass
index 0a3f7c1..91595a7 100644
--- a/frontend/src/styles/app.sass
+++ b/frontend/src/styles/app.sass
@@ -1,5 +1,4 @@
@use './global'
-@use './variables'
@use '../../configs/design.site' as design
@use 'sass:color'
@@ -8,8 +7,8 @@
background-color: light-dark(design.$lightBackground, design.$darkBackground)
transition: background-color 0.6s ease-out
-.text
- color: light-dark(color.adjust(design.$lightBackground, $blackness: 90%), color.adjust(design.$darkBackground, $lightness: 90%))
+body
+ color: light-dark(color.adjust(design.$lightBackground, $blackness: 95%), color.adjust(design.$darkBackground, $lightness: 95%))
transition: background-color 0.6s ease-out
a
@@ -21,7 +20,7 @@ main
margin: 0 auto
h1
- color: #335d92
+ @extend body
text-transform: uppercase
font-size: 4rem
font-weight: 100
@@ -29,14 +28,13 @@ h1
margin: 4rem auto
max-width: 14rem
+ @media (min-width: design.$mobile)
+ max-width: none
+
p
max-width: 14rem
margin: 2rem auto
line-height: 1.35
-@media (min-width: 480px)
-h1
- max-width: none
-
-p
- max-width: none
+ @media (min-width: design.$mobile)
+ max-width: none
diff --git a/frontend/src/styles/variables.sass b/frontend/src/styles/variables.sass
deleted file mode 100644
index d3cd492..0000000
--- a/frontend/src/styles/variables.sass
+++ /dev/null
@@ -1,17 +0,0 @@
-@use 'sass:color'
-@use '../../configs/design.site' as design
-
-$background: #09111f
-$textColor: #f0f8ff
-
-$fontSize: 1rem
-
-$borderMargin: 2rem
-
-$primaryColor: #0075BB
-$secondaryColor: #57687F
-$accentColor: #00887C
-$infoColor: #0082A4
-$successColor: #009435
-$warningColor: #E5B400
-$errorColor: #E8595C