rayelliott
/
_s
Archived
forked from mirror/_s
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #887 from mrwweb/html5-inputs 

List all HTML5 input types. Props @mrwweb
This commit is contained in:
Caroline Moore 2015-12-21 10:07:53 -05:00
parent cdd101e16c 9ccc1faa9e
commit d40faf1e45
2 changed files with 61 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
sass/forms/_fields.scss
View File

@ -3,6 +3,16 @@ input[type="email"],
input[type="url"], input[type="url"],
input[type="password"], input[type="password"],
input[type="search"], input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea { textarea {
color: $color__text-input; color: $color__text-input;
border: 1px solid $color__border-input; border: 1px solid $color__border-input;
@ -13,11 +23,25 @@ textarea {
} }
} }
select {
border: 1px solid $color__border-input;
}
input[type="text"], input[type="text"],
input[type="email"], input[type="email"],
input[type="url"], input[type="url"],
input[type="password"], input[type="password"],
input[type="search"] { input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"] {
padding: 3px; padding: 3px;
} }

36
style.css
View File

@ -461,17 +461,41 @@ input[type="email"],
input[type="url"], input[type="url"],
input[type="password"], input[type="password"],
input[type="search"], input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea { textarea {
color: #666; color: #666;
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: 3px; border-radius: 3px;
} }
select {
border: 1px solid #ccc;
}
input[type="text"]:focus, input[type="text"]:focus,
input[type="email"]:focus, input[type="email"]:focus,
input[type="url"]:focus, input[type="url"]:focus,
input[type="password"]:focus, input[type="password"]:focus,
input[type="search"]:focus, input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus { textarea:focus {
color: #111; color: #111;
} }
@ -480,7 +504,17 @@ input[type="text"],
input[type="email"], input[type="email"],
input[type="url"], input[type="url"],
input[type="password"], input[type="password"],
input[type="search"] { input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"] {
padding: 3px; padding: 3px;
} }