1
0
mirror of https://github.com/bigchaindb/site.git synced 2024-11-22 17:50:07 +01:00

add new form elements to style guide

This commit is contained in:
Matthias Kretschmann 2017-04-12 18:42:00 +02:00
parent cef4a4d134
commit f9cb071f17
Signed by: m
GPG Key ID: BD3C1F3EDD7831FC
2 changed files with 48 additions and 2 deletions

View File

@ -7,6 +7,7 @@
padding: ($spacer * 1.5) ($spacer * 2.5);
background: $gray-dark;
border-radius: $border-radius;
margin-bottom: $spacer;
}
.form-control {

View File

@ -210,7 +210,7 @@ Logo can be used with a base class and modifier classes for size & color:
### Forms
<form class="js-parsley" action="#">
<form class="form js-parsley" action="#">
<div class="form-group">
<input class="form-control" type="text" id="name" name="name" required>
<label class="form-label" for="name">Your Name</label>
@ -219,13 +219,39 @@ Logo can be used with a base class and modifier classes for size & color:
<input class="form-control" type="email" id="email" name="email">
<label class="form-label" for="email">Your Email</label>
</div>
<div class="form-group">
<input class="form-control" type="tel" id="phone" name="phone">
<label class="form-label" for="phone">Your Phone</label>
</div>
<div class="form-group">
<select class="form-control" id="select" name="select" required data-required="true">
<option value="">Select me...</option>
<option value="Automotive">Automotive</option>
<option value="Banking">Banking</option>
<option value="Consulting">Consulting</option>
<option value="Data">Data</option>
<option value="Automotive">Automotive</option>
<option value="Banking">Banking</option>
<option value="Consulting">Consulting</option>
<option value="Data">Data</option>
<option value="Automotive">Automotive</option>
<option value="Banking">Banking</option>
<option value="Consulting">Consulting</option>
<option value="Data">Data</option>
</select>
<label class="form-label" for="industry">Industry</label>
</div>
<div class="form-group">
<textarea class="form-control" id="comment" name="comment" rows="1"></textarea>
<label class="form-label" for="comment">Autogrowing textarea</label>
</div>
<div class="form-group">
<input class="btn btn-primary" type="submit" value="Submit">
</div>
</form>
```html
<form class="js-parsley" action="#">
<form class="form js-parsley" action="#">
<div class="form-group">
<input class="form-control" type="text" id="name" name="name" required>
<label class="form-label" for="name">Your Name</label>
@ -234,6 +260,25 @@ Logo can be used with a base class and modifier classes for size & color:
<input class="form-control" type="email" id="email" name="email">
<label class="form-label" for="email">Your Email</label>
</div>
<div class="form-group">
<input class="form-control" type="tel" id="phone" name="phone">
<label class="form-label" for="phone">Your Phone</label>
</div>
<div class="form-group">
<select class="form-control" id="select" name="select" required data-required="true">
<option value="">Select me...</option>
<option value="Automotive">Automotive</option>
<option value="Banking">Banking</option>
<option value="Consulting">Consulting</option>
<option value="Data">Data</option>
...
</select>
<label class="form-label" for="industry">Industry</label>
</div>
<div class="form-group">
<textarea class="form-control" id="comment" name="comment" rows="1"></textarea>
<label class="form-label" for="comment">Autogrowing textarea</label>
</div>
<div class="form-group">
<input class="btn btn-primary" type="submit" value="Submit">
</div>