bigchaindb/site
1
0
Fork 0
mirror of https://github.com/bigchaindb/site.git synced 2025-02-14 21:10:28 +01:00
Code Releases Activity

add new form elements to style guide

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
_src/_assets/styles/bigchain/_forms.scss
View File

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

49
_src/styleguide.md
View File

@ -210,7 +210,7 @@ Logo can be used with a base class and modifier classes for size & color:
### Forms ### Forms
<form class="js-parsley" action="#"> <form class="form js-parsley" action="#">
<div class="form-group"> <div class="form-group">
<input class="form-control" type="text" id="name" name="name" required> <input class="form-control" type="text" id="name" name="name" required>
<label class="form-label" for="name">Your Name</label> <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"> <input class="form-control" type="email" id="email" name="email">
<label class="form-label" for="email">Your Email</label> <label class="form-label" for="email">Your Email</label>
</div> </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"> <div class="form-group">
<input class="btn btn-primary" type="submit" value="Submit"> <input class="btn btn-primary" type="submit" value="Submit">
</div> </div>
</form> </form>
```html ```html
<form class="js-parsley" action="#"> <form class="form js-parsley" action="#">
<div class="form-group"> <div class="form-group">
<input class="form-control" type="text" id="name" name="name" required> <input class="form-control" type="text" id="name" name="name" required>
<label class="form-label" for="name">Your Name</label> <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"> <input class="form-control" type="email" id="email" name="email">
<label class="form-label" for="email">Your Email</label> <label class="form-label" for="email">Your Email</label>
</div> </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"> <div class="form-group">
<input class="btn btn-primary" type="submit" value="Submit"> <input class="btn btn-primary" type="submit" value="Submit">
</div> </div>