adjustment colors background and position button darkmode

Author: lucasferreiralimax

src/App.vue

@@ -96,11 +96,12 @@ body.darkmode {
 }
 
 .darkmode-button {
-  margin: 1rem;
+  margin: 2rem 1rem;
   position: fixed;
   top: 0;
   right: 0;
   padding: .6rem !important;
+  background: var(--primary) !important;
 }
 
 h2 {

src/assets/base.css

@@ -34,6 +34,10 @@
   --color-text: var(--vt-c-text-light-1);
 
   --section-gap: 160px;
+
+  --primary: #289f6a;
+  --secondary: #647eff;
+  --main-color: #2c3e50;
 }
 
 *,
@@ -45,20 +49,35 @@
   font-weight: normal;
 }
 
+html {
+  background: var(--primary);
+}
+
 body {
   min-height: 100vh;
   color: var(--color-text);
   background: var(--color-background);
   transition: color 0.5s, background-color 0.5s;
   line-height: 1.6;
-  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
-    Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+    Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue",
+    sans-serif;
   font-size: 15px;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
+body:before,
+body:after {
+  content: "";
+  display: flex;
+  height: 20px;
+  background: var(--primary);
+  background: linear-gradient(90deg, var(--primary) 50%, var(--secondary) 100%);
+  box-shadow: 0 0 0 1px rgba(255,255,255,.6), 0 0 20px rgba(0, 0, 0, 0.4);
+}
+
 body.modal-active {
   overflow: hidden;
 }