beenull/mini.css
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Utility module quick reference

Browse source
This commit is contained in:
Angelos Chalaris 2016-12-20 13:18:33 +02:00
parent 8bc46327c3
commit 7ebb456140
3 changed files with 27 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
docs/quick_reference.html
View file

@ -1074,7 +1074,10 @@
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li></li>
<li>Use <code>.hidden</code> to hide elements</li>
<li>Use <code>.visually-hidden</code> to show elements only in screen readers</li>
<li>Both classes use <code><span class="fore-secondary">!important</span></code> declarations</li>
<li>Do not use both classes together</li>
</ul>
</div>
</div>
@ -1089,7 +1092,11 @@
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li></li>
<li>Use <code>.float-left</code> or <code>.float-right</code> for quick floats</li>
<li>Use <code>.center-block</code> for centered blocks</li>
<li>Use <code>.clearfix</code> to clear floats</li>
<li>All classes use <code><span class="fore-secondary">!important</span></code> declarations</li>
<li>Do not combine these classes with each other, except for <code>.clearfix</code></li>
</ul>
</div>
</div>
@ -1107,7 +1114,12 @@
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li></li>
<li>Create generic borders using <code>.bordered</code></li>
<li>Rounded and circular border radii available using <code>.rounded</code> and <code>.ciruclar</code> classes</li>
<li>Generic shadows available using the <code>.shadow-small</code>, <code>.shadow-medium</code>, <code>.shadow-large</code> and <code>.shadow-none</code> classes</li>
<li>Combine generic borders, border radii and generic shadows with each other but not with themselves</li>
<li>All classes use <code><span class="fore-secondary">!important</span></code> declarations</li>
<li>Generic borders work well with buttons</li>
</ul>
</div>
</div>
@ -1120,7 +1132,9 @@
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li></li>
<li>Use the <code>.responsive-padding</code> and <code>.responsive-margin</code> classes to apply responsive padding or margin respectively to any element</li>
<li>The two classes can be combined</li>
<li>Both classes use <code><span class="fore-secondary">!important</span></code> declarations</li>
</ul>
</div>
</div>
@ -1136,7 +1150,9 @@
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li></li>
<li>To create breadcrumbs, create a <code>&lt;ul</code> element implementing the <code>.breadcrumbs</code> class</li>
<li>Do not use <code>&lt;ol&gt;</code> for breadcrumbs</li>
<li>Do not nest lists inside the <code>.breadcrumbs</code></li>
</ul>
</div>
</div>
@ -1148,7 +1164,9 @@
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li></li>
<li>Use the <code>.close</code> class to create a close icon</li>
<li>Use a <code>&lt;span&gt;</code> or <code>&lt;div&gt;</code> element to create a close icon</li>
<li>Use a button element implementing the <code>.close</code> class to stylize the close icon as a button</li>
</ul>
</div>
</div>

3
docs/utility.html
View file

@ -216,7 +216,7 @@
<div class="row">
<div class="col-sm-12 col-md-6">
<pre>&lt;span class=&quot;bordered rounded shadow-small&quot;&gt;Stylized element&lt;/span&gt;</pre>
<p class="do"><mark class="tertiary">Do:</mark>&nbsp;</p>
<p class="do"><mark class="tertiary">Do:</mark>&nbsp;You can combine a generic border with any border radius or shadow or even both.</p>
</div>
<div class="col-sm-12 col-md-6 col-sm-last col-md-normal">
<pre>&lt;span class=&quot;rounded circular&quot;&gt;Bad radius&lt;/span&gt;
@ -247,6 +247,7 @@
<h3>Notes</h3>
<ul>
<li>If the default values of these classes are not suited to your needs, check out the <a href="customization.html">customization</a> page.</li>
<li>Both classes utilize <code><span class="fore-secondary">!important</span></code> declarations, so be careful when and how to use them.</li>
</ul>
<hr>
<div class="row">

1
docs/v2/DEVLOG.md
View file

@ -688,3 +688,4 @@
- Documented `tab` in `quick reference`.
- Documented `contextual` in `quick reference`.
- Documented `progress` in `quick reference`.
- Documented `utility` in `quick reference`.