Loud process diagram

Description

It does not highlight individual, disconnected benefits like a feature list but rather helps describe the user's journey and show the process as a whole.

Activate Sass component

In order to have the styling of this component available, you need to include it in your project. After including the Radius library in your main ./index.scss file, add this snippet:

@include radius-component-loud-process-diagram;

Link to Abstract/Sketch file

Download Sketch / Abstract file

Usage

Usage example

Code example

<ol class="loud-process-diagram">
  <li class="loud-process-diagram__item">
    <div class="loud-process-diagram__content">
      <div class="placeholder-component"></div>
    </div>
  </li>

  <li class="loud-process-diagram__item">
    <div class="loud-process-diagram__content">
      <div class="placeholder-component"></div>
    </div>
  </li>

  <li class="loud-process-diagram__item">
    <div class="loud-process-diagram__content">
      <div class="placeholder-component"></div>
    </div>
  </li>

  <li class="loud-process-diagram__item">
    <div class="loud-process-diagram__content">
      <div class="placeholder-component"></div>
    </div>
  </li>

  <li class="loud-process-diagram__item">
    <div class="loud-process-diagram__content">
      <div class="placeholder-component"></div>
    </div>
  </li>
</ol>