Skip to main content

This is a new service - your feedback will help us to improve it.

Phase indicators


About

What does it do?

  • Helps users to identify when a service is in a development phase

When to use it?

  • Every service that has not passed its public beta service assessment must have a phase indicator
  • Within the header pattern
  • Within the phase banner pattern

A service can either be in Alpha (prototype stage) or Beta (when it is on a publicly accessible website).

Component example

HTML Markup

<a href="https://wmcadigital.github.io/wmca-design-system/" target="_self" class="wmcads-phase-indicator" title="Beta homepage of West Midlands Combined Authority Design System">
  Beta
</a>

Component example

HTML Markup

<div class="wmcads-grid wmcads-banner-container">
  <div class="wmcads-col-auto wmcads-float-left wmcads-m-r-xsm">
    <a href="https://wmcadigital.github.io/wmca-design-system/" target="_self" class="wmcads-phase-indicator" title="Beta homepage of West Midlands Combined Authority Design System">
        Beta
      </a>
  </div>
  <div class="wmcads-col-auto">
     <p class="wmcads-banner-container__text">
      <a href="#" title="Link title" target="_blank" class="wmcads-link" rel="noopener noreferrer">Try our projects page
        
      </a>
     </p>
  </div>
</div>