Background Patterns
Utilities for adding distinctive background patterns for Department and Call Centers.
Usage #
Use d-bgg-pattern-{pattern}-{dark|light} to apply a pattern.
<div class="... d-bgg-pattern d-bgg-pattern-slanted-stripes-dark">...</div>
<div class="... d-bgg-pattern d-bgg-pattern-dots-circles-light">...</div>
Classes #
Class
|
Output
|
|---|---|
| .d-bgg-pattern-blob-dark |
--bgg-pattern: --bgg-pattern-blob-dark;
|
| .d-bgg-pattern-chevrons-dark |
--bgg-pattern: --bgg-pattern-chevrons-dark;
|
| .d-bgg-pattern-crosses-dark |
--bgg-pattern: --bgg-pattern-crosses-dark;
|
| .d-bgg-pattern-crosshatch-dark |
--bgg-pattern: --bgg-pattern-crosshatch-dark;
|
| .d-bgg-pattern-dot-dash-dark |
--bgg-pattern: --bgg-pattern-dot-dash-dark;
|
| .d-bgg-pattern-dots-circles-dark |
--bgg-pattern: --bgg-pattern-dots-circles-dark;
|
| .d-bgg-pattern-horz-stripes-dark |
--bgg-pattern: --bgg-pattern-horz-stripes-dark;
|
| .d-bgg-pattern-slanted-stripes-dark |
--bgg-pattern: --bgg-pattern-slanted-stripes-dark;
|
| .d-bgg-pattern-steps-dark |
--bgg-pattern: --bgg-pattern-steps-dark;
|
| .d-bgg-pattern-stripe-dark |
--bgg-pattern: --bgg-pattern-stripe-dark;
|
| .d-bgg-pattern-blob-light |
--bgg-pattern: --bgg-pattern-blob-light;
|
| .d-bgg-pattern-chevrons-light |
--bgg-pattern: --bgg-pattern-chevrons-light;
|
| .d-bgg-pattern-crosses-light |
--bgg-pattern: --bgg-pattern-crosses-light;
|
| .d-bgg-pattern-crosshatch-light |
--bgg-pattern: --bgg-pattern-crosshatch-light;
|
| .d-bgg-pattern-dot-dash-light |
--bgg-pattern: --bgg-pattern-dot-dash-light;
|
| .d-bgg-pattern-dots-circles-light |
--bgg-pattern: --bgg-pattern-dots-circles-light;
|
| .d-bgg-pattern-horz-stripes-light |
--bgg-pattern: --bgg-pattern-horz-stripes-light;
|
| .d-bgg-pattern-slanted-stripes-light |
--bgg-pattern: --bgg-pattern-slanted-stripes-light;
|
| .d-bgg-pattern-steps-light |
--bgg-pattern: --bgg-pattern-steps-light;
|
| .d-bgg-pattern-stripe-light |
--bgg-pattern: --bgg-pattern-stripe-light;
|