fix: Add variables

assets/scss/core/_base.scss

@@ -10,10 +10,10 @@ label {
   margin-bottom: 5px;
   padding: 0;
   color: $dp-color-grey;
-  font-weight: bold;
-  font-size: 13px;
+  font-weight: $dp-font-weight-bold;
+  font-size: $dp-font-size-small;
 }
-/* span whith class .dropdown-arrow to draw arrow dropdown */
+/* span with class .dropdown-arrow to draw arrow dropdown */
 .dropdown-arrow {
   border-style: solid;
   height: 0;
@@ -33,8 +33,8 @@ select {
   width: 100%;
   background-color: $dp-color-white;
   border: 1px solid $dp-color-sylver;
-  border-radius: 3px;
-  font-size: 13px;
+  border-radius: $dp-border-radius;
+  font-size: $dp-font-size-small;
   padding: 0 40px 0 10px;
   text-align: left;
   height: 40px;
@@ -57,7 +57,7 @@ textarea {
   resize: none;
   padding: 10px;
   color: $dp-color-grey;
-  border-radius: 3px;
+  border-radius: $dp-border-radius;
   font-size: $dp-font-size-form;
   border: 1px solid $dp-color-sylver;
 }

assets/scss/core/_typography.scss

@@ -27,6 +27,9 @@ $dp-headers-h5-font-size: 18px;
 $dp-headers-h6-font-size: 13px;
 $dp-font-size-small: 13px;
 $dp-font-size-form: 14px;
+$dp-font-button-big: 15px;
+$dp-font-button-medium: 13px;
+$dp-font-button-small: 11px;
 
 body {
   color: $dp-color-grey;

assets/scss/core/_variables.scss

@@ -1,10 +1,16 @@
+/* variables*/
+$dp-border-radius: 3px;
+$dp-header-height: 4em;
+$dp-text-aling: center;
+
 .micro {
   font-size: 11px;
   line-height: 13px;
   color: $dp-color-grey;
   text-transform: uppercase;
 }
 /* TEXT COLORS - grey */
+
 .c-dark-grey {
   color: $dp-color-darkgrey;
   /* text */
@@ -20,6 +26,7 @@
   /* placeholders, hovers*/
 }
 /* VERTICAL SPACES */
+
 .space-0 {
   margin-bottom: 0;
 }
@@ -43,13 +50,11 @@
   margin-bottom: 64px;
 }
 /* SPACES */
-
 .margin--0 {
   margin: 0;
   /* when p is a title of a paragraph */
 }
 /* BACKGROUNDS COLORS */
-
 .grey-bg {
   background-color: $dp-color-grey;
   /* disabled inputs */
@@ -69,20 +74,17 @@
   /* backgrounds grid, cebra */
 }
 /* TEXT COLORS */
-
 .dark-grey-txt {
   color: $dp-color-darkgrey;
   /* variant of <p> */
   font-weight: $dp-font-weight-bold;
 }
 /* BORDER COLORS */
-
 .sylver {
   border-color: $dp-color-sylver;
   /* strokes */
 }
 /* DISABLED ICON STATES */
-
 .disabled-icon {
   opacity: 0.6;
   /* strokes */

assets/scss/templates/_header.scss

@@ -1,7 +1,4 @@
 /* header */
-$dp-header-height: 4em;
-$dp-border-radius: 5px;
-$dp-text-aling: center; /* header */
 
 .header-main {
   height: $dp-header-height;
@@ -120,7 +117,6 @@ $dp-text-aling: center; /* header */
   width: 100%;
 }
 /* nav right */
-
 .nav-right-main {
   display: flex;
 }