Alert

Overview

Basic alert

<div class="alert">This is a simple alert.</div>

Files

https://github.com/davidbrooksio/cwf-lite/blob/master/style/modules/alert.css

• Directorystyle

  • Directorymodules

    • alert.css

Stylesheet

@layer cwf-modules {
  .alert {
    background: var(--alert-background, white);
    border-color: var(--alert-border-color, LightGrey);
    border-radius: var(--alert-border-radius, 0);
    border-style: var(--alert-border-style, solid);
    border-width: var(--alert-border-width, var(--size-2) 1px 1px 1px);
    color: var(--alert-color, inherit);
    display: var(--alert-display, block);
    min-width: var(--alert-min-width, 0);
    padding: var(--alert-padding-top, var(--size-7))
      var(--alert-padding-right, var(--size-7))
      var(--alert-padding-bottom, var(--size-7))
      var(--alert-padding-left, var(--size-7));
    margin: var(--alert-margin-top, 0) var(--alert-margin-right, 0)
      var(--alert-margin-bottom, var(--size-3)) var(--alert-margin-left, 0);
    position: var(--alert-position, relative);
    word-wrap: var(--alert-word-wrap, break-word);
  }
}