-
Notifications
You must be signed in to change notification settings - Fork 13.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
MD: inputs should have success/error highlighting #5052
Comments
I've had people ask how to disable highlighting so I am going to add the comment here: The success/error highlighting can be turned off via the following Sass variables:
and to change the colors use the following variables:
Please add any feedback on this issue, Thanks! |
I want to suggest to add a new 'success' Sass variable to color array for a color of success/valid states. Because it is not handy to override sass variables for each platform (md, wp) to make a right color for input's valid state in case the secondary color is not green (e.g. pink or red). |
The input highlight can now be enabled for ios. Fixed wp’s valid/invalid highlighting. The highlight bar now goes on top of the item-inner border so it will resize if there is an icon to the left. BREAKING CHANGES: Fixed typos in the input highlight variables: - `$text-input-md-hightlight-color-valid` -> `$text-input-md-highlight-color-valid` - `$text-input-wp-hightlight-color-valid` -> `$text-input-wp-highlight-color-valid` Modified variables to turn on/off the highlight: ios (defaults to false for all): ``` $text-input-ios-show-focus-highlight: false !default; $text-input-ios-show-valid-highlight: $text-input-ios-show-focus-highlight !default; $text-input-ios-show-invalid-highlight: $text-input-ios-show-focus-highlight !default; ``` md (defaults to true for all): ``` $text-input-md-show-focus-highlight: true !default; $text-input-md-show-valid-highlight: $text-input-md-show-focus-highlight !default; $text-input-md-show-invalid-highlight: $text-input-md-show-focus-highlight !default; ``` wp (defaults to true for all): ``` $text-input-wp-show-focus-highlight: true !default; $text-input-wp-show-valid-highlight: $text-input-wp-show-focus-highlight !default; $text-input-wp-show-invalid-highlight: $text-input-wp-show-focus-highlight !default; ``` fixes #6449 references #5052
Thanks @Chuckv01, I fixed it in my latest commit so the highlight won't extend all the way to the left, unless it is the last in the list (which is the same behavior as the default border): Also there are some breaking changes that will be in the I'm still trying to find a way to make this easier to customize. I'm not sure about a |
The valid highlight should be shown only when the input has the touched state. Usually we display forms that contain initial data and the highlight should not be displayed at the begging. |
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out. |
From @brandyscarney on December 1, 2015 16:59
Copied from original issue: driftyco/ionic2#678
The text was updated successfully, but these errors were encountered: