@vcl/vcl/notification/demo/example-warning.html

The whole VCL in one package

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.1.1/css/all.css">

<div class="notification warning" role="alert">
  <div class="notification-header row align-items-center">
    <span class="flex">Warning - Header with Button</span>
    <button class="button transparent square"><i class="fas fa-times"></i></button>
  </div>
  <div class="notification-icon-container">
    <span class="icon notification-icon fas fa-exclamation-circle"></span>
  </div>
  <div class="notification-content">
    <ul>
      <li>The following users could not be found:
      <ul>
        <li>Andreas Mustermann</li>
        <li>Ralf Maier</li>
      </ul>
      </li>
    </ul>
  </div>
  <div class="notification-footer row align-items-center">
    <span>Footer</span>
  </div>
</div>