feat(style): add common input style

src/main.js

@@ -23,6 +23,7 @@ import getCurrentLanguage from './utils/currentLanguage';
 import router from './router'
 import './styles/common.css'
 import './styles/variables/colors.css'
+import './styles/variables/dimensions.css';
 
 await loadLanguage(getCurrentLanguage());
 

src/styles/common.css

@@ -44,6 +44,24 @@ input {
     color: var(--dark);
 }
 
+.input {
+    padding: var(--input-padding);
+    display: block;
+    border-radius: calc(var(--input-padding) + 0.5 * var(--input-height) + 1px);
+    height: var(--input-height);
+    border: 1px solid var(--border);
+    background: none;
+    transition: border-color 0.2s ease;
+    color: inherit;
+    font-family: inherit;
+    font-size: inherit;
+}
+
+.input:focus-visible {
+    border-color: var(--primary-color);
+    outline: none;
+}
+
 .main-content-padding {
     padding: var(--main-content-padding);
     width: calc(100% - var(--main-content-padding-x) * 2);

src/styles/variables/dimensions.css

@@ -0,0 +1,4 @@
+:root {
+    --input-padding: 0.7em;
+    --input-height: 1em;
+}