From 771ec1bc1f704b60b0957a18ff83308c72fa40e7 Mon Sep 17 00:00:00 2001 From: ashley-hebler Date: Tue, 2 Feb 2021 08:48:43 -0600 Subject: [PATCH] Add option to fix mobile focus zoom on Safari iOS --- assets/scss/6-components/text-input/_text-input.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/assets/scss/6-components/text-input/_text-input.scss b/assets/scss/6-components/text-input/_text-input.scss index dedcabe7..3fe2272a 100644 --- a/assets/scss/6-components/text-input/_text-input.scss +++ b/assets/scss/6-components/text-input/_text-input.scss @@ -1,6 +1,6 @@ // Text input (c-text-input) // -// Text form inputs. Can be used with type="text", type="email", etc. Add .is-valid if the value is not valid. +// Text form inputs. Can be used with `type="text"`, `type="email"`, etc. Add `.is-valid` if the value is not valid. Use `c-text-input__input--standard` to fix [iOS focus bug](https://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone). // // Markup: 6-components/text-input/text-input.html // @@ -16,6 +16,10 @@ padding: $size-xxs; transition: box-shadow .15s ease-in-out; + &--standard { + font-size: 16px; + } + // kill X button that appears on IE and edge // because it doesn't handle JS input event correctly &::-ms-clear {