Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="Flash Flash--warning">Here is a warning!</div>
<div class="Flash Flash--info">Boring info.</div>
<div class="Flash Flash--success">You did something right!</div>
<div class="Flash Flash--danger">DANGER!</div>

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

$warning: orange;
$info: blue;
$success: green;
$danger: red;

$flashes: (warning $warning),
  (info $info),
  (success $success),
  (danger $danger);

@each $status in $flashes {
  .Flash--#{nth($status, 1)} {
    background: nth($status, 2);
  }
}

SassMeister-output.css

.Flash--warning {
  background: orange;
}

.Flash--info {
  background: blue;
}

.Flash--success {
  background: green;
}

.Flash--danger {
  background: red;
}

SassMeister-rendered.html

<div class="Flash Flash--warning">Here is a warning!</div>
<div class="Flash Flash--info">Boring info.</div>
<div class="Flash Flash--success">You did something right!</div>
<div class="Flash Flash--danger">DANGER!</div>