update

styles/floating-vue.scss

@@ -15,4 +15,4 @@
 
 .v-popper--theme-tooltip .v-popper__arrow-outer {
   border-color: $color-black;
-}
+}

styles/index.scss

@@ -2,9 +2,9 @@
 @use '@splidejs/vue-splide/css/core';
 
 @use 'mixins';
-@use "normalize";
-@use "utility";
-@use "floating-vue";
+@use 'normalize';
+@use 'utility';
+@use 'floating-vue';
 
 *,
 *::before,
@@ -12,19 +12,26 @@
   box-sizing: border-box;
 }
 
-html, body {
+html,
+body {
   scroll-behavior: smooth;
 }
 
 body {
   @include font(16px, 400, 20px);
 
-  font-family: "Onest", sans-serif;
+  font-family: 'Onest', sans-serif;
   color: $color-black;
   background-color: $color-white;
 }
 
-p, h1, h2, h3, h4, h5, h6 {
+p,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
   margin: 0;
 }
 
@@ -56,4 +63,4 @@ button {
   @include mobile {
     padding-inline: 16px;
   }
-}
+}

styles/mixins/adaptive.scss

@@ -8,4 +8,4 @@
   @media (min-width: 481px) {
     @content;
   }
-}
+}

styles/mixins/element-variant.scss

@@ -1,18 +1,15 @@
-@use "sass:meta";
-@use "sass:list";
-@use "sass:string";
+@use 'sass:meta';
+@use 'sass:list';
+@use 'sass:string';
 
