Browser upgrade

Overview

This component is to be deprecated and moved into templates

This is a prompt which displays as the first element on the page in browsers which aren't supported by MYOB's list of supported browsers. For more information on what browsers are supported, please see the Getting Started section.

The primary purpose for this alert is to direct users to a download page which houses suggestions on browser updates.

Examples

Outdated Browser variation

Example
Hmm, your browser's a little old. Update here for the best experience.
<section class="outdated-browser bg-azure fg-white py-1">
  <div class="outdated-browser__body">
    <div>Hmm, your browser's a little old. <a href="http://outdatedbrowser.com" target="_blank" rel="noopener">Update here</a> for the best experience.</div>
    <button type="button" aria-label="Dismiss alert" class="close" data-close>
      <svg aria-hidden="true" role="img" class="icon icon--cross icon--sm">
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/assets/icons/global/icon.svg#cross"></use>
      </svg>
    </button>
  </div>
</section>

Usage guidelines

We're so sorry, there are currently no usage guidelines for this component 😥

If you feel you can help out your fellow designers by creating usage guidelines for this component, please reach out to #cr-marquee on Slack.

Implementation guidelines

We're so sorry, there are currently no implementation guidelines for this component 😥

If you feel you can help out your fellow designers by creating usage guidelines for this component, please reach out to #cr-marquee on Slack.