rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Code Issues Actions Packages Releases Activity

add valid state

Browse Source
This commit is contained in:
Mark Otto 2017-06-06 21:53:23 -07:00
parent 6c214ad4c2
commit 58b7239c6c
1 changed files with 51 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
scss/_forms.scss
View File

@ -268,6 +268,57 @@ $form-feedback-invalid-color: $red !default;
}
.was-validated {
//
// Valid state
//
.form-control:valid,
.custom-select:valid {
border-color: $form-feedback-valid-color;
&:focus {
box-shadow: 0 0 0 .2rem rgba($form-feedback-valid-color,.25);
}
~ .invalid-feedback,
~ .invalid-tooltip {
display: block;
}
}
// TODO: redo check markup lol crap
.form-check-input:valid {
+ .form-check-label {
color: $form-feedback-valid-color;
}
}
// custom radios and checks
.custom-control-input:valid {
~ .custom-control-indicator {
background-color: rgba($form-feedback-valid-color, .25);
}
~ .custom-control-description {
color: $form-feedback-valid-color;
}
}
// custom file
.custom-file-input:valid {
~ .custom-file-control {
border-color: $form-feedback-valid-color;
&::before { border-color: inherit; }
}
&:focus {
box-shadow: 0 0 0 .2rem rgba($form-feedback-valid-color,.25);
}
}
//
// Invalid state
//
// input, textarea, select, and custom select
.form-control:invalid,
.custom-select:invalid {