@onereach/styles 2.9.3-beta.646.0 → 2.9.3-beta.648.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.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/tailwind.config.preset.js +28 -34
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onereach/styles",
3
- "version": "2.9.3-beta.646.0",
3
+ "version": "2.9.3-beta.648.0",
4
4
  "description": "Styles for or-ui-next",
5
5
  "main": "./main.css",
6
6
  "unpkg": "./main.css",
package/tailwind.config.preset.js CHANGED
@@ -6,34 +6,58 @@ const plugin = require('tailwindcss/plugin');
6
6
  module.exports = {
7
7
  darkMode: ['class', '[data-theme="dark-mode"]'],
8
8
  theme: {
9
- backgroundColor: {
9
+ colors: {
10
10
  // Base Colors
11
11
  'white': 'var(--or-color--white)',
12
12
  'black': 'var(--or-color--black)',
13
13
 
14
14
  // General Colors
15
15
  'primary': 'var(--or-color--primary)',
16
+ 'on-primary': 'var(--or-color--on-primary)',
17
+
16
18
  'primary-container': 'var(--or-color--primary-container)',
19
+ 'on-primary-container': 'var(--or-color--on-primary-container)',
17
20
 
18
21
  'secondary': 'var(--or-color--secondary)',
22
+ 'on-secondary': 'var(--or-color--on-secondary)',
23
+
19
24
  'secondary-container': 'var(--or-color--secondary-container)',
25
+ 'on-secondary-container': 'var(--or-color--on-secondary-container)',
20
26
 
21
27
  'tertiary': 'var(--or-color--tertiary)',
28
+ 'on-tertiary': 'var(--or-color--on-tertiary)',
29
+
22
30
  'tertiary-container': 'var(--or-color--tertiary-container)',
31
+ 'on-tertiary-container': 'var(--or-color--on-tertiary-container)',
23
32
 
24
33
  'success': 'var(--or-color--success)',
34
+ 'on-success': 'var(--or-color--on-success)',
35
+
25
36
  'success-container': 'var(--or-color--success-container)',
37
+ 'on-success-container': 'var(--or-color--on-success-container)',
26
38
 
27
39
  'warning': 'var(--or-color--warning)',
40
+ 'on-warning': 'var(--or-color--on-warning)',
41
+
28
42
  'warning-container': 'var(--or-color--warning-container)',
43
+ 'on-warning-container': 'var(--or-color--on-warning-container)',
29
44
 
30
45
  'error': 'var(--or-color--error)',
46
+ 'on-error': 'var(--or-color--on-error)',
47
+
31
48
  'error-container': 'var(--or-color--error-container)',
49
+ 'on-error-container': 'var(--or-color--on-error-container)',
32
50
 
33
51
  'background': 'var(--or-color--background)',
52
+ 'on-background': 'var(--or-color--on-background)',
34
53
 
35
54
  'surface': 'var(--or-color--surface)',
55
+ 'on-surface': 'var(--or-color--on-surface)',
56
+
36
57
  'surface-variant': 'var(--or-color--surface-variant)',
58
+ 'on-surface-variant': 'var(--or-color--on-surface-variant)',
59
+
60
+ 'outline': 'var(--or-color--outline)',
37
61
 
38
62
  'disabled': 'var(--or-color--disabled)',
39
63
 
@@ -43,40 +67,10 @@ module.exports = {
43
67
  'surface-3': 'var(--or-color--surface-3)',
44
68
  'surface-4': 'var(--or-color--surface-4)',
45
69
  'surface-5': 'var(--or-color--surface-5)',
46
- },
47
70
 
48
- textColor: {
49
- // Base Colors
50
- 'white': 'var(--or-color--white)',
51
- 'black': 'var(--or-color--black)',
52
-
53
- // General Colors
54
- 'on-primary': 'var(--or-color--on-primary)',
55
- 'on-primary-container': 'var(--or-color--on-primary-container)',
56
-
57
- 'on-secondary': 'var(--or-color--on-secondary)',
58
- 'on-secondary-container': 'var(--or-color--on-secondary-container)',
59
-
60
- 'on-tertiary': 'var(--or-color--on-tertiary)',
61
- 'on-tertiary-container': 'var(--or-color--on-tertiary-container)',
62
-
63
- 'on-success': 'var(--or-color--on-success)',
64
- 'on-success-container': 'var(--or-color--on-success-container)',
65
-
66
- 'on-warning': 'var(--or-color--on-warning)',
67
- 'on-warning-container': 'var(--or-color--on-warning-container)',
68
-
69
- 'on-error': 'var(--or-color--on-error)',
70
- 'on-error-container': 'var(--or-color--on-error-container)',
71
-
72
- 'on-background': 'var(--or-color--on-background)',
73
-
74
- 'on-surface': 'var(--or-color--on-surface)',
75
- 'on-surface-variant': 'var(--or-color--on-surface-variant)',
76
- },
77
-
78
- borderColor: {
79
- 'outline': 'var(--or-color--outline)',
71
+ 'opacity-1': 'var(--or-color--opacity-1)',
72
+ 'opacity-2': 'var(--or-color--opacity-2)',
73
+ 'opacity-3': 'var(--or-color--opacity-3)',
80
74
  },
81
75
 
82
76
  extend: {