#42 Paragraphs

Author: Daniell Mesquita

elements.html

@@ -18,14 +18,21 @@
 <nopehtml><blockquote style="background:#D6D6D6;border-top:1px solid #E7534F;border-bottom:1px solid #E7534F;border-left:10px solid #E7534F;border-right:10px solid #E7534F;border-radius:20px;margin:0 auto;text-align:center"><div style="margin-top: -7px;margin-left: 5px;width: 80px;height: 80px;clear: left;float: left"><img src="rsc/warning.svg" width="80px" height="80px"/></div><h1 style="font-size:40px;margin-top:-5px;margin-bottom:-1px">Aviso</h1><br>Seu navegador não suporta sites construídos em PEHTML. Isso significa que esse site não será exibido corretamente em seu atual navegador. <br><a href="../boat">Baixe o navegador Internet Boat</a> para experimentar todo o poder do PEHTML e aproveitar todos os recursos desse site.<br/><p>Don't know what is PEHTML? Learn <a href="https://developers.plasmmer.com/PEHTML" target="blank">here</a>.</p></blockquote></nopehtml>
 <p>After follow the <a href="index.html#instructions" target="blank">instructions</a>, here is the page for you start inserting elements to your page/app that uses the power of Plasmmer UI Framework!</p>
 <h1>Popunders</h1><br/>
-<h2>Fullscreen</h2>
-<h3>Action to activate</h3>
+<h4>Fullscreen</h4>
+<h6>Action to activate</h6>
 <textarea onclick="this.focus();this.select()" readonly="readonly" style="margin: 6px 41px; width: 372px; height: 16px;">&lt;div onclick="$('#yourpopunder').toggle();return false"&gt;&lt;/div&gt;</textarea>
-<h3>Code of popunder (you can add more popunders to container)</h3>
+<h6>Code of popunder (you can add more popunders to container)</h6>
 <textarea onclick="this.focus();this.select()" readonly="readonly" style="margin:6px 41px;width: 504px;height:16px">&lt;div class="popunders"&gt;&lt;div id="yourpopunder" style="display: none;"&gt;&lt;/div&gt;&lt;/div&gt;</textarea>
 <br/><h1>Blockquotes</h1><br/>
 <textarea onclick="this.focus();this.select()" readonly="readonly" style="margin:6px 41px;width: 392px;height:16px">&lt;blockquote&gt;&lt;p&gt;Phrase&lt;/p&gt;&lt;span&gt;Creator&lt;/span&gt;&lt;/blockquote&gt;</textarea>
-<br/><h1>Paragraphs</h1><br/>
+<br/><h1>Paragraphs</h1>
+<h1>h1</h1>
+<h2>h2</h2>
+<h3>h3</h3>
+<h4>h4</h4>
+<h5>h5</h5>
+<h6>h6</h6>
+<br/>
 <textarea onclick="this.focus();this.select()" readonly="readonly" style="margin:6px 41px;width: 392px;height: 28px;">&lt;p&gt;Mussum ipsum cacilds plasmis&lt;/p&gt;
 &lt;p&gt;Mussum ipsum cacilds plasmis uis frameworquis&lt;/p&gt;</textarea>
 <br/><h1>Headings</h1><br/>

rsc/common.css

@@ -1,4 +1,12 @@
-body{background:rgb(239, 239, 239);font-family:Arial;-webkit-font-smoothing:antialiased;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.header,header{background:#00A185;position:fixed;top:0;left:0;width:100%;height:60px;border-bottom:1px solid #006755;box-shadow: 0 0 15px 1px black;color:#fff;padding-left:20px;z-index:5000}.header,header:hover{box-shadow: 0px 0px 25px 5px #000}.logo,logo{position:absolute;width:315px;height:60px;background:url(logotype.svg) no-repeat no-repeat 10px 15px;opacity:0.5}.logo,logo:hover{opacity:1}.content{width:100%;height:calc(100% - 60px);top:60px;position:fixed;overflow-x:hidden;overflow-y:scroll}.article,article{margin:15px 8px 8px 8px;-webkit-user-select:initial;-moz-user-select:initial;user-select:initial}comments{margin:15px 8px 8px 8px}.h1,h1{font-size:30px;font-weight:bold;color:#00A185;margin:25px 0px 0px 0px;display:inline-block}.h2,h2{font-size:20px;font-weight:bold;color:#333;margin-bottom:5px;display:inline}.badge{background-color:#e7534f;font-family:Arial;font-size:12px;font-weight:bold;padding:3px 8px;border-radius:3px;color:#fff;position:relative;top:-2px;margin-left:8px;display:inline}.badge.blue{background-color:#5b6ed6}.badge.green{background-color:#53a93f}
+body{background:rgb(239, 239, 239);font-family:Arial;-webkit-font-smoothing:antialiased;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.header,header{background:#00A185;position:fixed;top:0;left:0;width:100%;height:60px;border-bottom:1px solid #006755;box-shadow: 0 0 15px 1px black;color:#fff;padding-left:20px;z-index:5000}.header,header:hover{box-shadow: 0px 0px 25px 5px #000}.logo,logo{position:absolute;width:315px;height:60px;background:url(logotype.svg) no-repeat no-repeat 10px 15px;opacity:0.5}.logo,logo:hover{opacity:1}.content{width:100%;height:calc(100% - 60px);top:60px;position:fixed;overflow-x:hidden;overflow-y:scroll}.article,article{margin:15px 8px 8px 8px;-webkit-user-select:initial;-moz-user-select:initial;user-select:initial}comments{margin:15px 8px 8px 8px}
+
+.h1, h1{font-size:80px;font-weight:bold;color:#00A185;margin:25px 0px 0px 0px}.h2, h2{font-size:70px;font-weight:bold;color:#333;margin:25px 0px 0px 0px}
+.h3, h3{font-size:60px;font-weight:bold;color:#333;margin:25px 0px 0px 0px}
+.h4, h4{font-size:50px;font-weight:bold;color:#333;margin:25px 0px 0px 0px}
+.h5, h5{font-size:40px;font-weight:bold;color:#333;margin:25px 0px 0px 0px}
+.h6, h6{font-size:30px;font-weight:bold;color:#333;margin:25px 0px 0px 0px}
+
+.badge{background-color:#e7534f;font-family:Arial;font-size:12px;font-weight:bold;padding:3px 8px;border-radius:3px;color:#fff;position:relative;top:-2px;margin-left:8px;display:inline}.badge.blue{background-color:#5b6ed6}.badge.green{background-color:#53a93f}
 
 .badge.mini{font-size:7px;-webkit-user-select:none;-moz-user-select:none;user-select:none}