Open or Close the menu

Asbestos in NSW

  • 0Overview
  • 1Typography
  • 2Icons
  • 3Forms
  • 4Global components
  • 5Content components
  • 6Grouped components
  • 7Templates

4.8 Footer View in a new window

Example

Section Link

Section Link

  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link

Section Link

Section Link

  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link

Section Link

Section Link

  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link

Section Link

Section Link

  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link
  • Highlight link

We pay respect to the Traditional Custodians and First Peoples of NSW, and acknowledge their continued connection to their country and culture.


  • Tertiary
  • Tertiary
  • Tertiary
  • Tertiary

Copyright © 2019

Markup
{% set data = data|default({
	"respectText": "We pay respect to the Traditional Custodians and First Peoples of NSW, and acknowledge their continued connection to their country and culture.",
  "copyright": "Copyright © 2019",
  "svgUrl":".",
  "sectionLinks": [
    {
      "title": "Section Link",
      "url": "#",
      "links": [
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        }
      ]
    },
    {
      "title": "Section Link",
      "url": "#",
      "links": [
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        }
      ]
    },
    {
      "title": "Section Link",
      "url": "#",
      "links": [
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        }
      ]
    },
    {
      "title": "Section Link",
      "url": "#",
      "links": [
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        },
        {
          "text": "Highlight link",
          "url": "#"
        }
      ]
    }
  ],
	"footerLinks": [
    {
      "text": "Tertiary",
      "url": "#"
    },
    {
      "text": "Tertiary",
      "url": "#"
    },
    {
      "text": "Tertiary",
      "url": "#"
    },
    {
      "text": "Tertiary",
      "url": "#"
    }
  ]
}) %}

<footer class="nsw-footer {{modifier_class}}">
  <div class="nsw-footer__upper">
    <div class="nsw-container section-links">
      {% for item in data.sectionLinks %}
        <div class="section-links__group">
          <h3 class="section-links__heading  d-sm-block d-none"><a href="{{item.url}}">{{item.title}}</a></h3>
          <h3 class="section-links__heading d-sm-none section-links__accordian" data-toggle="collapse" data-target="#footer-{{ loop.index0 }}" aria-expanded="false" aria-controls="footer-{{ loop.index0 }}">
            <span>{{item.title}}</span>
            <img src="{{data.svgUrl}}/images/chevron-blue.svg">
            </h3>
            <nav role="navigation" class="section-links__navigation">
              <ul class="section-links__list collapse"  aria-labelledby="footer-{{ loop.index0 }}" id="footer-{{ loop.index0 }}">
                {% for link in item.links %}
                  <li class="section-links__item"><a href="{{link.url}}">{{link.text}}</a></li>
                {% endfor %}
              </ul>
            </nav>
        </div>
      {% endfor %}
    </div>
  </div>
  <div class="nsw-footer__lower">
    <div class="nsw-container">
      <p>{{data.respectText}}</p>
      <hr>
      <ul class="nsw-footer-links">
        {% for link in data.footerLinks %}
          <li class="nsw-footer-links__item">
            <a href="{{link.url}}" class="nsw-footer-links__link">{{link.text}}</a>
          </li>
        {% endfor %}
      </ul>
      <div class="nsw-footer__info">
        <p class="nsw-footer__copyright">{{data.copyright}}</p>
      </div>
    </div>
  </div>
</footer>