it-osu-web / it-osu-pl

IT@OSU Pattern Lab
https://it-osu-web.github.io/it-osu-pl/
3 stars 1 forks source link

Update region and page templates #246

Closed mel-miller closed 2 years ago

mel-miller commented 2 years ago
{#
/**
 * @file
 * Theme override to display a region.
 *
 * Available variables:
 * - content: The content for this region, typically blocks.
 * - attributes: HTML attributes for the region <div>.
 * - region: The name of the region variable as defined in the theme's
 *   .info.yml file.
 *
 * @see template_preprocess_region()
 */
#}

{% if pl %}
    {% set region_name = region_name %}
{% else %}
    {% set region_name = region|clean_class %}
{% endif %}

{%
  set classes = [
    'region',
    'region-' ~ region_name
  ]
%}

{# Add names of regions that should go full width. #}
{% set full_width = ['hero', 'content-after'] %}

{# Add names of regions that should not have wrappers. #}
{% set no_wrapper = ['content', 'sidebar-1', 'sidebar-2'] %}

{% if content %}
    {% if region_name in no_wrapper %}
        <div{{attributes.addClass(classes)}}>
            {{ content }}
        </div>
    {% else %}
        <div class='layout__wrapper layout__wrapper--{{ region_name }}'>
            <div class='layout__inner layout__inner--{{ region_name }}{% if region_name not in full_width %} grid-container {% endif %}'>
                <div{{attributes.addClass(classes)}}>
                    {{ content }}
                </div>
            </div>
        </div>
    {% endif %}
{% endif %}
mel-miller commented 2 years ago
<div class="layout__wrapper layout__wrapper--main">
    <div class="grid-container">
        <div class="main__inner grid-x grid-margin-x">

            {% if page.sidebar_1 %}
                <aside class="sidebar sidebar--1 cell small-12 medium-3" role="complementary">
                    <div class="sidebar__inner sidebar__inner--1">
                        {% block sidebar_1 %}
                            {{ page.sidebar_1 }}
                        {% endblock %}
                    </div>
                </aside>
            {% endif %}

            <main id="main-content" class="content cell small-12 medium-auto">
                {% block content %}
                    {{ page.content }}
                {% endblock %}
            </main>

            {% if page.sidebar_2 %}
                <aside class="sidebar sidebar--2 cell small-12 medium-3" role="complementary">
                    <div class="sidebar__inner sidebar__inner--2">
                        {% block sidebar_2 %}
                            {{ page.sidebar_2 }}
                        {% endblock %}
                    </div>
                </aside>
            {% endif %}

        </div>
    </div>
</div>

{% block content_after %}
    {{ page.content_after }}
{% endblock %}
mel-miller commented 2 years ago

Will be in next version.