MentorKit Pattern Library

Headline: Default 

<div class="text-center mb-8 lg:mb-12">
    <h2 class="text-6xl  block font-heading font-bold leading-tight text-bravo">Heading text</h2>

    <div class="prose xl:prose-lg mt-4 lg:mt-6 max-w-screen-sm mx-auto">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
    </div>

</div>
 
{% if headingColour %}
    {% set headingColourClass = headingColour %}
{% else %}
    {% set headingColourClass = "text-bravo" %}
{% endif %}

{% if textAlign == 'left' %}
    {% set textAlignClass = 'text-left' %}
    {% set spacingClasses = '' %}
{% elseif textAlign == 'right' %}
    {% set textAlignClass = 'text-right' %}
    {% set spacingClasses = '' %}
{% else %}
    {% set textAlignClass = 'text-center' %}
    {% set spacingClasses = 'max-w-screen-sm mx-auto' %}
{% endif %}

{% if heading or summary %}
    <div class="{{textAlignClass}} mb-8 lg:mb-12">
        <h2 class="text-6xl  block font-heading font-bold leading-tight {{headingColourClass}}">{{ heading }}</h2>
        {% if summary %}
            <div class="prose xl:prose-lg mt-4 lg:mt-6 {{spacingClasses}}">
                <p>{{ summary }}</p>
            </div>
        {% endif %}
    </div>
{% endif %}
 
{
  "siteName": "MentorKit Pattern Library",
  "heading": "Heading text",
  "summary": "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco."
}

No notes defined.