Merge pull request #426 from digitalnsw/method/sponsors-list

Addition of Sponsor list method.

src/docs/content/methods/sponsorship-and-partnership-acknowledgement.hbs

@@ -0,0 +1,131 @@
+---
+title: Sponsorship and partnership acknowledgement
+order: 80
+no-blank: true
+directory: sponsorship and partnership acknowledgement
+intro: Recognising support from NSW government and external organisations.
+figma: https://www.figma.com/design/PVrERKnckLTlJSPk12gbtS/NSW-Digital-Design-System?node-id=105472-25725&t=0VGoE4NnS3DCB8EU-1
+meta-description: NSW Design System sponsorship and partnership acknowledgement usage and application for NSW Government digital products and services. 
+meta-index: true
+---
+
+<h2 id="when-to-use">When to use</h2>
+<p>Use when highlighting NSW Government and external organisations that have generously provided support including sponsorship, partnership, or funding.</p>
+<p>For full information, view the <a href="https://branding.nsw.gov.au/" target="_blank">Sponsorship and Partnership Brand Guidelines</a>.</p>
+
+<h3 id="placement-and-spacing">Placement and spacing</h3>
+<p>Place the section above the footer, or if you are using the additional footer links section, position it directly above that section.</p>
+<p>When the NSW Government logo is displayed next to another logo or Masterbrand descriptor, it should be vertically centered and separated by a minimum distance of 40px.</p>
+
+<figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+  <img src="/assets/images/sponsorship-partnership-logo-dimensions.png" alt="Masterbrand sponsorship and partnership acknowledgment example layout">
+</figure>
+
+<h2 id="nsw-government-waratah-logo">NSW Government Waratah logo</h2>
+<p>Each brand classification has specific requirements for the inclusion of the NSW Government Waratah logo.</p>
+
+<div class="nsw-grid">
+  <div class="nsw-col nsw-col-sm-6">
+    <figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+      <p><strong>Masterbrand or Co-brand</strong><br/><br/>Do not require the Waratah logo as it's already included in the header. Use a 'NSW Government' text label as the first element, on a separate line, before any Masterbrand descriptor.<br/>
+      </p>
+      <img class="nsw-p-top-md" src="/assets/images/sponsorship-partnership-standard-waratah-requirements.png" alt="Endorsed exmaple with logo coupled in header">
+    </figure>
+  </div>
+  <div class="nsw-col nsw-col-sm-6">
+    <figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+      <p><strong>Endorsed, Independent and Stand-alone</strong><br/><br/>In cases where the NSW Government Waratah is not included in the header, position as the first element among the support logos.<br/><br/>
+      </p>
+      <img class="nsw-p-top-md" src="/assets/images/sponsorship-partnership-decoupled-waratah-requirements.png" alt="Endorsed exmaple with logo decoupled in footer">
+    </figure>
+  </div>
+</div>
+
+<h3 id="sizing">Sizing</h3>
+<p>The NSW Government Waratah logo should be 76px in height on large screens (≥ 992px), and 48px in height on small screens (< 991px) and should never be smaller than the support logos.</p>
+<p>For full NSW Government Waratah logo requirements for your brand classification view the <a href="https://branding.nsw.gov.au/" target="_blank">Sponsorship and Partnership Brand Guidelines</a>.</p>
+
+<h2 id="masterbrand-descriptors">Masterbrand descriptors</h2>
+<p>Use Masterbrand descriptors when Masterbrand agencies need to be recognised, as text-only links.</p>
+
+<h4>Example with NSW Government Waratah logo:</h4>
+<figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+  <img src="/assets/images/sponsorship-partnership-masterbrand-descriptors.png" alt="Masterbrand sponsor list example layout">
+</figure>
+
+<p>Implementation examples:</p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-masterbrand-descriptors-waratah-large.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download large screen example</span>
+</a></p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-masterbrand-descriptors-waratah-small.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download small screen example</span>
+</a><p />
+
+<h4 class="nsw-m-top-lg">Example without NSW Government Waratah logo (with NSW Government text label):</h4>
+<figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+  <img src="/assets/images/sponsorship-partnership-masterbrand-descriptors-government-label.png" alt="Masterbrand sponsor list example layout">
+</figure>
+
+<p>Implementation examples:</p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-masterbrand-descriptors-without-waratah-large.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download large screen example</span>
+</a></p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-masterbrand-descriptors-without-waratah-small.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download small screen example</span>
+</a></p>
+
+<p class="nsw-m-top-lg">For full Masterbrand descriptor requirements for your brand classification view the <a href="https://branding.nsw.gov.au/" target="_blank">Sponsorship and Partnership Brand Guidelines</a>.</p>
+
+<h2 id="support-logos">Support logos</h2>
+
+<h3 id="arrangement">Arrangement</h3>
+<p>Order is based on hierarchy of the NSW Government Brand Framework:</p>
+<ol>
+  <li>Masterbrand (used as a text text-only descriptor)</li>
+  <li>Co-brand</li>
+  <li>Endorsed</li>
+  <li>Independent</li>
+  <li>Stand-alone</li>
+</ol>
+<p>External brand logos can also be included after the NSW Government logos.</p>
+<p>The arrangement of logos follows the hierarchy of the NSW Government Brand Framework, however when necessary, they can be re-ordered  based on the scale of funding or contribution.</p>
+<p>For more information on support logo arrangement requirements for your brand classification view the <a href="https://branding.nsw.gov.au/" target="_blank">Sponsorship and Partnership Brand Guidelines</a>.</p>
+
+<h3>Sizing</h3>
+<p>The support logos should be 76px in height on large screens (≥ 992px), and maintain the 76px in height on small screens (< 991px), displayed in two equal columns.</p>
+<p>These logos have been designed to ensure accessibility and clarity at all sizes.</p>
+<p>For full logo requirements for your brand classification view the <a href="https://branding.nsw.gov.au/" target="_blank">Sponsorship and Partnership Brand Guidelines</a>.</p>
+
+<h4>Example with NSW Government Waratah logo:</h4>
+<figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+  <img src="/assets/images/sponsorship-partnership-masterbrand-support-logos-w-waratah.png" alt="Example with NSW Government Waratah logo">
+</figure>
+
+<p>Implementation examples:</p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-logos-waratah-large.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download large screen example</span>
+</a></p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-logos-waratah-small.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download small screen example</span>
+</a></p>
+
+<h4 class="nsw-m-top-lg">Example with NSW Government Waratah logo:</h4>
+<figure class="nsw-media nsw-media--transparent nsw-m-bottom-xs">
+  <img src="/assets/images/sponsorship-partnership-masterbrand-support-logos-without-waratah.png" alt="Example without NSW Government Waratah logo">
+</figure>
+
+<p>Implementation examples:</p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-logos-without-waratah-large.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download large screen example</span>
+</a></p>
+<p><a class="js-link" href="/assets/images/sponsorship-partners-logos-without-waratah-small.png">
+  <span class="material-icons nsw-material-icons" title="download file">file_download</span><span>Download small screen example</span>
+</a></p>
+
+<div class="nsw-in-page-alert nsw-in-page-alert--info nsw-m-y-lg">
+  <span class="material-icons nsw-material-icons nsw-in-page-alert__icon" focusable="false" aria-hidden="true">info</span>
+  <div class="nsw-in-page-alert__content">
+    <p class="nsw-h5">Looking for the code examples?</p>
+    <p>You can view the full size examples below. If you have any questions reach out to us at <a href='mailto:digital@customerservice.nsw.gov.au'>digital@customerservice.nsw.gov.au</a>.</p>
+  </div>
+</div>