SIA Web Design Library

Program module: Full

No notes defined.

<article class='c-program_module program_module type-program_module c-program_module--full'>
                        <div class='r-page-lead
        '>
                            <div class='c-hero c-hero--video c-page-lead__hero'>
                            </div>

                            <header class='c-section-header'>

                                <p class='c-section-header__supra'><span><a href='#'>Tool</a></span></p>

                                <h1 class='c-heading'>
                                    Milestone Planning Tool
                                </h1>

                            </header>

                            <div class='c-lead'>
                                <ul>
                                    <li>you haven't built an MVP yet
                                </ul>
                            </div>
                        </div>
                        <div class='l-container--max-medium'>
                            <div class=''>
                                <div class='c-program_module__meta '>
                                    <p>The tool: As you can see it is an empty table with several fields. First there is the field „Project“. .</p>
                                </div>
                            </div>
                        </div>
                    </article>
 
{% if program_module_parts %}
    {% set hasSidebar = true %}
    {% set containerClass = 'container-fluid' %}
    {% set rowClass = 'row justify-content-xl-end' %}
    {% set contentClass = 'col-12 col-md-10 offset-md-1 col-lg-8 offset-lg-0 col-xl-10' %}
    {% set sidebarClass = 'col-12 col-md-10 offset-md-1 col-lg-4 offset-lg-0 col-xl-2' %}
{% else %}
    {% set containerClass = 'l-container--max-medium' %}
    {% set hasSidebar = false %}
    {% set rowClass = '' %}
    {% set contentClass = '' %}
    {% set sidebarClass = '' %}
{% endif %}

<article class='{{ get_entity_class( entityType, display ) }}'>
    {% include get_template( 'page-lead', 'region' ) with pageLead %}

    <div class='{{ containerClass }}'>
        <div class='{{ rowClass }}'>
            {% if hasSidebar or not program_module_parts %}
                <div class='c-{{ entityType }}__meta {{ sidebarClass }}'>
                    {% if content %}
                        {{ content|raw }}
                    {% endif %}
                    {% if sharing %}
                        {% include get_template( 'social-links', 'unit' ) with sharing %}
                    {% endif %}
                    {% for field in fields %}
                        {% include get_template( 'generic-field', 'unit' ) with field %}       
                    {% endfor %}
                </div>
            {% endif %}
            {% if program_module_parts %}
                <div class='c-{{ entityType }}__program_module_parts {{ contentClass }}'>
                    {% if content and not hasSidebar %}
                        {{ content|raw }}
                    {% endif %}

                    {% if program_module_parts %} 
                        {{ program_module_parts }}
                    {% endif %}
                </div>
            {% endif %}
        </div>
    </div>
    {% if links or button %}
        {% include get_template( 'app-bar', 'region' ) with {
            links: links,
            button: button
        } %}
    {% endif %}
</article>
 
{
  "theme": "education",
  "entityType": "program_module",
  "display": {
    "view_mode": "full"
  },
  "heading": {
    "text": "Milestone Planning Tool"
  },
  "content": "<p>The tool: As you can see it is an empty table with several fields. First there is the field „Project“. .</p>",
  "pageLead": {
    "hero": {
      "display": {
        "component": "page-lead",
        "modifiers": [
          "video"
        ]
      },
      "image": null
    },
    "sectionHeader": {
      "supraheading": "<a href='#'>Tool</a>",
      "heading": {
        "text": "Milestone Planning Tool"
      }
    },
    "lead": {
      "content": "<ul><li>you haven't built an MVP yet</ul>"
    }
  },
  "url": null
}