stylin

frontend/styles/form/input.less

@@ -0,0 +1,24 @@
+.sui {
+    
+    input {
+        padding: .5em;
+    }
+    
+    input[type="text"], input[type="password"] {
+        height: @input-text-height;
+        background: transparent;
+        border: none;
+        color: @color-white;
+        &:focus, &:hover {
+            outline: none;
+            border-bottom: solid 1px @color-main;
+            box-shadow: 3px @color-main;
+        }
+    }
+    input[type="checkbox"] {
+        transform: scale(@input-checkbox-scale);
+    }
+    input[type="range"] {
+        
+    }
+}

frontend/styles/form/layout.less

@@ -30,17 +30,17 @@ form {
   .form-row input[type="range"] {
 
   }
- @media screen and (min-width: 768px) {
+  @media screen and (min-width: 768px) {
    	.form-row > input, .form-row > span {
     	flex: 3;  
    }
   }
- @media screen and (min-width: 992px) {
+  @media screen and (min-width: 992px) {
    	.form-row > input, .form-row > span {
     	flex: 4;  
    }
   }
- @media screen and (min-width: 1200px) {
+  @media screen and (min-width: 1200px) {
    	.form-row > input, .form-row > span {
     	flex: 5;  
    }

frontend/styles/form/slider.less

@@ -2,6 +2,7 @@ input[type=range] {
   -webkit-appearance: none;
   width: 100%;
   margin: 8.4px 0;
+  padding: 0 !important;
 }
 input[type=range]:focus {
   outline: none;

frontend/styles/form/switch.less

@@ -3,7 +3,9 @@
     position: relative;
     display: inline;
     
-    input {display:none;}
+    input {
+        display:none;
+    }
   
     /* The slider */
     .slider {