@dsrc-cm/core 0.1.2 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +56 -4
- package/dist/dsrc.css +549 -41
- package/dist/dsrc.min.css +1 -1
- package/package.json +1 -1
- package/src/utilities/utilities.css +240 -5
package/README.md
CHANGED
|
@@ -31,7 +31,7 @@ import '@dsrc-cm/core';
|
|
|
31
31
|
@import '@dsrc-cm/core/src/components/alert/alert.css';
|
|
32
32
|
```
|
|
33
33
|
|
|
34
|
-
## Composants disponibles
|
|
34
|
+
## Composants disponibles (37)
|
|
35
35
|
|
|
36
36
|
| Composant | Classe | Description |
|
|
37
37
|
|-----------|--------|-------------|
|
|
@@ -73,7 +73,7 @@ import '@dsrc-cm/core';
|
|
|
73
73
|
| Translate | `.dsrc-translate` | Sélecteur de langue FR/EN |
|
|
74
74
|
| Upload | `.dsrc-upload` | Zone d'envoi de fichier |
|
|
75
75
|
|
|
76
|
-
## Layouts
|
|
76
|
+
## Layouts (7)
|
|
77
77
|
|
|
78
78
|
| Layout | Classe | Description |
|
|
79
79
|
|--------|--------|-------------|
|
|
@@ -85,6 +85,55 @@ import '@dsrc-cm/core';
|
|
|
85
85
|
| Main | `.dsrc-main` | Contenu principal |
|
|
86
86
|
| Navigation | `.dsrc-nav` | Barre de navigation |
|
|
87
87
|
|
|
88
|
+
## Classes utilitaires (189)
|
|
89
|
+
|
|
90
|
+
Le DSRC inclut des classes utilitaires pour le prototypage rapide :
|
|
91
|
+
|
|
92
|
+
### Couleurs de texte
|
|
93
|
+
|
|
94
|
+
```html
|
|
95
|
+
<!-- Sémantiques (recommandé) -->
|
|
96
|
+
<p class="dsrc-text-primary">Vert principal</p>
|
|
97
|
+
<p class="dsrc-text-white">Blanc</p>
|
|
98
|
+
<p class="dsrc-text-error">Erreur</p>
|
|
99
|
+
<p class="dsrc-text-secondary">Texte secondaire</p>
|
|
100
|
+
|
|
101
|
+
<!-- Par palette (50-900) -->
|
|
102
|
+
<p class="dsrc-text-green-500">Vert 500</p>
|
|
103
|
+
<p class="dsrc-text-red-400">Rouge drapeau</p>
|
|
104
|
+
<p class="dsrc-text-blue-700">Bleu info</p>
|
|
105
|
+
```
|
|
106
|
+
|
|
107
|
+
### Couleurs de fond
|
|
108
|
+
|
|
109
|
+
```html
|
|
110
|
+
<div class="dsrc-bg-primary dsrc-text-white">Fond vert</div>
|
|
111
|
+
<div class="dsrc-bg-success">Fond succès</div>
|
|
112
|
+
<div class="dsrc-bg-green-50">Fond vert clair</div>
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
### Espacement, flexbox, display, bordures
|
|
116
|
+
|
|
117
|
+
```html
|
|
118
|
+
<div class="dsrc-p-4 dsrc-mb-2">Padding 16px, margin-bottom 8px</div>
|
|
119
|
+
<div class="dsrc-d-flex dsrc-gap-3 dsrc-items-center">Flexbox</div>
|
|
120
|
+
<div class="dsrc-border dsrc-rounded-lg">Bordure + radius</div>
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
Les 8 palettes de couleurs : **green**, **red**, **yellow**, **blue**, **gray**, **purple**, **teal**, **orange** — chacune avec des nuances de 50 à 900.
|
|
124
|
+
|
|
125
|
+
## Système de couleurs (3 couches)
|
|
126
|
+
|
|
127
|
+
```
|
|
128
|
+
Primitifs --dsrc-color-green-500 (valeur brute)
|
|
129
|
+
↓
|
|
130
|
+
Sémantique --dsrc-color-primary (décision de design)
|
|
131
|
+
↓
|
|
132
|
+
Compat --dsrc-color-primaire (ancien nom FR)
|
|
133
|
+
```
|
|
134
|
+
|
|
135
|
+
Les anciens noms français (`--dsrc-color-primaire`, `dsrc-text-blanc`, etc.) fonctionnent toujours.
|
|
136
|
+
|
|
88
137
|
## Exemple rapide
|
|
89
138
|
|
|
90
139
|
```html
|
|
@@ -101,6 +150,9 @@ import '@dsrc-cm/core';
|
|
|
101
150
|
<p class="dsrc-alert__title">Succès</p>
|
|
102
151
|
<p>Votre demande a été enregistrée.</p>
|
|
103
152
|
</div>
|
|
153
|
+
|
|
154
|
+
<h2 class="dsrc-text-primary dsrc-text-bold">Titre en vert</h2>
|
|
155
|
+
<p class="dsrc-text-secondary dsrc-mb-4">Texte secondaire avec marge</p>
|
|
104
156
|
</body>
|
|
105
157
|
</html>
|
|
106
158
|
```
|
|
@@ -117,8 +169,8 @@ import '@dsrc-cm/core';
|
|
|
117
169
|
|
|
118
170
|
| Fichier | Taille |
|
|
119
171
|
|---------|--------|
|
|
120
|
-
| `dsrc.css` | ~
|
|
121
|
-
| `dsrc.min.css` | ~
|
|
172
|
+
| `dsrc.css` | ~330 KB |
|
|
173
|
+
| `dsrc.min.css` | ~174 KB |
|
|
122
174
|
|
|
123
175
|
## Licence
|
|
124
176
|
|