@new-ui/colors 1.2.6 → 1.2.7

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.
Files changed (11) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.css.map +1 -1
  3. package/package.json +1 -1
  4. package/src/_theme-dark--cold.scss +201 -0
  5. package/src/_theme-dark--warm.scss +201 -0
  6. package/src/_theme-dark.scss +191 -0
  7. package/src/_theme-light--cold.scss +78 -0
  8. package/src/_theme-light--warm.scss +78 -0
  9. package/src/_theme-light.scss +67 -0
  10. package/src/_utilities.scss +39 -36
  11. package/src/index.scss +3 -0
package/src/_utilities.scss CHANGED
@@ -237,55 +237,58 @@
237
237
  .nu-u-text-grey9 {color: var(--grey9);}
238
238
  .nu-u-text-grey10 {color: var(--grey10);}
239
239
 
240
- .nu-u-bg {background-color: var(--white);}
241
- .nu-u-bg-secondary {background-color: var(--grey1);}
242
- .nu-u-bg-hover {background-color: var(--grey1);}
243
- .nu-u-bg-selected {background-color: var(--grey2);}
244
- .nu-u-bg-selected-hover {background-color: var(--grey3);}
245
- .nu-u-bg-red {background-color: var(--red1);}
246
- .nu-u-bg-orange {background-color: var(--orange1);}
247
- .nu-u-bg-yellow {background-color: var(--yellow1);}
248
- .nu-u-bg-green {background-color: var(--green);}
249
- .nu-u-bg-mint {background-color: var(--mint);}
250
- .nu-u-bg-teal {background-color: var(--teal1);}
251
- .nu-u-bg-cyan {background-color: var(--cyan1);}
252
- .nu-u-bg-blue {background-color: var(--blue1);}
253
- .nu-u-bg-indigo {background-color: var(--indigo1);}
254
- .nu-u-bg-purple {background-color: var(--purple1);}
255
- .nu-u-bg-pink {background-color: var(--pink);}
256
- .nu-u-bg-brown {background-color: var(--brown);}
240
+ .nu-u-bg {background-color: var(--background);}
241
+ .nu-u-bg-secondary {background-color: var(--background-secondary);}
242
+ .nu-u-bg-hover {background-color: var(--background-hover);}
243
+ .nu-u-bg-selected {background-color: var(--background-selected);}
244
+ .nu-u-bg-selected-hover {background-color: var(--background-selected-hover);}
245
+ .nu-u-bg-red {background-color: var(--background-red);}
246
+ .nu-u-bg-orange {background-color: var(--background-orange);}
247
+ .nu-u-bg-yellow {background-color: var(--background-yellow);}
248
+ .nu-u-bg-green {background-color: var(--background-green);}
249
+ .nu-u-bg-mint {background-color: var(--background-mint);}
250
+ .nu-u-bg-teal {background-color: var(--background-teal);}
251
+ .nu-u-bg-cyan {background-color: var(--background-cyan);}
252
+ .nu-u-bg-blue {background-color: var(--background-blue);}
253
+ .nu-u-bg-indigo {background-color: var(--background-indigo);}
254
+ .nu-u-bg-purple {background-color: var(--background-blue);}
255
+ .nu-u-bg-pink {background-color: var(--background-pink);}
256
+ .nu-u-bg-brown {background-color: var(--background-brown);}
257
257
 
258
258
  .nu-u-bg-black {background-color: var(--black);}
259
259
  .nu-u-bg-white {background-color: var(--white);}
260
260
 
261
261
  /* Border */
262
- .nu-u-b--muted {border-color: var(--grey-2);}
263
- .nu-u-b {border-color: var(--grey4);}
264
- .nu-u-b--strong {border-color: var(--grey6);}
262
+ .nu-u-b--muted {border-color: var(--border-muted);}
263
+ .nu-u-b {border-color: var(--border);}
264
+ .nu-u-b--strong {border-color: var(--border-strong);}
265
+ .nu-u-b--inked {border-color: var(--border-inked);}
266
+ .nu-u-b--inverse {border-color: var(--border-inverse);}
267
+ .nu-u-b--focus {border-color: var(--border-focus);}
265
268
 
266
269
  /* Text */
267
- .nu-u-text--primary {color: var(--grey10);}
268
- .nu-u-text--primary-alt {color: var(--grey8);}
269
- .nu-u-text--secondary {color: var(--grey7);}
270
- .nu-u-text--secondary-alt {color: var(--grey5);}
270
+ .nu-u-text--primary {color: var(--text-primary);}
271
+ .nu-u-text--primary-alt {color: var(--text-primary-alt);}
272
+ .nu-u-text--secondary {color: var(--text-secondary);}
273
+ .nu-u-text--secondary-alt {color: var(--text-secondary-alt);}
271
274
  .nu-u-text--placeholder::placeholder,
272
275
  .nu-u-text--placeholder::webkit-input-placeholder,
273
- .nu-u-text--placeholder:ms-input-placeholder {color: var(--grey4);}
274
- .nu-u-text--on-color {color: var(--white);}
275
- .nu-u-text--error {color: var(--red6);}
276
- .nu-u-text--success {color: var(--green6);}
276
+ .nu-u-text--placeholder:ms-input-placeholder {color: var(--text-placeholder);}
277
+ .nu-u-text--on-color {color: var(--text-on-color);}
278
+ .nu-u-text--error {color: var(--text-error);}
279
+ .nu-u-text--success {color: var(--text-success);}
277
280
 
278
281
  .nu-u-text-black {color: var(--black);}
279
282
  .nu-u-text-white {color: var(--white);}
280
283
 
281
284
  /* Icons */
282
- .nu-u-icon--primary {color: var(--grey9);}
283
- .nu-u-icon--secondary {color: var(--grey7);}
284
- .nu-u-icon--disabled {color: var(--grey4);}
285
- .nu-u-icon--on-color {color: var(--white);}
285
+ .nu-u-icon--primary {color: var(--icon-primary);}
286
+ .nu-u-icon--secondary {color: var(--icon-secondary);}
287
+ .nu-u-icon--disabled {color: var(--icon-disabled);}
288
+ .nu-u-icon--on-color {color: var(--icon-on-color);}
286
289
 
287
290
  /* Support */
288
- .nu-u-support--error {color: var(--red5);}
289
- .nu-u-support--warning {color: var(--yellow5);}
290
- .nu-u-support--success {color: var(--green5);}
291
- .nu-u-support--info {color: var(--blue5);}
291
+ .nu-u-support--error {color: var(--support-error);}
292
+ .nu-u-support--warning {color: var(--support-warning);}
293
+ .nu-u-support--success {color: var(--support-success);}
294
+ .nu-u-support--info {color: var(--support-blue);}
package/src/index.scss CHANGED
@@ -1,5 +1,8 @@
1
1
  @import 'theme-light';
2
2
  @import 'theme-light--warm';
3
3
  @import 'theme-light--cold';
4
+ @import 'theme-dark';
5
+ @import 'theme-dark--warm';
6
+ @import 'theme-dark--cold';
4
7
  @import 'utilities';
5
8
  @import 'components';