-@mixin element-variant(
-  $namespace,
-  $variant: '',
-  $map: ()
-) {
+@mixin element-variant($namespace, $variant: '', $map: ()) {
   @if meta.type-of($map) == 'map' {
     $withDarkVariant: false;
     $variantPrefix: if(string.length($variant) > 0, '-' + $variant, '');
 
     @at-root {
-      :root, .light-theme {
+      :root,
+      .light-theme {
         @each $property, $value in $map {
           @if meta.type-of($value) == 'list' {
             @if $withDarkVariant == false and list.length($value) > 1 {

styles/mixins/index.scss

@@ -1,3 +1,3 @@
-@forward "element-variant";
-@forward "typography";
-@forward "adaptive";
+@forward 'element-variant';
+@forward 'typography';
+@forward 'adaptive';

styles/normalize.scss

@@ -9,8 +9,8 @@
  */
 
 html {
-    line-height: 1.15; /* 1 */
-    -webkit-text-size-adjust: 100%; /* 2 */
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
 }
 
 /* Sections
@@ -21,7 +21,7 @@ html {
  */
 
 body {
-    margin: 0;
+  margin: 0;
 }
 
 /**
@@ -29,7 +29,7 @@ body {
  */
 
 main {
-    display: block;
+  display: block;
 }
 
 /**
@@ -38,8 +38,8 @@ main {
  */
 
 h1 {
-    font-size: 2em;
-    margin: 0.67em 0;
+  font-size: 2em;
+  margin: 0.67em 0;
 }
 
 /* Grouping content
@@ -51,9 +51,9 @@ h1 {
  */
 
 hr {
-    box-sizing: content-box; /* 1 */
-    height: 0; /* 1 */
-    overflow: visible; /* 2 */
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
 }
 
 /**
@@ -62,8 +62,8 @@ hr {
  */
 
 pre {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
 }
 
 /* Text-level semantics
@@ -74,7 +74,7 @@ pre {
  */
 
 a {
-    background-color: transparent;
+  background-color: transparent;
 }
 
 /**
@@ -83,9 +83,9 @@ a {
  */
 
 abbr[title] {
-    border-bottom: none; /* 1 */
-    text-decoration: underline; /* 2 */
-    text-decoration: underline dotted; /* 2 */
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
 }
 
 /**
@@ -94,7 +94,7 @@ abbr[title] {
 
 b,
 strong {
-    font-weight: bold;
+  font-weight: bold;
 }
 
 /**
@@ -105,8 +105,8 @@ strong {
 code,
 kbd,
 samp {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
 }
 
 /**
@@ -114,7 +114,7 @@ samp {
  */
 
 small {
-    font-size: 80%;
+  font-size: 80%;
 }
 
 /**
@@ -124,18 +124,18 @@ small {
 
 sub,
 sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
 }
 
 sub {
-    bottom: -0.25em;
+  bottom: -0.25em;
 }
 
 sup {
-    top: -0.5em;
+  top: -0.5em;
 }
 
 /* Embedded content
@@ -145,17 +145,18 @@ sup {
  * Remove the border on images inside links in IE 10.
  */
 
-img, video {
-    border-style: none;
-    vertical-align: middle;
-    font-style: italic;
-    max-width: 100%;
-    max-height: 100%;
+img,
+video {
+  border-style: none;
+  vertical-align: middle;
+  font-style: italic;
+  max-width: 100%;
+  max-height: 100%;
 }
 
 svg {
-    color: inherit;
-    vertical-align: middle;
+  color: inherit;
+  vertical-align: middle;
 }
 
 /* Forms
@@ -171,10 +172,10 @@ input,
 optgroup,
 select,
 textarea {
-    font-family: inherit; /* 1 */
-    font-size: 100%; /* 1 */
-    line-height: 1.15; /* 1 */
-    margin: 0; /* 2 */
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
 }
 
 /**
@@ -183,8 +184,9 @@ textarea {
  */
 
 button,
-input { /* 1 */
-    overflow: visible;
+input {
+  /* 1 */
+  overflow: visible;
 }
 
 /**
@@ -193,8 +195,9 @@ input { /* 1 */
  */
 
 button,
-select { /* 1 */
-    text-transform: none;
+select {
+  /* 1 */
+  text-transform: none;
 }
 
 /**
@@ -202,10 +205,10 @@ select { /* 1 */
  */
 
 button,
-[type="button"],
-[type="reset"],
-[type="submit"] {
-    -webkit-appearance: button;
+[type='button'],
+[type='reset'],
+[type='submit'] {
+  -webkit-appearance: button;
 }
 
 /**
@@ -213,11 +216,11 @@ button,
  */
 
 button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
-    border-style: none;
-    padding: 0;
+[type='button']::-moz-focus-inner,
+[type='reset']::-moz-focus-inner,
+[type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
 }
 
 /**
@@ -225,10 +228,10 @@ button::-moz-focus-inner,
  */
 
 button:-moz-focusring,
-[type="button"]:-moz-focusring,
-[type="reset"]:-moz-focusring,
-[type="submit"]:-moz-focusring {
-    outline: 1px dotted ButtonText;
+[type='button']:-moz-focusring,
+[type='reset']:-moz-focusring,
+[type='submit']:-moz-focusring {
+  outline: 1px dotted ButtonText;
 }
 
 /**
@@ -236,7 +239,7 @@ button:-moz-focusring,
  */
 
 fieldset {
-    padding: 0.35em 0.75em 0.625em;
+  padding: 0.35em 0.75em 0.625em;
 }
 
 /**
@@ -247,12 +250,12 @@ fieldset {
  */
 
 legend {
-    box-sizing: border-box; /* 1 */
-    color: inherit; /* 2 */
-    display: table; /* 1 */
-    max-width: 100%; /* 1 */
-    padding: 0; /* 3 */
-    white-space: normal; /* 1 */
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
 }
 
 /**
@@ -260,7 +263,7 @@ legend {
  */
 
 progress {
-    vertical-align: baseline;
+  vertical-align: baseline;
 }
 
 /**
@@ -268,7 +271,7 @@ progress {
  */
 
 textarea {
-    overflow: auto;
+  overflow: auto;
 }
 
 /**
@@ -276,19 +279,19 @@ textarea {
  * 2. Remove the padding in IE 10.
  */
 
-[type="checkbox"],
-[type="radio"] {
-    box-sizing: border-box; /* 1 */
-    padding: 0; /* 2 */
+[type='checkbox'],
+[type='radio'] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
 }
 
 /**
  * Correct the cursor style of increment and decrement buttons in Chrome.
  */
 
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
-    height: auto;
+[type='number']::-webkit-inner-spin-button,
+[type='number']::-webkit-outer-spin-button {
+  height: auto;
 }
 
 /**
@@ -296,17 +299,17 @@ textarea {
  * 2. Correct the outline style in Safari.
  */
 
-[type="search"] {
-    -webkit-appearance: textfield; /* 1 */
-    outline-offset: -2px; /* 2 */
+[type='search'] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
 }
 
 /**
  * Remove the inner padding in Chrome and Safari on macOS.
  */
 
-[type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none;
+[type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
 }
 
 /**
@@ -315,8 +318,8 @@ textarea {
  */
 
 ::-webkit-file-upload-button {
-    -webkit-appearance: button; /* 1 */
-    font: inherit; /* 2 */
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
 }
 
 /* Interactive
@@ -327,7 +330,7 @@ textarea {
  */
 
 details {
-    display: block;
+  display: block;
 }
 
 /*
@@ -335,7 +338,7 @@ details {
  */
 
 summary {
-    display: list-item;
+  display: list-item;
 }
 
 /* Misc
@@ -346,7 +349,7 @@ summary {
  */
 
 template {
-    display: none;
+  display: none;
 }
 
 /**
@@ -354,10 +357,10 @@ template {
  */
 
 [hidden] {
-    display: none;
+  display: none;
 }
 
 ul {
-    margin: 0;
-    padding-inline-start: 20px;
+  margin: 0;
+  padding-inline-start: 20px;
 }

styles/utility.scss

@@ -10,4 +10,4 @@
   @include desktop {
     display: none !important;
   }
-}
+}

styles/variables/color.scss

@@ -1,14 +1,15 @@
-$color-gray-200: #F9FAFF;
+$color-gray-200: #f9faff;
 $color-gray-300: #f6f7fb;
 $color-gray-400: #e7eaf3;
 $color-gray-500: #cfd5f0;
 $color-gray-600: #8890b8;
-$color-gray-700: #505A8A;
+$color-gray-700: #505a8a;
 
 $color-green-400: #008574;
 $color-green-500: #056e62;
 
-$color-white: #FFFFFF;
+$color-white: #ffffff;
 $color-black: #021d54;
 
-$color-lime: #E0FF5F;
+$color-lemon-400: #e8ff8a;
+$color-lemon-500: #e0ff5f;

styles/variables/index.scss

@@ -1,2 +1,2 @@
-@forward "color";
-@forward "transitions";
+@forward 'color';
+@forward 'transitions';

styles/variables/transitions.scss

@@ -1,2 +1,2 @@
-$transition-duration: .2s;
-$transition-easing: ease-out;
+$transition-duration: 0.2s;
+$transition-easing: ease-out;