This repository was archived by the owner on Jul 1, 2020. It is now read-only.
  
  
  - 
                Notifications
    
You must be signed in to change notification settings  - Fork 55
 
CSS Styling
        Ghislain B. edited this page Jul 23, 2015 
        ·
        2 revisions
      
    You could optionally add some styling to your elements, I personally prefer to have my valid elements with a green border and my invalid elements with a red border and red italic text
Note: If you want red border around your input, make sure to make it show after it's dirty and touched by using the CSS ng-dirty and ng-touched. So for my personal config, I use the following CSS:
/* AngularJS Form validation styling */
.validation.help-block {
    color: #E07676;
    font-style: italic;
}
/* invalid & (dirty or touched) => red -- CSS3 only */
.ng-invalid.ng-dirty:not(:focus),
.ng-invalid.ng-touched:not(:focus) {
    border-color: #e74c3c;
}
/* valid & dirty => green */
.ng-valid.ng-dirty.ng-touched {
    border-color: #2ecc71;
}
/* error display font italic, text-danger is red in BS */
.validation.text-danger {
    font-style: italic;
}Contents
- Angular-Validation Wiki
 - Installation
 - Demo
 - Code Samples
 - Functionalities
 - Custom Validations
 - Properties & Options
 - Validators
 - Tests
 - Misc