Skip to main content Skip ad navigationem soUicitudo
in English

obumbratio

Umbras elementis ad umbras utilitates addere vel removere.

Exempla

Dum umbrae componentium in Bootstrap per defaltam debiles sunt et via $enable-shadowseffici potest, etiam umbram celeriter addere vel removere cum box-shadowclassibus utilitatibus nostris potes. Includit subsidium .shadow-nonetres magnitudinum defaultrum (quae variabiles inter se coniungunt).

nulla umbra
Parvus umbra
Iusto umbra
Maior umbra
<div class="shadow-none p-3 mb-5 bg-light rounded">No shadow</div>
<div class="shadow-sm p-3 mb-5 bg-body rounded">Small shadow</div>
<div class="shadow p-3 mb-5 bg-body rounded">Regular shadow</div>
<div class="shadow-lg p-3 mb-5 bg-body rounded">Larger shadow</div>

Sass

Variabilium

$box-shadow:                  0 .5rem 1rem rgba($black, .15);
$box-shadow-sm:               0 .125rem .25rem rgba($black, .075);
$box-shadow-lg:               0 1rem 3rem rgba($black, .175);
$box-shadow-inset:            inset 0 1px 2px rgba($black, .075);

Utilitas API

Vmbra utilitates declarantur in nostris utilitatibus API in scss/_utilities.scss. Utilitatibus uti disce API.

    "shadow": (
      property: box-shadow,
      class: shadow,
      values: (
        null: $box-shadow,
        sm: $box-shadow-sm,
        lg: $box-shadow-lg,
        none: none,
      )
    ),