Fix default input element height

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

3 files changed, 12 insertions, 12 deletions

diff --git a/core/css/fixes.scss b/core/css/fixes.scss
index 2a819aeefaf..6cb6b4069ad 100644
--- a/core/css/fixes.scss
+++ b/core/css/fixes.scss
@@ -5,7 +5,3 @@
 	border: 0;
 }
 
-/* fix height of select boxes for OS X */
-select {
-	height: 32px;
-}
diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index e9bee2c62be..b659a73dbc3 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -20,6 +20,8 @@ input, textarea, select, button, div[contenteditable=true], div[contenteditable=
 	font-family: var(--font-face) !important;
 }
 
+$default-height: 34px;
+
 /* Simple selector to allow easy overriding */
 select,
 button,
@@ -28,7 +30,7 @@ textarea,
 div[contenteditable=true],
 div[contenteditable=false] {
 	width: 130px;
-	min-height: 32px;
+	min-height: $default-height;
 	box-sizing: border-box;
 }
 
@@ -38,7 +40,6 @@ div[contenteditable=false] {
  * color-text-maxcontrast 	disabled state
  */
 
-
 /* Default global values */
 div.select2-drop .select2-search input, // TODO: REMOVE WHEN DROPPING SELECT2
 select,
@@ -138,6 +139,8 @@ input {
 	&:not([type='radio']):not([type='checkbox']):not([type='range']):not([type='submit']):not([type='button']):not([type='reset']):not([type='color']):not([type='file']):not([type='image']) {
 		-webkit-appearance: textfield;
 		-moz-appearance: textfield;
+		// force height for inline elements like inputs (not textarea, contenteditable...)
+		height: $default-height;
 	}
 	&[type='radio'],
 	&[type='checkbox'],
@@ -172,7 +175,7 @@ input[type='submit'],
 input[type='reset'] {
 	padding: 6px 12px;
 	width: auto;
-	min-height: 34px;
+	min-height: $default-height;
 	cursor: pointer;
 	box-sizing: border-box;
 	background-color: var(--color-background-dark);
@@ -234,6 +237,8 @@ select {
 	background-color: inherit;
 	outline: 0;
 	padding-right: 24px !important;
+	// force height for inline elements like inputs (not textarea, contenteditable...)
+	height: $default-height;
 }
 
 /* Confirm inputs */
@@ -249,7 +254,8 @@ input {
 			/* Avoid background under border */
 			background-color: var(--color-main-background) !important;
 			opacity: 1;
-			width: 34px;
+			height: $default-height;
+			width: $default-height;
 			padding: 7px 6px;
 			cursor: pointer;
 			margin-right: 0;
@@ -684,7 +690,7 @@ div.select2-container {
 		cursor: pointer;
 		position: relative;
 		border-radius: var(--border-radius);
-		height: 34px;
+		height: $default-height;
 		/* tag wrapper */
 		.multiselect__tags-wrap {
 			align-items: center;
diff --git a/settings/css/settings.scss b/settings/css/settings.scss
index a61990c1b27..90b01ca9ee7 100644
--- a/settings/css/settings.scss
+++ b/settings/css/settings.scss
@@ -1492,9 +1492,7 @@ doesnotexist:-o-prefocus, .strengthify-wrapper {
 					}
 				}
 				.icon-confirm {
-					width: 32px;
-					height: 32px;
-					flex: 0 0 32px;
+					flex: 0 0 auto;
 					cursor: pointer;
 					&:not(:active) {
 						display: none;