Vous êtesEntreprise
Vous êtes Entreprise
DS Solaris
Solaris Colors
This is a work in progress.
You should absolutely improve it if you have the necessary information.
Color stacks
| Color | Color stack | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Gray | $gray-900 | $gray-800 | $gray-700 | $gray-600 | $gray-500 | $gray-400 | $gray-300 | $gray-200 | $gray-100 |
| Red | $red-900 | $red-800 | $red-700 | $red-600 | $red-500 | $red-400 | $red-300 | $red-200 | $red-100 |
| Orange | $orange-900 | $orange-800 | $orange-700 | $orange-600 | $orange-500 | $orange-400 | $orange-300 | $orange-200 | $orange-100 |
| Yellow | $yellow-900 | $yellow-800 | $yellow-700 | $yellow-600 | $yellow-500 | $yellow-400 | $yellow-300 | $yellow-200 | $yellow-100 |
| Green | $green-900 | $green-800 | $green-700 | $green-600 | $green-500 | $green-400 | $green-300 | $green-200 | $green-100 |
| Blue | $blue-900 | $blue-800 | $blue-700 | $blue-600 | $blue-500 | $blue-400 | $blue-300 | $blue-200 | $blue-100 |
| Pink | $pink-900 | $pink-800 | $pink-700 | $pink-600 | $pink-500 | $pink-400 | $pink-300 | $pink-200 | $pink-100 |
Common variables
$primary-brand: $yellow-500;
$secondary-brand: $blue-500;
$error-dark: $red-700;
$error: $red-500;
$error-light: $red-100;
$warning-dark: $orange-700;
$warning: $orange-500;
$warning-light: $orange-100;
$success-dark: $green-700;
$success: $green-500;
$success-light: $green-100;
Form components
Range Datepicker
| Variant | Label inside | Label outside |
|---|---|---|
| Default |
|
|
|
|
|
|
| Error |
|
|
|
|
|
|
| Warning |
|
|
|
|
|
|
| Disabeld |
|
|
|
|
|
|
| Read-only |
|
|
|
|
|
- Lun
- Mar
- Mer
- Jeu
- Ven
- Sam
- Dim
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- Lun
- Mar
- Mer
- Jeu
- Ven
- Sam
- Dim
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31