diff options
CHG: Split Codes and improve docs codes
1 files changed, 13 insertions, 16 deletions
| -rw-r--r-- | docs/layout.html | 29 |
diff --git a/docs/layout.html b/docs/layout.html index a0e96ed..ced292a 100644 --- a/docs/layout.html +++ b/docs/layout.html @@ -158,8 +158,7 @@ </div> <!-- layout example --> -<pre> -<code class="code lang-html" data-lang="HTML"><<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"container"</span>> +<pre class="code" data-lang="HTML"><code><<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"container"</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"columns"</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-6"</span>>col-6<<span class="tag">/div</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-3"</span>>col-3<<span class="tag">/div</span>> @@ -171,8 +170,8 @@ <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-6"</span>>col-6<<span class="tag">/div</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-6"</span>>col-6<<span class="tag">/div</span>> <<span class="tag">/div</span>> -<<span class="tag">/div</span>></code> -</pre> +<<span class="tag">/div</span>> +</code></pre> </section> @@ -227,15 +226,14 @@ </section> <!-- layout example --> -<pre> -<code class="code lang-html" data-lang="HTML"><<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"container"</span>> +<pre class="code" data-lang="HTML"><code><<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"container"</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"columns"</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-xs-6"</span>>col-xs-6<<span class="tag">/div</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-xs-3"</span>>col-xs-3<<span class="tag">/div</span>> <<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"column col-xs-3"</span>>col-xs-3<<span class="tag">/div</span>> <<span class="tag">/div</span>> -<<span class="tag">/div</span>></code> -</pre> +<<span class="tag">/div</span>> +</code></pre> <section class="notes"> <p>For hiding elements on specific viewport sizes, there are classes <code>hide-xs</code>, <code>hide-sm</code>, <code>hide-md</code>, <code>hide-lg</code> and <code>hide-xl</code> available.</p> @@ -280,8 +278,7 @@ </section> <!-- navbar example --> -<pre> -<code class="code lang-html" data-lang="HTML"><<span class="tag">header</span> <span class="atn">class</span>=<span class="atv">"navbar"</span>> +<pre class="code" data-lang="HTML"><code><<span class="tag">header</span> <span class="atn">class</span>=<span class="atv">"navbar"</span>> <<span class="tag">section</span> <span class="atn">class</span>=<span class="atv">"navbar-section"</span>> <<span class="tag">a</span> <span class="atn">href</span>=<span class="atv">"#"</span> <span class="atn">class</span>=<span class="atv">"navbar-brand"</span>> <<span class="tag">i</span> <span class="atn">class</span>=<span class="atv">"icon icon-pages"</span>><<span class="tag">/i</span>> Spectre.css @@ -295,8 +292,8 @@ <<span class="tag">button</span> <span class="atn">class</span>=<span class="atv">"btn btn-primary input-group-btn"</span>>Search<<span class="tag">/button</span>> <<span class="tag">/div</span>> <<span class="tag">/section</span>> -<<span class="tag">/header</span>></code> -</pre> +<<span class="tag">/header</span>> +</code></pre> </section> @@ -331,14 +328,14 @@ </section> <!-- empty states example --> -<pre> -<code class="code lang-html" data-lang="HTML"><<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"empty"</span>> +<pre class="code" data-lang="HTML"><code><<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">"empty"</span>> <<span class="tag">i</span> <span class="atn">class</span>=<span class="atv">"icon icon-people"</span>><<span class="tag">/i</span>> <<span class="tag">p</span> <span class="atn">class</span>=<span class="atv">"empty-title"</span>>You have no new messages<<span class="tag">/p</span>> <<span class="tag">p</span> <span class="atn">class</span>=<span class="atv">"empty-meta"</span>>Click the button to start a conversation.<<span class="tag">/p</span>> <<span class="tag">button</span> <span class="atn">class</span>=<span class="atv">"empty-action btn btn-primary"</span>>Send a message<<span class="tag">/button</span>> -<<span class="tag">/div</span>></code> -</pre> +<<span class="tag">/div</span>> +</code></pre> + </section> <section class="container"> |