{# -- CRITICAL CSS -- #} {% set cacheVal = getCookie('critical-css') %} {% if not cacheVal or craft.app.config.general.devMode %} {{ setCookie('critical-css', now | date_modify("+7 days").timestamp ) }} {% block appInlineCSS %} {% endblock %} {% endif %} {% include '_partials/webpack/webpack-header.html' %}
{# -- pageTitle -- #} {% include '_molecules/pageTitle/_template.html' with { opt: { text: 'Typography' | t, size: 'h1', } } only %}
Headings
{# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'H1: ' ~ headline, size: 'h1' } } only %} {# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'H2: ' ~ headline, size: 'h2' } } only %} {# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'H3: ' ~ headline, size: 'h3' } } only %} {# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'H4: ' ~ headline, size: 'h4' } } only %} {# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'H5: ' ~ headline, size: 'h5' } } only %} {# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'H6: ' ~ headline, size: 'h6' } } only %}
{# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'Full Text Example', size: 'h2' } } only %}
Mixed Text
{# -- richText -- #} {% include '_atoms/richText/_template.html' with { opt: { text: textFull } } only %}
{# -- headline -- #} {% include '_atoms/headline/_template.html' with { opt: { text: 'Font Size Examples', size: 'h2' } } only %} {# -- BLOCK -- #}
Paragraphs MS Respond 2
{# -- richText -- #} {% include '_atoms/richText/_template.html' with { opt: { text: textSimple } } only %}
{# -- BLOCK END -- #} {# -- BLOCK -- #}
Paragraphs MS Respond 1
{# -- richText -- #} {% include '_atoms/richText/_template.html' with { opt: { text: textSimple } } only %}
{# -- BLOCK END -- #} {# -- BLOCK -- #}
Paragraphs MS Respond 0
{# -- richText -- #} {% include '_atoms/richText/_template.html' with { opt: { text: textSimple } } only %}
{# -- BLOCK END -- #} {# -- BLOCK -- #}
Paragraphs MS Respond -1
{# -- richText -- #} {% include '_atoms/richText/_template.html' with { opt: { text: textSimple } } only %}
{# -- BLOCK END -- #} {# -- BLOCK -- #}
Paragraphs MS Respond -2
{# -- richText -- #} {% include '_atoms/richText/_template.html' with { opt: { text: textSimple } } only %}
{# -- BLOCK END -- #} {# Lowercase Glyphs #}
Glyphs Latin Lowercase
{% for glyph in glyphsLower %}
{{ glyph }}
{% endfor %}
{# Uppercase Glyphs #}
Glyphs Latin Uppercase
{% for glyph in glyphsUpper %}
{{ glyph }}
{% endfor %}
{# Ligatures Glyphs #}
Glyphs Latin Ligatures
{% for glyph in glyphsLigatures %}
{{ glyph }}
{% endfor %}
{# Puntuation Glyphs #}
Glyphs Latin Punctuation
{% for glyph in glyphsPunctuation %}
{{ glyph }}
{% endfor %}
{# Currency Glyphs #}
Glyphs Latin Currency
{% for glyph in glyphsCurrency %}
{{ glyph }}
{% endfor %}
{% include '_partials/webpack/webpack-scripts.html' %}