Skip to main content Skip ad navigationem soUicitudo
in English

Colorum

Deferat significationem colorcum paucis colorum generibus utilitatem. Sustentationem stylis inclusis nexus cum civitatibus etiam hover.

Colorum

Colo colui cultum textus cum utilitate colorat. Si nexus colorare vis, .link-*adiutoriis generibus uti potes, quae habent :hoverac :focuscivitates.

.text-primaria

.text secundae

.text-successus

.text-periculum

.text-admonitio

.text-info

.text-lucis

.text-tenebras

.text-corporis

.text-muted

.text-alba

.text-nigrae-50

.text-albo-50

<p class="text-primary">.text-primary</p>
<p class="text-secondary">.text-secondary</p>
<p class="text-success">.text-success</p>
<p class="text-danger">.text-danger</p>
<p class="text-warning bg-dark">.text-warning</p>
<p class="text-info bg-dark">.text-info</p>
<p class="text-light bg-dark">.text-light</p>
<p class="text-dark">.text-dark</p>
<p class="text-body">.text-body</p>
<p class="text-muted">.text-muted</p>
<p class="text-white bg-dark">.text-white</p>
<p class="text-black-50">.text-black-50</p>
<p class="text-white-50 bg-dark">.text-white-50</p>
Deferre significatio technologiae adiuvandae

Color usus ad significationem addere tantum praebet indicationem visualem, quae utentibus technologiarum adiuvantium - sicut lectorum tegumentum. Ut informationes colore notatae sint vel ex ipso contento perspicuae (exempli gratia textus visibilis), vel per medium includi alterum, sicut textus additus occultus cum .visually-hiddengenere.

Specification

Interdum classes contextuales applicari non possunt propter speciem alterius selectoris. In quibusdam casibus satis laboratum est involvere contentus elemento <div>vel semantico cum classe desiderato.

Sass

Praeter sequentes functiones Sass, considera lectionem nostram inclusam proprietates CSS consuetudinis (aka CSS variabiles) pro coloribus et magis.

Variabilium

Plurimae colorutilitates ex nostro argumento colore generantur, repositum ex variabilium genere colorum palette.

$blue:    #0d6efd;
$indigo:  #6610f2;
$purple:  #6f42c1;
$pink:    #d63384;
$red:     #dc3545;
$orange:  #fd7e14;
$yellow:  #ffc107;
$green:   #198754;
$teal:    #20c997;
$cyan:    #0dcaf0;
$primary:       $blue;
$secondary:     $gray-600;
$success:       $green;
$info:          $cyan;
$warning:       $yellow;
$danger:        $red;
$light:         $gray-100;
$dark:          $gray-900;

Colores cineraceorum etiam in promptu sunt, sed tantum subset usus ad quaslibet utilitates generandas.

$white:    #fff;
$gray-100: #f8f9fa;
$gray-200: #e9ecef;
$gray-300: #dee2e6;
$gray-400: #ced4da;
$gray-500: #adb5bd;
$gray-600: #6c757d;
$gray-700: #495057;
$gray-800: #343a40;
$gray-900: #212529;
$black:    #000;

Map

Colores thema deinde in mappam Sass ponuntur, ut eos fascias ad utilitates nostras, componentes adiectiores, generare possimus, et plus.

$theme-colors: (
  "primary":    $primary,
  "secondary":  $secondary,
  "success":    $success,
  "info":       $info,
  "warning":    $warning,
  "danger":     $danger,
  "light":      $light,
  "dark":       $dark
);

Colores cineraceorum etiam in promptu sunt ut tabula Sass. Haec tabula ad nullas utilitates generandas adhibetur.

$grays: (
  "100": $gray-100,
  "200": $gray-200,
  "300": $gray-300,
  "400": $gray-400,
  "500": $gray-500,
  "600": $gray-600,
  "700": $gray-700,
  "800": $gray-800,
  "900": $gray-900
);

Utilitas API

Color utilitas declaratur in nostris utilitatibus API in scss/_utilities.scss. Utilitatibus uti disce API.

    "color": (
      property: color,
      class: text,
      values: map-merge(
        $theme-colors,
        (
          "white": $white,
          "body": $body-color,
          "muted": $text-muted,
          "black-50": rgba($black, .5),
          "white-50": rgba($white, .5),
          "reset": inherit,
        )
      )
    ),