Permalink
Browse files

Style inputs of type url and email

Closes #8
  • Loading branch information...
joshuaclayton committed May 5, 2011
1 parent c20e981 commit 0d03c36f712eb971afb4441fa3ce943ed649cda0
Showing with 16 additions and 6 deletions.
  1. +3 −3 blueprint/screen.css
  2. +3 −3 blueprint/src/forms.css
  3. +10 −0 tests/parts/forms.html
View
@@ -84,10 +84,10 @@ fieldset {padding:0 1.4em 1.4em 1.4em;margin:0 0 1.5em 0;border:1px solid #ccc;}
legend {font-weight:bold;font-size:1.2em;margin-top:-0.2em;margin-bottom:1em;}
fieldset, #IE8#HACK {padding-top:1.4em;}
legend, #IE8#HACK {margin-top:0;margin-bottom:0;}
-input[type=text], input[type=password], input.text, input.title, textarea {background-color:#fff;border:1px solid #bbb;color:#000;}
-input[type=text]:focus, input[type=password]:focus, input.text:focus, input.title:focus, textarea:focus {border-color:#666;}
+input[type=text], input[type=password], input[type=url], input[type=email], input.text, input.title, textarea {background-color:#fff;border:1px solid #bbb;color:#000;}
+input[type=text]:focus, input[type=password]:focus, input[type=url]:focus, input[type=email]:focus, input.text:focus, input.title:focus, textarea:focus {border-color:#666;}
select {background-color:#fff;border-width:1px;border-style:solid;}
-input[type=text], input[type=password], input.text, input.title, textarea, select {margin:0.5em 0;}
+input[type=text], input[type=password], input[type=url], input[type=email], input.text, input.title, textarea, select {margin:0.5em 0;}
input.text, input.title {width:300px;padding:5px;}
input.title {font-size:1.5em;}
textarea {width:390px;height:250px;padding:5px;}
View
@@ -30,21 +30,21 @@ legend, #IE8#HACK { margin-top:0; margin-bottom:0; }
add classes for each one. ".title" simply creates a large text
field, this is purely for looks.
*/
-input[type=text], input[type=password],
+input[type=text], input[type=password], input[type=url], input[type=email],
input.text, input.title,
textarea {
background-color:#fff;
border:1px solid #bbb;
color:#000;
}
-input[type=text]:focus, input[type=password]:focus,
+input[type=text]:focus, input[type=password]:focus, input[type=url]:focus, input[type=email]:focus,
input.text:focus, input.title:focus,
textarea:focus {
border-color:#666;
}
select { background-color:#fff; border-width:1px; border-style:solid; }
-input[type=text], input[type=password],
+input[type=text], input[type=password], input[type=url], input[type=email],
input.text, input.title,
textarea, select {
margin:0.5em 0;
View
@@ -42,6 +42,16 @@ <h1>Forms</h1>
<input type="password" class="text" id="dummy3" name="dummy3" value="Password field with class .text">
</p>
+ <p>
+ <label for="dummy_url">A URL field</label><br>
+ <input type="url" class="text" id="dummy_url" name="dummy_url" value="http://example.com">
+ </p>
+
+ <p>
+ <label for="dummy_email">An email field</label><br>
+ <input type="email" class="text" id="dummy_email" name="dummy_email" value="email-with-class-text@example.com">
+ </p>
+
<p>
<input type="submit" value="Submit">
<input type="reset" value="Reset">

0 comments on commit 0d03c36

Please sign in to comment.