From 250352012113432e000523170c1874f9afe0ef74 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?John=20Molakvo=C3=A6=20=28skjnldsv=29?= Date: Sat, 2 Mar 2019 10:32:36 +0100 Subject: [PATCH] Fix default input element height MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- core/css/fixes.scss | 4 ---- core/css/inputs.scss | 16 +++++++++++----- settings/css/settings.scss | 4 +--- 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;