💄 Use of border-box box sizing

This makes calculating the size of the UI components easier, especially those which have padding, margin or border.

src/ui/components/text_input.scss

@@ -3,17 +3,14 @@
 %base-text-input {
     $horizontal-padding: 1vw;
 
-    height: calc(100% - (2 * $border-normal-width));
-    width: calc(100% - (2 * $horizontal-padding));
+    height: 100%;
+    width: 100%;
 
     border: $border-normal;
     border-color: get-color(primary, 90);
     border-radius: $border-radius;
 
-    padding-left: $horizontal-padding;
-    padding-right: $horizontal-padding;
-    padding-top: 0px;
-    padding-bottom: 0px;
+    padding: 0px $horizontal-padding;
 }
 
 %base-input {