blur-admin/src/app/pages/typography/typography.html

182 lines
8.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<div class="widgets">
<div class="widgets-block">
<div class="panel panel-default invisible" zoom-in>
<div class="panel-body content-panel">
<div class="section-block">
<h1>H1. Blur Admin Heading</h1>
<p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra, placerat
vestibulum eleifend pellentesque, mi nam. Odio amet viverra rutrum quisque, dolor elit, dolor mauris integer
ut non at sed. Quisque neque metus sit montes diam. Eiusmod id id volutpat gravida, eleifend consequat at,
id dolor sollicitudin. Ut id et libero mauris id. Dolor eget vel non aenean arcu, sociis neque molestie
fusce.</p>
</div>
<div class="section-block">
<h2>H2. Blur Admin Heading</h2>
<p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra, placerat
vestibulum eleifend pellentesque, mi nam. Odio amet viverra rutrum quisque, dolor elit, dolor mauris integer
ut non at sed. Quisque neque metus sit montes diam. Eiusmod id id volutpat gravida, eleifend consequat at,
id dolor sollicitudin. </p>
</div>
<div class="section-block">
<h3>H3. Blur Admin Heading</h3>
<p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra, placerat
vestibulum eleifend pellentesque, mi nam. Odio amet viverra rutrum quisque, dolor elit, dolor mauris integer
ut non at sed. Quisque neque metus sit montes diam. Eiusmod id id volutpat gravida, eleifend consequat at,
id dolor sollicitudin. Ut id et libero mauris id. Dolor eget vel non aenean arcu, sociis neque molestie
fusce.</p>
</div>
<div class="section-block">
<h4 class="color">H4. Color Blur Admin Heading</h4>
<p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra, placerat
vestibulum eleifend pellentesque, mi nam. Odio amet viverra rutrum quisque, dolor elit, dolor mauris integer
ut non at sed. Quisque neque metus sit montes diam. Eiusmod id id volutpat gravida, eleifend consequat at,
id dolor sollicitudin. Ut id et libero mauris id. Dolor eget vel non aenean arcu, sociis neque molestie
fusce.</p>
</div>
<div class="section-block">
<h5 class="color">H5. Color Blur Admin Heading</h5>
<p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra, placerat
vestibulum eleifend pellentesque, mi nam. Odio amet viverra rutrum quisque, dolor elit, dolor mauris integer
ut non at sed. Quisque neque metus sit montes diam. Eiusmod id id volutpat gravida, eleifend consequat at,
id dolor sollicitudin. Ut id et libero mauris id. Dolor eget vel non aenean arcu, sociis neque molestie
fusce.</p>
</div>
<div class="accent">Important text fragment. Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar,
lacinia scelerisque pharetra, placerat vestibulum eleifend pellentesque, mi nam. Lorem ipsum dolor sit amet,
id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra, placerat vestibulum eleifend pellentesque,
mi nam.
</div>
<div class="section-block">
<p class="small-text">Secondary text. Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia
scelerisque pharetra, placerat vestibulum eleifend pellentesque, mi nam.</p>
<p class="small-text">Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque
pharetra, placerat vestibulum eleifend pellentesque, mi nam.</p>
</div>
<div class="section">
<h2>Columns</h2>
<div class="row">
<div class="col-sm-6">
<div class="img-wrapper"><img src="release/img/typo03.png" alt="" title=""/></div>
<p>Vel elit, eros elementum, id lacinia, duis non ut ut tortor blandit. Mauris <a
href>dapibus</a> magna rutrum. Ornare neque suspendisse <a
href>phasellus wisi</a>, quam cras pede rutrum suspendisse, <a
href>felis amet eu</a>. Congue magna elit quisque quia, nullam justo sagittis,
ante erat libero placerat, proin condimentum consectetuer lacus. Velit condimentum velit, sed penatibus
arcu nulla.</p>
</div>
<div class="col-sm-6">
<div class="img-wrapper"><img src="release/img/typo01.png" alt="" title=""/></div>
<p>Et suspendisse, adipiscing fringilla ornare sit ligula sed, vel nam. Interdum et justo nulla, fermentum
lobortis purus ut eu, duis nibh dolor massa tristique elementum, nibh iste potenti risus fusce aliquet
fusce, ullamcorper debitis primis arcu tellus vestibulum ac.</p>
</div>
</div>
<div class="separator"></div>
<div class="row">
<div class="col-sm-4">
<h4>Column heading example</h4>
</div>
<div class="col-sm-4">
<h4>Yet another column heading example</h4>
</div>
<div class="col-sm-4">
<h4>Third column heading example</h4>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<div class="img-wrapper"><img src="release/img/typo04.png" alt=""/></div>
<p>Eget augue, lacus erat ante egestas scelerisque aliquam, metus molestie leo in habitasse magna
maecenas</p>
<a href class="learn-more">Lean more</a>
</div>
<div class="col-sm-4">
<div class="img-wrapper"><img src="release/img/typo05.png" alt=""/></div>
<p>Augue massa et parturient, suspendisse orci nec scelerisque sit, integer nam mauris pede consequat in
velit</p>
<a href class="learn-more">Lean more</a>
</div>
<div class="col-sm-4">
<div class="img-wrapper"><img src="release/img/typo06.png" alt=""/></div>
<p>Eget turpis, tortor lobortis porttitor, vestibulum nullam vehicula aliquam</p>
<a href class="learn-more">Lean more</a>
</div>
</div>
</div>
<div class="separator"></div>
<h5>Unordered list:</h5>
<ul class="blur">
<li>Lorem ipsum dolor sit amet</li>
<li>Сlacinia scelerisque pharetra
<ul>
<li>Dui rhoncus quisque integer lorem
<ul>
<li>Libero iaculis vestibulum eu vitae phasellus enim</li>
</ul>
</li>
</ul>
</li>
<li>Nisl lectus nibh habitasse suspendisse ut</li>
<li>Posuere cursus hac, vestibulum wisi nulla bibendum fames, magna vel turpis dis nibh</li>
</ul>
<h5>Ordered Lists:</h5>
<ol class="blur">
<li><span>Eu non nec cursus quis mollis, amet quam nec quam</span></li>
<li><span>Et suspendisse, adipiscing fringilla ornare sit ligula sed</span>
<ol>
<li><span>Interdum et justo nulla</span>
<ol>
<li><span>Magna amet, suscipit suscipit non amet fames sed erat</span></li>
</ol>
</li>
</ol>
</li>
<li><span>Metus duis eu non eu ridiculus turpis</span></li>
<li><span>Neque egestas id fringilla consectetuer justo curabitur, wisi magna neque commodo volutpat</span>
</li>
</ol>
<div class="banner">
<div class="large-banner-wrapper">
<img src="release/img/banner.png" alt=""/>
</div>
<div class="banner-text-wrapper">
<div class="banner-text">
<h3>Sample Banner Text</h3>
<p>Lorem ipsum dolor sit amet</p>
<p>Odio amet viverra rutrum</p>
</div>
</div>
<div class="photo-desc"><p class="small-text">Banner Description Text</p></div>
</div>
<div class="links">
<h2>Links</h2>
<p><a href>Active link — #41bee9</a></p>
<p class="hovered"><a href>Hover link — #9d498c</a></p>
</div>
</div>
</div>
</div>
</div>