sass-site/source/_includes/code_example.liquid

78 lines
2.5 KiB
Plaintext

<div class="code-example ui-tabs {% if code.canSplit %}can-split{% endif %}" style="--split-location: {{ code.splitLocation }}" >
<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix" role="tablist">
<li
class="ui-tabs-tab ui-tab ui-tabs-active"
aria-controls="example-{{ exampleName | strip }}-scss"
role="tab"
aria-expanded="true"
aria-selected="true">
<a
href="#example-{{ exampleName | strip }}-scss"
class="ui-tabs-anchor"
role="presentation"
tabindex="-1"
id="ui-id-{{ exampleName | strip }}-scss">SCSS</a>
</li>
<li
class="ui-tabs-tab ui-tab"
role="tab"
aria-controls="example-{{ exampleName | strip }}-sass"
aria-selected="false"
aria-expanded="false"
tabindex="-1">
<a
href="#example-{{ exampleName | strip }}-sass"
class="ui-tabs-anchor"
role="presentation"
tabindex="-1"
id="ui-id-{{ exampleName | strip }}-sass">Sass</a>
</li>
<li
class="ui-tabs-tab css-tab ui-tab"
role="tab"
tabindex="-1"
aria-controls="example-{{ exampleName | strip }}-css"
aria-labelledby="ui-id-{{ exampleName | strip }}-css"
aria-selected="false"
aria-expanded="false">
<a
href="#example-{{ exampleName | strip }}-css"
class="ui-tabs-anchor"
role="presentation"
tabindex="-1"
id="ui-id-{{ exampleName | strip }}-css">CSS</a>
</li>
</ul>
<div
id="example-{{ exampleName | strip }}-scss"
class="ui-tabs-panel scss"
aria-labelledby="ui-id-{{ exampleName | strip }}-scss"
role="tabpanel"
aria-hidden="false"
style="">
{%- for scss in code.scss -%}
<pre><code class="language-scss">{{ scss | strip }}</code></pre>
{%- endfor -%}
</div>
<div
id="example-{{ exampleName | strip }}-sass"
class="ui-tabs-panel sass ui-tabs-panel-inactive ui-tabs-panel-previously-active"
aria-labelledby="ui-id-{{ exampleName | strip }}-sass"
role="tabpanel"
aria-hidden="true"
style="">
{%- for sass in code.sass -%}
<pre><code class="language-sass">{{ sass | strip }}</code></pre>
{%- endfor -%}
</div>
<div
id="example-{{ exampleName | strip }}-css"
class="ui-tabs-panel css ui-tabs-panel-inactive"
aria-labelledby="ui-id-{{ exampleName | strip }}-css"
role="tabpanel"
aria-hidden="true"
style="">
<pre><code class="language-css">{{ code.css | strip }}</code></pre>
</div>
</div>