Beginning AngularJS

CHApTer 6 ■ WorkIng WITH ForMS

Thanks to a small amount of CSS, this looks a lot tidier. Most of the CSS, which is shown in Listing 6-18, relates
to the look and feel of the form. However, I have also used a few of the AngularJS style hooks that I pointed out in
Table 6-3. Here is the CSS code with the AngularJS style hooks shown in bold.

Listing 6-18. The CSS, Including the AngularJS-Style Hooks Behind the Form

body {
font: normal 16px/1.4 Georgia;
}

input:not([type='checkbox']), select {
width: 250px;
}

select, input {
padding: 5px;
margin-top: 12px;
font-family: inherit;
}

input[type='submit'] {
width: 264px;
}

form span {
color: red;
}

input[name='email'].ng-dirty.ng-invalid {
color: red;
}

Figure 6-5. Smartening up the form