aboutsummaryrefslogtreecommitdiffstats
path: root/library/font_awesome/src/_includes/examples/larger-icons.html
diff options
context:
space:
mode:
authorHaakon Meland Eriksen <haakon.eriksen@far.no>2014-06-24 19:34:36 +0200
committerHaakon Meland Eriksen <haakon.eriksen@far.no>2014-06-24 19:34:36 +0200
commitb8dc9e855af2d30f33d0f90dc13d8cad0a7b3e70 (patch)
tree718df6305bcb82c8dcb4b287a7132422e748cdfb /library/font_awesome/src/_includes/examples/larger-icons.html
parentc2d520f1be115fb3cb5da2a35eb10146cecee8aa (diff)
parenta92fb0b04c3e6474ec48faf8e4cc65c382e89d66 (diff)
downloadvolse-hubzilla-b8dc9e855af2d30f33d0f90dc13d8cad0a7b3e70.tar.gz
volse-hubzilla-b8dc9e855af2d30f33d0f90dc13d8cad0a7b3e70.tar.bz2
volse-hubzilla-b8dc9e855af2d30f33d0f90dc13d8cad0a7b3e70.zip
Merge remote-tracking branch 'upstream/master'
Diffstat (limited to 'library/font_awesome/src/_includes/examples/larger-icons.html')
-rw-r--r--library/font_awesome/src/_includes/examples/larger-icons.html35
1 files changed, 35 insertions, 0 deletions
diff --git a/library/font_awesome/src/_includes/examples/larger-icons.html b/library/font_awesome/src/_includes/examples/larger-icons.html
new file mode 100644
index 000000000..95f1ee13b
--- /dev/null
+++ b/library/font_awesome/src/_includes/examples/larger-icons.html
@@ -0,0 +1,35 @@
+<section id="larger-icons">
+ <h2 class="page-header">Larger Icons</h2>
+ <div class="row">
+ <div class="span3">
+ <p>
+ To increase the size of icons relative to its container, use <code>icon-large</code>, <code>icon-2x</code>,
+ <code>icon-3x</code>, or <code>icon-4x</code>.
+ </p>
+ </div>
+ <div class="span9">
+ <p>
+ Increase the icon size by using the <code>icon-large</code> (33% increase), <code>icon-2x</code>,
+ <code>icon-3x</code>, or <code>icon-4x</code> classes.
+ </p>
+ <div class="well well-transparent">
+ <div style="font-size: 24px; line-height: 1.5em;">
+ <p><i class="icon-camera-retro icon-large"></i> icon-camera-retro</p>
+ <p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
+ <p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
+ <p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>
+ </div>
+ </div>
+{% highlight html %}
+<p><i class="icon-camera-retro icon-large"></i> icon-camera-retro</p>
+<p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
+<p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
+<p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>
+{% endhighlight %}
+ <div class="alert alert-info">
+ <i class="icon-info-sign"></i> If your icons are getting chopped off on top and bottom, make sure you have
+ sufficient line-height.
+ </div>
+ </div>
+ </div>
+</section>