diff --git a/src/components/input/input.scss b/src/components/input/input.scss index 4505ad2746f..820c7e64254 100644 --- a/src/components/input/input.scss +++ b/src/components/input/input.scss @@ -23,12 +23,12 @@ ion-textarea { width: 100%; } - .item-input ion-input, .item-input ion-textarea { position: static; } + // Textarea Within An Item // -------------------------------------------------- @@ -64,7 +64,6 @@ textarea.text-input { opacity: .4; } - input.text-input:-webkit-autofill { background-color: transparent; } @@ -81,6 +80,7 @@ input.text-input:-webkit-autofill { // This make it so the native input element is not clickable. // This will only show when the scroll assist is configured // otherwise the .input-cover will not be rendered at all +// The input cover is not clickable when the input is disabled .input-cover { position: absolute; @@ -91,6 +91,10 @@ input.text-input:-webkit-autofill { height: 100%; } +ion-input[disabled] .input-cover { + pointer-events: none; +} + // Input Cover: Focused // -------------------------------------------------- diff --git a/src/components/input/test/input-focus/main.html b/src/components/input/test/input-focus/main.html index 8dc23fa8deb..d6f838d64aa 100644 --- a/src/components/input/test/input-focus/main.html +++ b/src/components/input/test/input-focus/main.html @@ -214,6 +214,11 @@ + + Disabled Input: + + +