1
0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-07-31 02:50:26 +02:00

Added and documented vertical input groups

Added vertical input-groups for easier form alignment, added relevant documentation, updated all flavors. Pretty much all of the features of this update have been completed, so after some housekeeping it'll be ready to release.
This commit is contained in:
Angelos Chalaris
2017-06-09 15:34:14 +03:00
parent 7af521f9a6
commit b1fc2f28fa
22 changed files with 200 additions and 50 deletions

View File

@@ -386,13 +386,17 @@
<fieldset>
<legend>Simple form</legend>
<div class="input-group fluid">
<label for="username">username</label>
<label for="username">Username</label>
<input type="email" value="" id="username" placeholder="username">
</div>
<div class="input-group fluid">
<label for="pwd">password</label>
<label for="pwd">Password</label>
<input type="password" value="" id="pwd" placeholder="password">
</div>
<div class="input-group vertical">
<label for="nmbr">Number</label>
<input type="number" id="nmbr" value="5">
</div>
</fieldset>
&lt;/form&gt;</pre>
</div>
@@ -406,7 +410,8 @@
<li>Checkboxes and radio buttons are stylized differently, as shown below</li>
<li>You can use the grid module's column classes to align form elements or make them responsive</li>
<li>Avoid using <code>.input-group</code> in aligned forms</li>
<li>Make <code>.input-group</code>s responsive by adding the <code>.fluid</code> class</li>
<li>Make <code>.input-group</code>s responsive by adding the <code>.fluid</code> class</li>
<li>Vertically align <code>.input-group</code>s using the <code>.vertical</code> class</li>
</ul>
</div>
</div>