@ozen-ui/kit 0.5.0 → 0.6.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 (11) hide show
  1. package/__inner__/cjs/components/ThemeProvider/_color/Theme_color_ozenDark.css +107 -82
  2. package/__inner__/cjs/components/ThemeProvider/_color/Theme_color_ozenDefault.css +117 -92
  3. package/__inner__/cjs/components/ThemeProvider/_typography/Theme_typography_ozenDefault.css +5 -5
  4. package/__inner__/cjs/components/ThemeProvider/themes/helper.d.ts +2 -2
  5. package/__inner__/cjs/components/ThemeProvider/themes/helper.js +32 -7
  6. package/__inner__/esm/components/ThemeProvider/_color/Theme_color_ozenDark.css +107 -82
  7. package/__inner__/esm/components/ThemeProvider/_color/Theme_color_ozenDefault.css +117 -92
  8. package/__inner__/esm/components/ThemeProvider/_typography/Theme_typography_ozenDefault.css +5 -5
  9. package/__inner__/esm/components/ThemeProvider/themes/helper.d.ts +2 -2
  10. package/__inner__/esm/components/ThemeProvider/themes/helper.js +32 -7
  11. package/package.json +1 -1
package/__inner__/cjs/components/ThemeProvider/_color/Theme_color_ozenDark.css CHANGED
@@ -1,125 +1,150 @@
1
1
  .Theme_color_ozenDark {
2
+ --color-content-action-on: #fff;
2
3
  --color-content-secondary: #949494;
3
- --color-content-primary: #F5F5F5;
4
+ --color-content-primary: #f5f5f5;
4
5
  --color-content-tertiary: #707070;
5
6
  --color-content-disabled: #363636;
6
7
  --color-content-ghost-disabled: rgb(255 255 255 / 47%);
7
- --color-content-action: #43B741;
8
+ --color-content-action: #43b741;
8
9
  --color-content-action-hover: #379535;
9
- --color-content-action-pressed: #2A7329;
10
- --color-content-action-dark: #A5DDA5;
11
- --color-content-action-on: #FFF;
12
- --color-content-error: #F62114;
13
- --color-content-error-hover: #CD1B10;
14
- --color-content-error-pressed: #A4150D;
15
- --color-content-error-dark: #FB9B96;
16
- --color-content-warning: #F0520E;
17
- --color-content-warning-hover: #C2420B;
10
+ --color-content-action-pressed: #2a7329;
11
+ --color-content-action-dark: #a5dda5;
12
+ --color-background-main: #222;
13
+ --color-content-error: #f62114;
14
+ --color-content-error-hover: #cd1b10;
15
+ --color-content-error-pressed: #a4150d;
16
+ --color-content-error-dark: #fb9b96;
17
+ --color-content-warning: #f0520e;
18
+ --color-content-warning-hover: #c2420b;
18
19
  --color-content-warning-pressed: #943209;
19
- --color-content-warning-dark: #F8B598;
20
- --color-content-success: #43B741;
20
+ --color-content-warning-dark: #f8b598;
21
+ --color-content-success: #43b741;
21
22
  --color-content-success-hover: #379535;
22
- --color-content-success-pressed: #2A7329;
23
- --color-content-success-dark: #A5DDA5;
24
- --color-content-info: #8E4DE1;
25
- --color-content-info-hover: #7424DA;
26
- --color-content-info-pressed: #5E1DB1;
27
- --color-content-info-dark: #C29FEF;
23
+ --color-content-success-pressed: #2a7329;
24
+ --color-content-success-dark: #a5dda5;
25
+ --color-content-info: #8e4de1;
26
+ --color-content-info-hover: #7424da;
27
+ --color-content-info-pressed: #5e1db1;
28
+ --color-content-info-dark: #c29fef;
28
29
  --color-content-primary-inverse: #080808;
29
- --color-background-main: #212121;
30
- --color-background-main-inverse: #F5F5F5;
31
- --color-background-main-hover: #2C2C2C;
30
+ --color-background-main-inverse: #f5f5f5;
31
+ --color-content-accent-main: #a0a0a0;
32
+ --color-accent-main: #181818;
33
+ --color-content-accent-primary: #fff;
34
+ --color-accent-primary: #282828;
35
+ --color-content-accent-disabled: #606060;
36
+ --color-background-main-hover: #2c2c2c;
32
37
  --color-background-main-pressed: #383838;
33
38
  --color-background-primary: #121212;
34
39
  --color-background-primary-hover: #222;
35
40
  --color-background-primary-pressed: #353535;
36
- --color-background-secondary: #2C2C2C;
41
+ --color-background-secondary: #2c2c2c;
37
42
  --color-background-secondary-hover: #383838;
38
43
  --color-background-secondary-pressed: #363636;
39
44
  --color-background-tertiary: #383838;
40
45
  --color-background-tertiary-hover: #363636;
41
- --color-background-tertiary-pressed: #4E4E4E;
46
+ --color-background-tertiary-pressed: #4e4e4e;
42
47
  --color-background-disabled: #353535;
43
- --color-background-action: #43B741;
48
+ --color-background-action: #43b741;
44
49
  --color-background-action-hover: #379535;
45
- --color-background-action-pressed: #2A7329;
50
+ --color-background-action-pressed: #2a7329;
46
51
  --color-background-action-active-disabled: #184117;
47
52
  --color-background-action-light: #113011;
48
- --color-background-action-light-hover: #1E521D;
53
+ --color-background-action-light-hover: #1e521d;
49
54
  --color-background-action-light-pressed: #184117;
50
- --color-background-error: #F62114;
51
- --color-background-error-hover: #CD1B10;
52
- --color-background-error-pressed: #A4150D;
53
- --color-background-error-light: #510A06;
54
- --color-background-error-light-hover: #7A1009;
55
- --color-background-error-light-pressed: #660D07;
56
- --color-background-warning: #F0520E;
57
- --color-background-warning-hover: #C2420B;
55
+ --color-background-error: #f62114;
56
+ --color-background-error-hover: #cd1b10;
57
+ --color-background-error-pressed: #a4150d;
58
+ --color-background-error-light: #510a06;
59
+ --color-background-error-light-hover: #7a1009;
60
+ --color-background-error-light-pressed: #660d07;
61
+ --color-background-warning: #f0520e;
62
+ --color-background-warning-hover: #c2420b;
58
63
  --color-background-warning-pressed: #943209;
59
64
  --color-background-warning-light: #371304;
60
65
  --color-background-warning-light-hover: #652306;
61
- --color-background-warning-light-pressed: #4E1B05;
62
- --color-background-success: #43B741;
66
+ --color-background-warning-light-pressed: #4e1b05;
67
+ --color-background-success: #43b741;
63
68
  --color-background-success-hover: #379535;
64
- --color-background-success-pressed: #2A7329;
69
+ --color-background-success-pressed: #2a7329;
65
70
  --color-background-success-light: #113011;
66
- --color-background-success-light-hover: #1E521D;
71
+ --color-background-success-light-hover: #1e521d;
67
72
  --color-background-success-light-pressed: #184117;
68
- --color-background-info: #7424DA;
69
- --color-background-info-hover: #5E1DB1;
73
+ --color-background-info: #7424da;
74
+ --color-background-info-hover: #5e1db1;
70
75
  --color-background-info-pressed: #481688;
71
- --color-background-info-light: #1D0935;
72
- --color-background-info-light-hover: #33105E;
73
- --color-background-info-light-pressed: #280C4A;
76
+ --color-background-info-light: #1d0935;
77
+ --color-background-info-light-hover: #33105e;
78
+ --color-background-info-light-pressed: #280c4a;
74
79
  --color-background-overlay: rgb(0 0 0 / 55%);
75
80
  --color-background-ghost: rgb(255 255 255 / 12%);
76
81
  --color-background-ghost-hover: rgb(255 255 255 / 24%);
77
82
  --color-background-ghost-pressed: rgb(255 255 255 / 32%);
78
83
  --color-background-ghost-disabled: rgb(255 255 255 / 47%);
84
+ --color-background-accent-action-light-hover: #1e521d;
85
+ --color-background-accent-action-light-pressed: #184117;
86
+ --color-background-accent-error-light-hover: #7a1009;
87
+ --color-background-accent-error-light-pressed: #660d07;
88
+ --color-background-accent-warning-light-hover: #652306;
89
+ --color-background-accent-warning-light-pressed: #4e1b05;
90
+ --color-background-accent-success-light-hover: #1e521d;
91
+ --color-background-accent-success-light-pressed: #184117;
92
+ --color-background-accent-info-light-hover: #33105e;
93
+ --color-background-accent-info-light-pressed: #280c4a;
79
94
  --color-border-main: #363636;
80
95
  --color-border-main-hover: #707070;
81
96
  --color-border-main-pressed: #949494;
82
97
  --color-border-secondary: #383838;
83
98
  --color-border-secondary-hover: #363636;
84
- --color-border-secondary-pressed: #4E4E4E;
85
- --color-border-disabled: #2C2C2C;
99
+ --color-border-secondary-pressed: #4e4e4e;
100
+ --color-border-disabled: #2c2c2c;
86
101
  --color-border-ghost-disabled: rgb(255 255 255 / 47%);
87
102
  --color-border-focused: #184117;
88
- --color-border-action: #43B741;
103
+ --color-border-action: #43b741;
89
104
  --color-border-action-hover: #379535;
90
- --color-border-action-pressed: #2A7329;
91
- --color-border-error: #F62114;
92
- --color-border-warning: #F0520E;
93
- --color-border-success: #43B741;
94
- --color-border-info: #8E4DE1;
95
- --color-border-main-on: #FFF;
96
- --color-additional-a1: #0B6ABE;
97
- --color-additional-a2: #1899E9;
98
- --color-additional-a3: #B3F1FF;
99
- --color-additional-b1: #B5215F;
100
- --color-additional-b2: #E62D73;
101
- --color-additional-b3: #FFB5CD;
102
- --color-additional-c1: #E64920;
103
- --color-additional-c2: #F46C1B;
104
- --color-additional-c3: #FFE2A8;
105
- --color-additional-d1: #FF8E00;
106
- --color-additional-d2: #FFC100;
107
- --color-additional-d3: #FFF9A2;
108
- --color-additional-e1: #771DB4;
109
- --color-additional-e2: #A02BE5;
110
- --color-additional-e3: #E9B7FE;
111
- --color-additional-f1: #107C60;
112
- --color-additional-f2: #17AE87;
113
- --color-additional-f3: #ABEADA;
114
- --color-additional-g1: #B88F27;
115
- --color-additional-g2: #E0B548;
116
- --color-additional-g3: #F4D37D;
117
- --color-additional-h1: #747E89;
118
- --color-additional-h2: #BDC4CB;
119
- --color-additional-h3: #E1E4E7;
120
- --color-gradient-gr1: linear-gradient(180deg, #6ED88F 0%, #4796B6 100%);
121
- --color-gradient-gr2: linear-gradient(180deg, #FC6883 0%, #6781DD 100%);
122
- --color-gradient-gr3: linear-gradient(180deg, #CACFD6 0%, #7B858D 100%);
123
- --color-gradient-gr4: linear-gradient(180deg, #E0BD62 0%, #9F8757 100%);
124
- --color-gradient-gr5: linear-gradient(180deg, #767CFF 0%, #8C50E9 100%);
105
+ --color-border-action-pressed: #2a7329;
106
+ --color-border-error: #f62114;
107
+ --color-border-warning: #f0520e;
108
+ --color-border-success: #43b741;
109
+ --color-border-info: #8e4de1;
110
+ --color-border-main-on: #fff;
111
+ --color-border-accent-main: #a0a0a0;
112
+ --color-border-accent-disabled: #606060;
113
+ --color-border-accent-focused: #184117;
114
+ --color-accent-main-hover: #282828;
115
+ --color-accent-main-pressed: #383838;
116
+ --color-accent-primary-hover: #383838;
117
+ --color-accent-primary-pressed: #484848;
118
+ --color-accent-secondary: #383838;
119
+ --color-accent-secondary-hover: #484848;
120
+ --color-accent-secondary-pressed: #585858;
121
+ --color-accent-tertiary: #484848;
122
+ --color-accent-tertiary-hover: #585858;
123
+ --color-accent-tertiary-pressed: #686868;
124
+ --color-accent-disable: #484848;
125
+ --color-accent-main-inverse: #fff;
126
+ --color-additional-a1: #0b6abe;
127
+ --color-additional-a2: #1899e9;
128
+ --color-additional-a3: #b3f1ff;
129
+ --color-additional-b1: #b5215f;
130
+ --color-additional-b2: #e62d73;
131
+ --color-additional-b3: #ffb5cd;
132
+ --color-additional-c1: #e64920;
133
+ --color-additional-c2: #f46c1b;
134
+ --color-additional-c3: #ffe2a8;
135
+ --color-additional-d1: #ff8e00;
136
+ --color-additional-d2: #ffc100;
137
+ --color-additional-d3: #fff9a2;
138
+ --color-additional-e1: #771db4;
139
+ --color-additional-e2: #a02be5;
140
+ --color-additional-e3: #e9b7fe;
141
+ --color-additional-f1: #107c60;
142
+ --color-additional-f2: #17ae87;
143
+ --color-additional-f3: #abeada;
144
+ --color-additional-g1: #b88f27;
145
+ --color-additional-g2: #e0b548;
146
+ --color-additional-g3: #f4d37d;
147
+ --color-additional-h1: #747e89;
148
+ --color-additional-h2: #bdc4cb;
149
+ --color-additional-h3: #e1e4e7;
125
150
  }
package/__inner__/cjs/components/ThemeProvider/_color/Theme_color_ozenDefault.css CHANGED
@@ -1,125 +1,150 @@
1
1
  .Theme_color_ozenDefault {
2
2
  --color-content-primary: #080808;
3
3
  --color-content-secondary: #707070;
4
+ --color-additional-h3: #e1e4e7;
4
5
  --color-content-tertiary: #949494;
5
6
  --color-content-disabled: #949494;
6
7
  --color-content-ghost-disabled: rgb(255 255 255 / 47%);
7
8
  --color-content-action: #379535;
8
- --color-content-action-hover: #2A7329;
9
- --color-content-action-pressed: #1E521D;
9
+ --color-content-action-hover: #2a7329;
10
+ --color-content-action-pressed: #1e521d;
10
11
  --color-content-action-dark: #184117;
11
12
  --color-content-action-on: #fff;
12
- --color-content-error: #CD1B10;
13
- --color-content-error-hover: #A4150D;
14
- --color-content-error-pressed: #7A1009;
15
- --color-content-error-dark: #660D07;
16
- --color-content-warning: #C2420B;
13
+ --color-content-error: #cd1b10;
14
+ --color-content-error-hover: #a4150d;
15
+ --color-content-error-pressed: #7a1009;
16
+ --color-content-error-dark: #660d07;
17
+ --color-content-warning: #c2420b;
17
18
  --color-content-warning-hover: #943209;
18
19
  --color-content-warning-pressed: #652306;
19
- --color-content-warning-dark: #4E1B05;
20
+ --color-content-warning-dark: #4e1b05;
20
21
  --color-content-success: #379535;
21
- --color-content-success-hover: #2A7329;
22
- --color-content-success-pressed: #1E521D;
22
+ --color-content-success-hover: #2a7329;
23
+ --color-content-success-pressed: #1e521d;
23
24
  --color-content-success-dark: #184117;
24
- --color-content-info: #5E1DB1;
25
+ --color-content-info: #5e1db1;
25
26
  --color-content-info-hover: #481688;
26
- --color-content-info-pressed: #33105E;
27
- --color-content-info-dark: #280C4A;
27
+ --color-content-info-pressed: #33105e;
28
+ --color-content-info-dark: #280c4a;
28
29
  --color-content-primary-inverse: #fff;
30
+ --color-content-accent-main: #a0a0a0;
31
+ --color-accent-main: #181818;
32
+ --color-content-accent-primary: #fff;
33
+ --color-accent-primary: #282828;
34
+ --color-content-accent-disabled: #606060;
29
35
  --color-background-main: #fff;
30
- --color-background-main-hover: #F5F5F5;
31
- --color-background-main-pressed: #E8E8E8;
32
- --color-background-primary: #F5F5F5;
36
+ --color-background-main-hover: #f5f5f5;
37
+ --color-background-main-pressed: #e8e8e8;
38
+ --color-background-primary: #f5f5f5;
33
39
  --color-background-primary-hover: #e8e8e8;
34
- --color-background-primary-pressed: #DCDCDC;
35
- --color-background-secondary: #E8E8E8;
36
- --color-background-secondary-hover: #DCDCDC;
37
- --color-background-secondary-pressed: #C7C7C7;
38
- --color-background-tertiary: #DCDCDC;
39
- --color-background-tertiary-hover: #C7C7C7;
40
- --color-background-tertiary-pressed: #B2B2B2;
41
- --color-background-disabled: #E8E8E8;
42
- --color-background-action: #43B741;
43
- --color-background-action-hover: #2A7329;
44
- --color-background-action-pressed: #1E521D;
45
- --color-background-action-active-disabled: #B6E3B5;
46
- --color-background-action-light: #D7F0D6;
47
- --color-background-action-light-hover: #C6E9C6;
48
- --color-background-action-light-pressed: #B6E3B5;
49
- --color-background-error: #F62114;
50
- --color-background-error-hover: #A4150D;
51
- --color-background-error-pressed: #7A1009;
52
- --color-background-error-light: #FDD9D6;
53
- --color-background-error-light-hover: #FCC4C1;
54
- --color-background-error-light-pressed: #FCB0AB;
55
- --color-background-warning: #F0520E;
40
+ --color-background-primary-pressed: #dcdcdc;
41
+ --color-background-secondary: #e8e8e8;
42
+ --color-background-secondary-hover: #dcdcdc;
43
+ --color-background-secondary-pressed: #c7c7c7;
44
+ --color-background-tertiary: #dcdcdc;
45
+ --color-background-tertiary-hover: #c7c7c7;
46
+ --color-background-tertiary-pressed: #b2b2b2;
47
+ --color-background-disabled: #e8e8e8;
48
+ --color-background-action: #43b741;
49
+ --color-background-action-hover: #2a7329;
50
+ --color-background-action-pressed: #1e521d;
51
+ --color-background-action-active-disabled: #b6e3b5;
52
+ --color-background-action-light: #d7f0d6;
53
+ --color-background-action-light-hover: #c6e9c6;
54
+ --color-background-action-light-pressed: #b6e3b5;
55
+ --color-background-error: #f62114;
56
+ --color-background-error-hover: #a4150d;
57
+ --color-background-error-pressed: #7a1009;
58
+ --color-background-error-light: #fdd9d6;
59
+ --color-background-error-light-hover: #fcc4c1;
60
+ --color-background-error-light-pressed: #fcb0ab;
61
+ --color-background-warning: #f0520e;
56
62
  --color-background-warning-hover: #943209;
57
63
  --color-background-warning-pressed: #652306;
58
- --color-background-warning-light: #FDE6DD;
59
- --color-background-warning-light-hover: #FBD6C6;
60
- --color-background-warning-light-pressed: #FAC5AF;
61
- --color-background-success: #43B741;
62
- --color-background-success-hover: #2A7329;
63
- --color-background-success-pressed: #1E521D;
64
- --color-background-success-light: #D7F0D6;
65
- --color-background-success-light-hover: #C6E9C6;
66
- --color-background-success-light-pressed: #B6E3B5;
67
- --color-background-info: #7424DA;
64
+ --color-background-warning-light: #fde6dd;
65
+ --color-background-warning-light-hover: #fbd6c6;
66
+ --color-background-warning-light-pressed: #fac5af;
67
+ --color-background-success: #43b741;
68
+ --color-background-success-hover: #2a7329;
69
+ --color-background-success-pressed: #1e521d;
70
+ --color-background-success-light: #d7f0d6;
71
+ --color-background-success-light-hover: #c6e9c6;
72
+ --color-background-success-light-pressed: #b6e3b5;
73
+ --color-background-info: #7424da;
68
74
  --color-background-info-hover: #481688;
69
- --color-background-info-pressed: #33105E;
70
- --color-background-info-light: #E9DCF9;
71
- --color-background-info-light-hover: #DCC8F6;
72
- --color-background-info-light-pressed: #DEB7F7;
75
+ --color-background-info-pressed: #33105e;
76
+ --color-background-info-light: #e9dcf9;
77
+ --color-background-info-light-hover: #dcc8f6;
78
+ --color-background-info-light-pressed: #deb7f7;
73
79
  --color-background-main-inverse: #121212;
74
80
  --color-background-overlay: rgb(0 0 0 / 55%);
75
81
  --color-background-ghost: rgb(255 255 255 / 12%);
76
82
  --color-background-ghost-hover: rgb(255 255 255 / 24%);
77
83
  --color-background-ghost-pressed: rgb(255 255 255 / 32%);
78
84
  --color-background-ghost-disabled: rgb(255 255 255 / 47%);
79
- --color-border-main: #C7C7C7;
80
- --color-border-main-hover: #B2B2B2;
85
+ --color-background-accent-action-light-hover: #1e521d;
86
+ --color-background-accent-action-light-pressed: #184117;
87
+ --color-background-accent-error-light-hover: #7a1009;
88
+ --color-background-accent-error-light-pressed: #660d07;
89
+ --color-background-accent-warning-light-hover: #652306;
90
+ --color-background-accent-warning-light-pressed: #4e1b05;
91
+ --color-background-accent-success-light-hover: #1e521d;
92
+ --color-background-accent-success-light-pressed: #184117;
93
+ --color-background-accent-info-light-hover: #33105e;
94
+ --color-background-accent-info-light-pressed: #280c4a;
95
+ --color-border-main: #c7c7c7;
96
+ --color-border-main-hover: #b2b2b2;
81
97
  --color-border-main-pressed: #949494;
82
- --color-border-secondary: #E8E8E8;
83
- --color-border-secondary-hover: #C7C7C7;
84
- --color-border-secondary-pressed: #B2B2B2;
85
- --color-border-disabled: #C7C7C7;
98
+ --color-border-secondary: #e8e8e8;
99
+ --color-border-secondary-hover: #c7c7c7;
100
+ --color-border-secondary-pressed: #b2b2b2;
101
+ --color-border-disabled: #c7c7c7;
86
102
  --color-border-ghost-disabled: rgb(255 255 255 / 47%);
87
- --color-border-focused: #85D083;
103
+ --color-border-focused: #85d083;
88
104
  --color-border-action: #379535;
89
- --color-border-action-hover: #2A7329;
105
+ --color-border-action-hover: #2a7329;
90
106
  --color-border-action-pressed: #184117;
91
- --color-border-error: #CD1B10;
92
- --color-border-warning: #C2420B;
107
+ --color-border-error: #cd1b10;
108
+ --color-border-warning: #c2420b;
93
109
  --color-border-success: #379535;
94
- --color-border-info: #5E1DB1;
110
+ --color-border-info: #5e1db1;
95
111
  --color-border-main-on: #fff;
96
- --color-additional-a1: #0B6ABE;
97
- --color-additional-a2: #1899E9;
98
- --color-additional-a3: #B3F1FF;
99
- --color-additional-b1: #B5215F;
100
- --color-additional-b2: #E62D73;
101
- --color-additional-b3: #FFB5CD;
102
- --color-additional-c1: #E64920;
103
- --color-additional-c2: #F46C1B;
104
- --color-additional-c3: #FFE2A8;
105
- --color-additional-d1: #FF8E00;
106
- --color-additional-d2: #FFC100;
107
- --color-additional-d3: #FFF9A2;
108
- --color-additional-e1: #771DB4;
109
- --color-additional-e2: #A02BE5;
110
- --color-additional-e3: #E9B7FE;
111
- --color-additional-f1: #107C60;
112
- --color-additional-f2: #17AE87;
113
- --color-additional-f3: #ABEADA;
114
- --color-additional-g1: #B88F27;
115
- --color-additional-g2: #E0B548;
116
- --color-additional-g3: #F4D37D;
117
- --color-additional-h1: #747E89;
118
- --color-additional-h2: #BDC4CB;
119
- --color-additional-h3: #E1E4E7;
120
- --color-gradient-gr1: linear-gradient(180deg, #6ED88F 0%, #4796B6 100%);
121
- --color-gradient-gr2: linear-gradient(180deg, #FC6883 0%, #6781DD 100%);
122
- --color-gradient-gr3: linear-gradient(180deg, #CACFD6 0%, #7B858D 100%);
123
- --color-gradient-gr4: linear-gradient(180deg, #E0BD62 0%, #9F8757 100%);
124
- --color-gradient-gr5: linear-gradient(180deg, #767CFF 0%, #8C50E9 100%);
112
+ --color-border-accent-main: #a0a0a0;
113
+ --color-border-accent-disabled: #606060;
114
+ --color-border-accent-focused: #184117;
115
+ --color-accent-main-hover: #282828;
116
+ --color-accent-main-pressed: #383838;
117
+ --color-accent-primary-hover: #383838;
118
+ --color-accent-primary-pressed: #484848;
119
+ --color-accent-secondary: #383838;
120
+ --color-accent-secondary-hover: #484848;
121
+ --color-accent-secondary-pressed: #585858;
122
+ --color-accent-tertiary: #484848;
123
+ --color-accent-tertiary-hover: #585858;
124
+ --color-accent-tertiary-pressed: #686868;
125
+ --color-accent-disabled: #484848;
126
+ --color-accent-main-inverse: #fff;
127
+ --color-additional-a1: #0b6abe;
128
+ --color-additional-a2: #1899e9;
129
+ --color-additional-a3: #b3f1ff;
130
+ --color-additional-b1: #b5215f;
131
+ --color-additional-b2: #e62d73;
132
+ --color-additional-b3: #ffb5cd;
133
+ --color-additional-c1: #e64920;
134
+ --color-additional-c2: #f46c1b;
135
+ --color-additional-c3: #ffe2a8;
136
+ --color-additional-d1: #ff8e00;
137
+ --color-additional-d2: #ffc100;
138
+ --color-additional-d3: #fff9a2;
139
+ --color-additional-e1: #771db4;
140
+ --color-additional-e2: #a02be5;
141
+ --color-additional-e3: #e9b7fe;
142
+ --color-additional-f1: #107c60;
143
+ --color-additional-f2: #17ae87;
144
+ --color-additional-f3: #abeada;
145
+ --color-additional-g1: #b88f27;
146
+ --color-additional-g2: #e0b548;
147
+ --color-additional-g3: #f4d37d;
148
+ --color-additional-h1: #747e89;
149
+ --color-additional-h2: #bdc4cb;
125
150
  }
package/__inner__/cjs/components/ThemeProvider/_typography/Theme_typography_ozenDefault.css CHANGED
@@ -1,15 +1,15 @@
1
1
  .Theme_typography_ozenDefault {
2
+ --typography-text-xl_1-font: 500 24px/32px 'Roboto', sans-serif;
2
3
  --typography-text-4xl_1-font: 500 40px/56px 'Roboto', sans-serif;
3
4
  --typography-text-3xl_1-font: 500 32px/40px 'Roboto', sans-serif;
4
5
  --typography-text-2xl_1-font: 500 28px/36px 'Roboto', sans-serif;
5
- --typography-text-xl_1-font: 500 24px/32px 'Roboto', sans-serif;
6
- --typography-heading-4xl-font: 500 40px/56px 'Roboto', sans-serif;
6
+ --typography-heading-4xl-font: 500 48px/64px 'Roboto', sans-serif;
7
7
  --typography-text-4xl-font: 400 40px/56px 'Roboto', sans-serif;
8
- --typography-heading-3xl-font: 500 32px/40px 'Roboto', sans-serif;
8
+ --typography-heading-3xl-font: 700 40px/56px 'Roboto', sans-serif;
9
9
  --typography-text-3xl-font: 400 32px/40px 'Roboto', sans-serif;
10
- --typography-heading-2xl-font: 500 28px/36px 'Roboto', sans-serif;
10
+ --typography-heading-2xl-font: 700 32px/40px 'Roboto', sans-serif;
11
11
  --typography-text-2xl-font: 400 28px/36px 'Roboto', sans-serif;
12
- --typography-heading-xl-font: 500 24px/32px 'Roboto', sans-serif;
12
+ --typography-heading-xl-font: 700 24px/32px 'Roboto', sans-serif;
13
13
  --typography-text-xl-font: 400 24px/32px 'Roboto', sans-serif;
14
14
  --typography-text-l-font: 400 18px/28px 'Roboto', sans-serif;
15
15
  --typography-text-l_1-font: 500 18px/28px 'Roboto', sans-serif;
package/__inner__/cjs/components/ThemeProvider/themes/helper.d.ts CHANGED
@@ -1,9 +1,9 @@
1
- export declare const color: readonly ["--color-content-primary", "--color-content-secondary", "--color-content-tertiary", "--color-content-disabled", "--color-content-ghost-disabled", "--color-content-action", "--color-content-action-hover", "--color-content-action-pressed", "--color-content-action-dark", "--color-content-action-on", "--color-content-error", "--color-content-error-hover", "--color-content-error-pressed", "--color-content-error-dark", "--color-content-warning", "--color-content-warning-hover", "--color-content-warning-pressed", "--color-content-warning-dark", "--color-content-success", "--color-content-success-hover", "--color-content-success-pressed", "--color-content-success-dark", "--color-content-info", "--color-content-info-hover", "--color-content-info-pressed", "--color-content-info-dark", "--color-content-primary-inverse", "--color-background-main", "--color-background-main-hover", "--color-background-main-pressed", "--color-background-primary", "--color-background-primary-hover", "--color-background-primary-pressed", "--color-background-secondary", "--color-background-secondary-hover", "--color-background-secondary-pressed", "--color-background-tertiary", "--color-background-tertiary-hover", "--color-background-tertiary-pressed", "--color-background-disabled", "--color-background-action", "--color-background-action-hover", "--color-background-action-pressed", "--color-background-action-active-disabled", "--color-background-action-light", "--color-background-action-light-hover", "--color-background-action-light-pressed", "--color-background-error", "--color-background-error-hover", "--color-background-error-pressed", "--color-background-error-light", "--color-background-error-light-hover", "--color-background-error-light-pressed", "--color-background-warning", "--color-background-warning-hover", "--color-background-warning-pressed", "--color-background-warning-light", "--color-background-warning-light-hover", "--color-background-warning-light-pressed", "--color-background-success", "--color-background-success-hover", "--color-background-success-pressed", "--color-background-success-light", "--color-background-success-light-hover", "--color-background-success-light-pressed", "--color-background-info", "--color-background-info-hover", "--color-background-info-pressed", "--color-background-info-light", "--color-background-info-light-hover", "--color-background-info-light-pressed", "--color-background-main-inverse", "--color-background-overlay", "--color-background-ghost", "--color-background-ghost-hover", "--color-background-ghost-pressed", "--color-background-ghost-disabled", "--color-border-main", "--color-border-main-hover", "--color-border-main-pressed", "--color-border-secondary", "--color-border-secondary-hover", "--color-border-secondary-pressed", "--color-border-disabled", "--color-border-ghost-disabled", "--color-border-focused", "--color-border-action", "--color-border-action-hover", "--color-border-action-pressed", "--color-border-error", "--color-border-warning", "--color-border-success", "--color-border-info", "--color-border-main-on", "--color-additional-a1", "--color-additional-a2", "--color-additional-a3", "--color-additional-b1", "--color-additional-b2", "--color-additional-b3", "--color-additional-c1", "--color-additional-c2", "--color-additional-c3", "--color-additional-d1", "--color-additional-d2", "--color-additional-d3", "--color-additional-e1", "--color-additional-e2", "--color-additional-e3", "--color-additional-f1", "--color-additional-f2", "--color-additional-f3", "--color-additional-g1", "--color-additional-g2", "--color-additional-g3", "--color-additional-h1", "--color-additional-h2", "--color-additional-h3", "--color-gradient-gr1", "--color-gradient-gr2", "--color-gradient-gr3", "--color-gradient-gr4", "--color-gradient-gr5"];
1
+ export declare const color: readonly ["--color-content-primary", "--color-content-secondary", "--color-additional-h3", "--color-content-tertiary", "--color-content-disabled", "--color-content-ghost-disabled", "--color-content-action", "--color-content-action-hover", "--color-content-action-pressed", "--color-content-action-dark", "--color-content-action-on", "--color-content-error", "--color-content-error-hover", "--color-content-error-pressed", "--color-content-error-dark", "--color-content-warning", "--color-content-warning-hover", "--color-content-warning-pressed", "--color-content-warning-dark", "--color-content-success", "--color-content-success-hover", "--color-content-success-pressed", "--color-content-success-dark", "--color-content-info", "--color-content-info-hover", "--color-content-info-pressed", "--color-content-info-dark", "--color-content-primary-inverse", "--color-content-accent-main", "--color-accent-main", "--color-content-accent-primary", "--color-accent-primary", "--color-content-accent-disabled", "--color-background-main", "--color-background-main-hover", "--color-background-main-pressed", "--color-background-primary", "--color-background-primary-hover", "--color-background-primary-pressed", "--color-background-secondary", "--color-background-secondary-hover", "--color-background-secondary-pressed", "--color-background-tertiary", "--color-background-tertiary-hover", "--color-background-tertiary-pressed", "--color-background-disabled", "--color-background-action", "--color-background-action-hover", "--color-background-action-pressed", "--color-background-action-active-disabled", "--color-background-action-light", "--color-background-action-light-hover", "--color-background-action-light-pressed", "--color-background-error", "--color-background-error-hover", "--color-background-error-pressed", "--color-background-error-light", "--color-background-error-light-hover", "--color-background-error-light-pressed", "--color-background-warning", "--color-background-warning-hover", "--color-background-warning-pressed", "--color-background-warning-light", "--color-background-warning-light-hover", "--color-background-warning-light-pressed", "--color-background-success", "--color-background-success-hover", "--color-background-success-pressed", "--color-background-success-light", "--color-background-success-light-hover", "--color-background-success-light-pressed", "--color-background-info", "--color-background-info-hover", "--color-background-info-pressed", "--color-background-info-light", "--color-background-info-light-hover", "--color-background-info-light-pressed", "--color-background-main-inverse", "--color-background-overlay", "--color-background-ghost", "--color-background-ghost-hover", "--color-background-ghost-pressed", "--color-background-ghost-disabled", "--color-background-accent-action-light-hover", "--color-background-accent-action-light-pressed", "--color-background-accent-error-light-hover", "--color-background-accent-error-light-pressed", "--color-background-accent-warning-light-hover", "--color-background-accent-warning-light-pressed", "--color-background-accent-success-light-hover", "--color-background-accent-success-light-pressed", "--color-background-accent-info-light-hover", "--color-background-accent-info-light-pressed", "--color-border-main", "--color-border-main-hover", "--color-border-main-pressed", "--color-border-secondary", "--color-border-secondary-hover", "--color-border-secondary-pressed", "--color-border-disabled", "--color-border-ghost-disabled", "--color-border-focused", "--color-border-action", "--color-border-action-hover", "--color-border-action-pressed", "--color-border-error", "--color-border-warning", "--color-border-success", "--color-border-info", "--color-border-main-on", "--color-border-accent-main", "--color-border-accent-disabled", "--color-border-accent-focused", "--color-accent-main-hover", "--color-accent-main-pressed", "--color-accent-primary-hover", "--color-accent-primary-pressed", "--color-accent-secondary", "--color-accent-secondary-hover", "--color-accent-secondary-pressed", "--color-accent-tertiary", "--color-accent-tertiary-hover", "--color-accent-tertiary-pressed", "--color-accent-disabled", "--color-accent-main-inverse", "--color-additional-a1", "--color-additional-a2", "--color-additional-a3", "--color-additional-b1", "--color-additional-b2", "--color-additional-b3", "--color-additional-c1", "--color-additional-c2", "--color-additional-c3", "--color-additional-d1", "--color-additional-d2", "--color-additional-d3", "--color-additional-e1", "--color-additional-e2", "--color-additional-e3", "--color-additional-f1", "--color-additional-f2", "--color-additional-f3", "--color-additional-g1", "--color-additional-g2", "--color-additional-g3", "--color-additional-h1", "--color-additional-h2"];
2
2
  export declare const borderRadius: readonly ["--border-radius-l", "--border-radius-xl", "--border-radius-m", "--border-radius-s", "--border-radius-xs", "--border-radius-2xs"];
3
3
  export declare const borderWidth: readonly ["--border-width-s", "--border-width-m"];
4
4
  export declare const shadow: readonly ["--shadow-l", "--shadow-m", "--shadow-s"];
5
5
  export declare const breakpoint: readonly ["--breakpoint-xs", "--breakpoint-s", "--breakpoint-m", "--breakpoint-l"];
6
6
  export declare const zIndex: readonly ["--z-index-default", "--z-index-absolute", "--z-index-header", "--z-index-sidebar", "--z-index-modal", "--z-index-popover", "--z-index-snackbar", "--z-index-chat"];
7
7
  export declare const space: readonly ["--space-8xl", "--space-7xl", "--space-6xl", "--space-5xl", "--space-4xl", "--space-3xl", "--space-2xl", "--space-xl", "--space-l", "--space-m", "--space-s", "--space-xs"];
8
- export declare const typography: readonly ["--typography-text-4xl_1-font", "--typography-text-3xl_1-font", "--typography-text-2xl_1-font", "--typography-text-xl_1-font", "--typography-heading-4xl-font", "--typography-text-4xl-font", "--typography-heading-3xl-font", "--typography-text-3xl-font", "--typography-heading-2xl-font", "--typography-text-2xl-font", "--typography-heading-xl-font", "--typography-text-xl-font", "--typography-text-l-font", "--typography-text-l_1-font", "--typography-text-m-font", "--typography-text-m_1-font", "--typography-text-s-font", "--typography-text-s_1-font", "--typography-text-xs-font", "--typography-text-xs_1-font", "--typography-text-2xs-font", "--typography-text-2xs_1-font", "--typography-text-3xs-font", "--typography-caption-3xs-font", "--typography-caption-3xs-text_transform", "--typography-caption-3xs-letter_spacing", "--typography-text-3xs_1-font", "--typography-caption-3xs_1-font", "--typography-caption-3xs_1-text_transform", "--typography-caption-3xs_1-letter_spacing"];
8
+ export declare const typography: readonly ["--typography-text-xl_1-font", "--typography-text-4xl_1-font", "--typography-text-3xl_1-font", "--typography-text-2xl_1-font", "--typography-heading-4xl-font", "--typography-text-4xl-font", "--typography-heading-3xl-font", "--typography-text-3xl-font", "--typography-heading-2xl-font", "--typography-text-2xl-font", "--typography-heading-xl-font", "--typography-text-xl-font", "--typography-text-l-font", "--typography-text-l_1-font", "--typography-text-m-font", "--typography-text-m_1-font", "--typography-text-s-font", "--typography-text-s_1-font", "--typography-text-xs-font", "--typography-text-xs_1-font", "--typography-text-2xs-font", "--typography-text-2xs_1-font", "--typography-text-3xs-font", "--typography-caption-3xs-font", "--typography-caption-3xs-text_transform", "--typography-caption-3xs-letter_spacing", "--typography-text-3xs_1-font", "--typography-caption-3xs_1-font", "--typography-caption-3xs_1-text_transform", "--typography-caption-3xs_1-letter_spacing"];
9
9
  export declare const transition: readonly ["--transition-default", "--transition-slow"];
package/__inner__/cjs/components/ThemeProvider/themes/helper.js CHANGED
@@ -4,6 +4,7 @@ exports.transition = exports.typography = exports.space = exports.zIndex = expor
4
4
  exports.color = [
5
5
  '--color-content-primary',
6
6
  '--color-content-secondary',
7
+ '--color-additional-h3',
7
8
  '--color-content-tertiary',
8
9
  '--color-content-disabled',
9
10
  '--color-content-ghost-disabled',
@@ -29,6 +30,11 @@ exports.color = [
29
30
  '--color-content-info-pressed',
30
31
  '--color-content-info-dark',
31
32
  '--color-content-primary-inverse',
33
+ '--color-content-accent-main',
34
+ '--color-accent-main',
35
+ '--color-content-accent-primary',
36
+ '--color-accent-primary',
37
+ '--color-content-accent-disabled',
32
38
  '--color-background-main',
33
39
  '--color-background-main-hover',
34
40
  '--color-background-main-pressed',
@@ -79,6 +85,16 @@ exports.color = [
79
85
  '--color-background-ghost-hover',
80
86
  '--color-background-ghost-pressed',
81
87
  '--color-background-ghost-disabled',
88
+ '--color-background-accent-action-light-hover',
89
+ '--color-background-accent-action-light-pressed',
90
+ '--color-background-accent-error-light-hover',
91
+ '--color-background-accent-error-light-pressed',
92
+ '--color-background-accent-warning-light-hover',
93
+ '--color-background-accent-warning-light-pressed',
94
+ '--color-background-accent-success-light-hover',
95
+ '--color-background-accent-success-light-pressed',
96
+ '--color-background-accent-info-light-hover',
97
+ '--color-background-accent-info-light-pressed',
82
98
  '--color-border-main',
83
99
  '--color-border-main-hover',
84
100
  '--color-border-main-pressed',
@@ -96,6 +112,21 @@ exports.color = [
96
112
  '--color-border-success',
97
113
  '--color-border-info',
98
114
  '--color-border-main-on',
115
+ '--color-border-accent-main',
116
+ '--color-border-accent-disabled',
117
+ '--color-border-accent-focused',
118
+ '--color-accent-main-hover',
119
+ '--color-accent-main-pressed',
120
+ '--color-accent-primary-hover',
121
+ '--color-accent-primary-pressed',
122
+ '--color-accent-secondary',
123
+ '--color-accent-secondary-hover',
124
+ '--color-accent-secondary-pressed',
125
+ '--color-accent-tertiary',
126
+ '--color-accent-tertiary-hover',
127
+ '--color-accent-tertiary-pressed',
128
+ '--color-accent-disabled',
129
+ '--color-accent-main-inverse',
99
130
  '--color-additional-a1',
100
131
  '--color-additional-a2',
101
132
  '--color-additional-a3',
@@ -119,12 +150,6 @@ exports.color = [
119
150
  '--color-additional-g3',
120
151
  '--color-additional-h1',
121
152
  '--color-additional-h2',
122
- '--color-additional-h3',
123
- '--color-gradient-gr1',
124
- '--color-gradient-gr2',
125
- '--color-gradient-gr3',
126
- '--color-gradient-gr4',
127
- '--color-gradient-gr5',
128
153
  ];
129
154
  exports.borderRadius = [
130
155
  '--border-radius-l',
@@ -167,10 +192,10 @@ exports.space = [
167
192
  '--space-xs',
168
193
  ];
169
194
  exports.typography = [
195
+ '--typography-text-xl_1-font',
170
196
  '--typography-text-4xl_1-font',
171
197
  '--typography-text-3xl_1-font',
172
198
  '--typography-text-2xl_1-font',
173
- '--typography-text-xl_1-font',
174
199
  '--typography-heading-4xl-font',
175
200
  '--typography-text-4xl-font',
176
201
  '--typography-heading-3xl-font',
package/__inner__/esm/components/ThemeProvider/_color/Theme_color_ozenDark.css CHANGED
@@ -1,125 +1,150 @@
1
1
  .Theme_color_ozenDark {
2
+ --color-content-action-on: #fff;
2
3
  --color-content-secondary: #949494;
3
- --color-content-primary: #F5F5F5;
4
+ --color-content-primary: #f5f5f5;
4
5
  --color-content-tertiary: #707070;
5
6
  --color-content-disabled: #363636;
6
7
  --color-content-ghost-disabled: rgb(255 255 255 / 47%);
7
- --color-content-action: #43B741;
8
+ --color-content-action: #43b741;
8
9
  --color-content-action-hover: #379535;
9
- --color-content-action-pressed: #2A7329;
10
- --color-content-action-dark: #A5DDA5;
11
- --color-content-action-on: #FFF;
12
- --color-content-error: #F62114;
13
- --color-content-error-hover: #CD1B10;
14
- --color-content-error-pressed: #A4150D;
15
- --color-content-error-dark: #FB9B96;
16
- --color-content-warning: #F0520E;
17
- --color-content-warning-hover: #C2420B;
10
+ --color-content-action-pressed: #2a7329;
11
+ --color-content-action-dark: #a5dda5;
12
+ --color-background-main: #222;
13
+ --color-content-error: #f62114;
14
+ --color-content-error-hover: #cd1b10;
15
+ --color-content-error-pressed: #a4150d;
16
+ --color-content-error-dark: #fb9b96;
17
+ --color-content-warning: #f0520e;
18
+ --color-content-warning-hover: #c2420b;
18
19
  --color-content-warning-pressed: #943209;
19
- --color-content-warning-dark: #F8B598;
20
- --color-content-success: #43B741;
20
+ --color-content-warning-dark: #f8b598;
21
+ --color-content-success: #43b741;
21
22
  --color-content-success-hover: #379535;
22
- --color-content-success-pressed: #2A7329;
23
- --color-content-success-dark: #A5DDA5;
24
- --color-content-info: #8E4DE1;
25
- --color-content-info-hover: #7424DA;
26
- --color-content-info-pressed: #5E1DB1;
27
- --color-content-info-dark: #C29FEF;
23
+ --color-content-success-pressed: #2a7329;
24
+ --color-content-success-dark: #a5dda5;
25
+ --color-content-info: #8e4de1;
26
+ --color-content-info-hover: #7424da;
27
+ --color-content-info-pressed: #5e1db1;
28
+ --color-content-info-dark: #c29fef;
28
29
  --color-content-primary-inverse: #080808;
29
- --color-background-main: #212121;
30
- --color-background-main-inverse: #F5F5F5;
31
- --color-background-main-hover: #2C2C2C;
30
+ --color-background-main-inverse: #f5f5f5;
31
+ --color-content-accent-main: #a0a0a0;
32
+ --color-accent-main: #181818;
33
+ --color-content-accent-primary: #fff;
34
+ --color-accent-primary: #282828;
35
+ --color-content-accent-disabled: #606060;
36
+ --color-background-main-hover: #2c2c2c;
32
37
  --color-background-main-pressed: #383838;
33
38
  --color-background-primary: #121212;
34
39
  --color-background-primary-hover: #222;
35
40
  --color-background-primary-pressed: #353535;
36
- --color-background-secondary: #2C2C2C;
41
+ --color-background-secondary: #2c2c2c;
37
42
  --color-background-secondary-hover: #383838;
38
43
  --color-background-secondary-pressed: #363636;
39
44
  --color-background-tertiary: #383838;
40
45
  --color-background-tertiary-hover: #363636;
41
- --color-background-tertiary-pressed: #4E4E4E;
46
+ --color-background-tertiary-pressed: #4e4e4e;
42
47
  --color-background-disabled: #353535;
43
- --color-background-action: #43B741;
48
+ --color-background-action: #43b741;
44
49
  --color-background-action-hover: #379535;
45
- --color-background-action-pressed: #2A7329;
50
+ --color-background-action-pressed: #2a7329;
46
51
  --color-background-action-active-disabled: #184117;
47
52
  --color-background-action-light: #113011;
48
- --color-background-action-light-hover: #1E521D;
53
+ --color-background-action-light-hover: #1e521d;
49
54
  --color-background-action-light-pressed: #184117;
50
- --color-background-error: #F62114;
51
- --color-background-error-hover: #CD1B10;
52
- --color-background-error-pressed: #A4150D;
53
- --color-background-error-light: #510A06;
54
- --color-background-error-light-hover: #7A1009;
55
- --color-background-error-light-pressed: #660D07;
56
- --color-background-warning: #F0520E;
57
- --color-background-warning-hover: #C2420B;
55
+ --color-background-error: #f62114;
56
+ --color-background-error-hover: #cd1b10;
57
+ --color-background-error-pressed: #a4150d;
58
+ --color-background-error-light: #510a06;
59
+ --color-background-error-light-hover: #7a1009;
60
+ --color-background-error-light-pressed: #660d07;
61
+ --color-background-warning: #f0520e;
62
+ --color-background-warning-hover: #c2420b;
58
63
  --color-background-warning-pressed: #943209;
59
64
  --color-background-warning-light: #371304;
60
65
  --color-background-warning-light-hover: #652306;
61
- --color-background-warning-light-pressed: #4E1B05;
62
- --color-background-success: #43B741;
66
+ --color-background-warning-light-pressed: #4e1b05;
67
+ --color-background-success: #43b741;
63
68
  --color-background-success-hover: #379535;
64
- --color-background-success-pressed: #2A7329;
69
+ --color-background-success-pressed: #2a7329;
65
70
  --color-background-success-light: #113011;
66
- --color-background-success-light-hover: #1E521D;
71
+ --color-background-success-light-hover: #1e521d;
67
72
  --color-background-success-light-pressed: #184117;
68
- --color-background-info: #7424DA;
69
- --color-background-info-hover: #5E1DB1;
73
+ --color-background-info: #7424da;
74
+ --color-background-info-hover: #5e1db1;
70
75
  --color-background-info-pressed: #481688;
71
- --color-background-info-light: #1D0935;
72
- --color-background-info-light-hover: #33105E;
73
- --color-background-info-light-pressed: #280C4A;
76
+ --color-background-info-light: #1d0935;
77
+ --color-background-info-light-hover: #33105e;
78
+ --color-background-info-light-pressed: #280c4a;
74
79
  --color-background-overlay: rgb(0 0 0 / 55%);
75
80
  --color-background-ghost: rgb(255 255 255 / 12%);
76
81
  --color-background-ghost-hover: rgb(255 255 255 / 24%);
77
82
  --color-background-ghost-pressed: rgb(255 255 255 / 32%);
78
83
  --color-background-ghost-disabled: rgb(255 255 255 / 47%);
84
+ --color-background-accent-action-light-hover: #1e521d;
85
+ --color-background-accent-action-light-pressed: #184117;
86
+ --color-background-accent-error-light-hover: #7a1009;
87
+ --color-background-accent-error-light-pressed: #660d07;
88
+ --color-background-accent-warning-light-hover: #652306;
89
+ --color-background-accent-warning-light-pressed: #4e1b05;
90
+ --color-background-accent-success-light-hover: #1e521d;
91
+ --color-background-accent-success-light-pressed: #184117;
92
+ --color-background-accent-info-light-hover: #33105e;
93
+ --color-background-accent-info-light-pressed: #280c4a;
79
94
  --color-border-main: #363636;
80
95
  --color-border-main-hover: #707070;
81
96
  --color-border-main-pressed: #949494;
82
97
  --color-border-secondary: #383838;
83
98
  --color-border-secondary-hover: #363636;
84
- --color-border-secondary-pressed: #4E4E4E;
85
- --color-border-disabled: #2C2C2C;
99
+ --color-border-secondary-pressed: #4e4e4e;
100
+ --color-border-disabled: #2c2c2c;
86
101
  --color-border-ghost-disabled: rgb(255 255 255 / 47%);
87
102
  --color-border-focused: #184117;
88
- --color-border-action: #43B741;
103
+ --color-border-action: #43b741;
89
104
  --color-border-action-hover: #379535;
90
- --color-border-action-pressed: #2A7329;
91
- --color-border-error: #F62114;
92
- --color-border-warning: #F0520E;
93
- --color-border-success: #43B741;
94
- --color-border-info: #8E4DE1;
95
- --color-border-main-on: #FFF;
96
- --color-additional-a1: #0B6ABE;
97
- --color-additional-a2: #1899E9;
98
- --color-additional-a3: #B3F1FF;
99
- --color-additional-b1: #B5215F;
100
- --color-additional-b2: #E62D73;
101
- --color-additional-b3: #FFB5CD;
102
- --color-additional-c1: #E64920;
103
- --color-additional-c2: #F46C1B;
104
- --color-additional-c3: #FFE2A8;
105
- --color-additional-d1: #FF8E00;
106
- --color-additional-d2: #FFC100;
107
- --color-additional-d3: #FFF9A2;
108
- --color-additional-e1: #771DB4;
109
- --color-additional-e2: #A02BE5;
110
- --color-additional-e3: #E9B7FE;
111
- --color-additional-f1: #107C60;
112
- --color-additional-f2: #17AE87;
113
- --color-additional-f3: #ABEADA;
114
- --color-additional-g1: #B88F27;
115
- --color-additional-g2: #E0B548;
116
- --color-additional-g3: #F4D37D;
117
- --color-additional-h1: #747E89;
118
- --color-additional-h2: #BDC4CB;
119
- --color-additional-h3: #E1E4E7;
120
- --color-gradient-gr1: linear-gradient(180deg, #6ED88F 0%, #4796B6 100%);
121
- --color-gradient-gr2: linear-gradient(180deg, #FC6883 0%, #6781DD 100%);
122
- --color-gradient-gr3: linear-gradient(180deg, #CACFD6 0%, #7B858D 100%);
123
- --color-gradient-gr4: linear-gradient(180deg, #E0BD62 0%, #9F8757 100%);
124
- --color-gradient-gr5: linear-gradient(180deg, #767CFF 0%, #8C50E9 100%);
105
+ --color-border-action-pressed: #2a7329;
106
+ --color-border-error: #f62114;
107
+ --color-border-warning: #f0520e;
108
+ --color-border-success: #43b741;
109
+ --color-border-info: #8e4de1;
110
+ --color-border-main-on: #fff;
111
+ --color-border-accent-main: #a0a0a0;
112
+ --color-border-accent-disabled: #606060;
113
+ --color-border-accent-focused: #184117;
114
+ --color-accent-main-hover: #282828;
115
+ --color-accent-main-pressed: #383838;
116
+ --color-accent-primary-hover: #383838;
117
+ --color-accent-primary-pressed: #484848;
118
+ --color-accent-secondary: #383838;
119
+ --color-accent-secondary-hover: #484848;
120
+ --color-accent-secondary-pressed: #585858;
121
+ --color-accent-tertiary: #484848;
122
+ --color-accent-tertiary-hover: #585858;
123
+ --color-accent-tertiary-pressed: #686868;
124
+ --color-accent-disable: #484848;
125
+ --color-accent-main-inverse: #fff;
126
+ --color-additional-a1: #0b6abe;
127
+ --color-additional-a2: #1899e9;
128
+ --color-additional-a3: #b3f1ff;
129
+ --color-additional-b1: #b5215f;
130
+ --color-additional-b2: #e62d73;
131
+ --color-additional-b3: #ffb5cd;
132
+ --color-additional-c1: #e64920;
133
+ --color-additional-c2: #f46c1b;
134
+ --color-additional-c3: #ffe2a8;
135
+ --color-additional-d1: #ff8e00;
136
+ --color-additional-d2: #ffc100;
137
+ --color-additional-d3: #fff9a2;
138
+ --color-additional-e1: #771db4;
139
+ --color-additional-e2: #a02be5;
140
+ --color-additional-e3: #e9b7fe;
141
+ --color-additional-f1: #107c60;
142
+ --color-additional-f2: #17ae87;
143
+ --color-additional-f3: #abeada;
144
+ --color-additional-g1: #b88f27;
145
+ --color-additional-g2: #e0b548;
146
+ --color-additional-g3: #f4d37d;
147
+ --color-additional-h1: #747e89;
148
+ --color-additional-h2: #bdc4cb;
149
+ --color-additional-h3: #e1e4e7;
125
150
  }
package/__inner__/esm/components/ThemeProvider/_color/Theme_color_ozenDefault.css CHANGED
@@ -1,125 +1,150 @@
1
1
  .Theme_color_ozenDefault {
2
2
  --color-content-primary: #080808;
3
3
  --color-content-secondary: #707070;
4
+ --color-additional-h3: #e1e4e7;
4
5
  --color-content-tertiary: #949494;
5
6
  --color-content-disabled: #949494;
6
7
  --color-content-ghost-disabled: rgb(255 255 255 / 47%);
7
8
  --color-content-action: #379535;
8
- --color-content-action-hover: #2A7329;
9
- --color-content-action-pressed: #1E521D;
9
+ --color-content-action-hover: #2a7329;
10
+ --color-content-action-pressed: #1e521d;
10
11
  --color-content-action-dark: #184117;
11
12
  --color-content-action-on: #fff;
12
- --color-content-error: #CD1B10;
13
- --color-content-error-hover: #A4150D;
14
- --color-content-error-pressed: #7A1009;
15
- --color-content-error-dark: #660D07;
16
- --color-content-warning: #C2420B;
13
+ --color-content-error: #cd1b10;
14
+ --color-content-error-hover: #a4150d;
15
+ --color-content-error-pressed: #7a1009;
16
+ --color-content-error-dark: #660d07;
17
+ --color-content-warning: #c2420b;
17
18
  --color-content-warning-hover: #943209;
18
19
  --color-content-warning-pressed: #652306;
19
- --color-content-warning-dark: #4E1B05;
20
+ --color-content-warning-dark: #4e1b05;
20
21
  --color-content-success: #379535;
21
- --color-content-success-hover: #2A7329;
22
- --color-content-success-pressed: #1E521D;
22
+ --color-content-success-hover: #2a7329;
23
+ --color-content-success-pressed: #1e521d;
23
24
  --color-content-success-dark: #184117;
24
- --color-content-info: #5E1DB1;
25
+ --color-content-info: #5e1db1;
25
26
  --color-content-info-hover: #481688;
26
- --color-content-info-pressed: #33105E;
27
- --color-content-info-dark: #280C4A;
27
+ --color-content-info-pressed: #33105e;
28
+ --color-content-info-dark: #280c4a;
28
29
  --color-content-primary-inverse: #fff;
30
+ --color-content-accent-main: #a0a0a0;
31
+ --color-accent-main: #181818;
32
+ --color-content-accent-primary: #fff;
33
+ --color-accent-primary: #282828;
34
+ --color-content-accent-disabled: #606060;
29
35
  --color-background-main: #fff;
30
- --color-background-main-hover: #F5F5F5;
31
- --color-background-main-pressed: #E8E8E8;
32
- --color-background-primary: #F5F5F5;
36
+ --color-background-main-hover: #f5f5f5;
37
+ --color-background-main-pressed: #e8e8e8;
38
+ --color-background-primary: #f5f5f5;
33
39
  --color-background-primary-hover: #e8e8e8;
34
- --color-background-primary-pressed: #DCDCDC;
35
- --color-background-secondary: #E8E8E8;
36
- --color-background-secondary-hover: #DCDCDC;
37
- --color-background-secondary-pressed: #C7C7C7;
38
- --color-background-tertiary: #DCDCDC;
39
- --color-background-tertiary-hover: #C7C7C7;
40
- --color-background-tertiary-pressed: #B2B2B2;
41
- --color-background-disabled: #E8E8E8;
42
- --color-background-action: #43B741;
43
- --color-background-action-hover: #2A7329;
44
- --color-background-action-pressed: #1E521D;
45
- --color-background-action-active-disabled: #B6E3B5;
46
- --color-background-action-light: #D7F0D6;
47
- --color-background-action-light-hover: #C6E9C6;
48
- --color-background-action-light-pressed: #B6E3B5;
49
- --color-background-error: #F62114;
50
- --color-background-error-hover: #A4150D;
51
- --color-background-error-pressed: #7A1009;
52
- --color-background-error-light: #FDD9D6;
53
- --color-background-error-light-hover: #FCC4C1;
54
- --color-background-error-light-pressed: #FCB0AB;
55
- --color-background-warning: #F0520E;
40
+ --color-background-primary-pressed: #dcdcdc;
41
+ --color-background-secondary: #e8e8e8;
42
+ --color-background-secondary-hover: #dcdcdc;
43
+ --color-background-secondary-pressed: #c7c7c7;
44
+ --color-background-tertiary: #dcdcdc;
45
+ --color-background-tertiary-hover: #c7c7c7;
46
+ --color-background-tertiary-pressed: #b2b2b2;
47
+ --color-background-disabled: #e8e8e8;
48
+ --color-background-action: #43b741;
49
+ --color-background-action-hover: #2a7329;
50
+ --color-background-action-pressed: #1e521d;
51
+ --color-background-action-active-disabled: #b6e3b5;
52
+ --color-background-action-light: #d7f0d6;
53
+ --color-background-action-light-hover: #c6e9c6;
54
+ --color-background-action-light-pressed: #b6e3b5;
55
+ --color-background-error: #f62114;
56
+ --color-background-error-hover: #a4150d;
57
+ --color-background-error-pressed: #7a1009;
58
+ --color-background-error-light: #fdd9d6;
59
+ --color-background-error-light-hover: #fcc4c1;
60
+ --color-background-error-light-pressed: #fcb0ab;
61
+ --color-background-warning: #f0520e;
56
62
  --color-background-warning-hover: #943209;
57
63
  --color-background-warning-pressed: #652306;
58
- --color-background-warning-light: #FDE6DD;
59
- --color-background-warning-light-hover: #FBD6C6;
60
- --color-background-warning-light-pressed: #FAC5AF;
61
- --color-background-success: #43B741;
62
- --color-background-success-hover: #2A7329;
63
- --color-background-success-pressed: #1E521D;
64
- --color-background-success-light: #D7F0D6;
65
- --color-background-success-light-hover: #C6E9C6;
66
- --color-background-success-light-pressed: #B6E3B5;
67
- --color-background-info: #7424DA;
64
+ --color-background-warning-light: #fde6dd;
65
+ --color-background-warning-light-hover: #fbd6c6;
66
+ --color-background-warning-light-pressed: #fac5af;
67
+ --color-background-success: #43b741;
68
+ --color-background-success-hover: #2a7329;
69
+ --color-background-success-pressed: #1e521d;
70
+ --color-background-success-light: #d7f0d6;
71
+ --color-background-success-light-hover: #c6e9c6;
72
+ --color-background-success-light-pressed: #b6e3b5;
73
+ --color-background-info: #7424da;
68
74
  --color-background-info-hover: #481688;
69
- --color-background-info-pressed: #33105E;
70
- --color-background-info-light: #E9DCF9;
71
- --color-background-info-light-hover: #DCC8F6;
72
- --color-background-info-light-pressed: #DEB7F7;
75
+ --color-background-info-pressed: #33105e;
76
+ --color-background-info-light: #e9dcf9;
77
+ --color-background-info-light-hover: #dcc8f6;
78
+ --color-background-info-light-pressed: #deb7f7;
73
79
  --color-background-main-inverse: #121212;
74
80
  --color-background-overlay: rgb(0 0 0 / 55%);
75
81
  --color-background-ghost: rgb(255 255 255 / 12%);
76
82
  --color-background-ghost-hover: rgb(255 255 255 / 24%);
77
83
  --color-background-ghost-pressed: rgb(255 255 255 / 32%);
78
84
  --color-background-ghost-disabled: rgb(255 255 255 / 47%);
79
- --color-border-main: #C7C7C7;
80
- --color-border-main-hover: #B2B2B2;
85
+ --color-background-accent-action-light-hover: #1e521d;
86
+ --color-background-accent-action-light-pressed: #184117;
87
+ --color-background-accent-error-light-hover: #7a1009;
88
+ --color-background-accent-error-light-pressed: #660d07;
89
+ --color-background-accent-warning-light-hover: #652306;
90
+ --color-background-accent-warning-light-pressed: #4e1b05;
91
+ --color-background-accent-success-light-hover: #1e521d;
92
+ --color-background-accent-success-light-pressed: #184117;
93
+ --color-background-accent-info-light-hover: #33105e;
94
+ --color-background-accent-info-light-pressed: #280c4a;
95
+ --color-border-main: #c7c7c7;
96
+ --color-border-main-hover: #b2b2b2;
81
97
  --color-border-main-pressed: #949494;
82
- --color-border-secondary: #E8E8E8;
83
- --color-border-secondary-hover: #C7C7C7;
84
- --color-border-secondary-pressed: #B2B2B2;
85
- --color-border-disabled: #C7C7C7;
98
+ --color-border-secondary: #e8e8e8;
99
+ --color-border-secondary-hover: #c7c7c7;
100
+ --color-border-secondary-pressed: #b2b2b2;
101
+ --color-border-disabled: #c7c7c7;
86
102
  --color-border-ghost-disabled: rgb(255 255 255 / 47%);
87
- --color-border-focused: #85D083;
103
+ --color-border-focused: #85d083;
88
104
  --color-border-action: #379535;
89
- --color-border-action-hover: #2A7329;
105
+ --color-border-action-hover: #2a7329;
90
106
  --color-border-action-pressed: #184117;
91
- --color-border-error: #CD1B10;
92
- --color-border-warning: #C2420B;
107
+ --color-border-error: #cd1b10;
108
+ --color-border-warning: #c2420b;
93
109
  --color-border-success: #379535;
94
- --color-border-info: #5E1DB1;
110
+ --color-border-info: #5e1db1;
95
111
  --color-border-main-on: #fff;
96
- --color-additional-a1: #0B6ABE;
97
- --color-additional-a2: #1899E9;
98
- --color-additional-a3: #B3F1FF;
99
- --color-additional-b1: #B5215F;
100
- --color-additional-b2: #E62D73;
101
- --color-additional-b3: #FFB5CD;
102
- --color-additional-c1: #E64920;
103
- --color-additional-c2: #F46C1B;
104
- --color-additional-c3: #FFE2A8;
105
- --color-additional-d1: #FF8E00;
106
- --color-additional-d2: #FFC100;
107
- --color-additional-d3: #FFF9A2;
108
- --color-additional-e1: #771DB4;
109
- --color-additional-e2: #A02BE5;
110
- --color-additional-e3: #E9B7FE;
111
- --color-additional-f1: #107C60;
112
- --color-additional-f2: #17AE87;
113
- --color-additional-f3: #ABEADA;
114
- --color-additional-g1: #B88F27;
115
- --color-additional-g2: #E0B548;
116
- --color-additional-g3: #F4D37D;
117
- --color-additional-h1: #747E89;
118
- --color-additional-h2: #BDC4CB;
119
- --color-additional-h3: #E1E4E7;
120
- --color-gradient-gr1: linear-gradient(180deg, #6ED88F 0%, #4796B6 100%);
121
- --color-gradient-gr2: linear-gradient(180deg, #FC6883 0%, #6781DD 100%);
122
- --color-gradient-gr3: linear-gradient(180deg, #CACFD6 0%, #7B858D 100%);
123
- --color-gradient-gr4: linear-gradient(180deg, #E0BD62 0%, #9F8757 100%);
124
- --color-gradient-gr5: linear-gradient(180deg, #767CFF 0%, #8C50E9 100%);
112
+ --color-border-accent-main: #a0a0a0;
113
+ --color-border-accent-disabled: #606060;
114
+ --color-border-accent-focused: #184117;
115
+ --color-accent-main-hover: #282828;
116
+ --color-accent-main-pressed: #383838;
117
+ --color-accent-primary-hover: #383838;
118
+ --color-accent-primary-pressed: #484848;
119
+ --color-accent-secondary: #383838;
120
+ --color-accent-secondary-hover: #484848;
121
+ --color-accent-secondary-pressed: #585858;
122
+ --color-accent-tertiary: #484848;
123
+ --color-accent-tertiary-hover: #585858;
124
+ --color-accent-tertiary-pressed: #686868;
125
+ --color-accent-disabled: #484848;
126
+ --color-accent-main-inverse: #fff;
127
+ --color-additional-a1: #0b6abe;
128
+ --color-additional-a2: #1899e9;
129
+ --color-additional-a3: #b3f1ff;
130
+ --color-additional-b1: #b5215f;
131
+ --color-additional-b2: #e62d73;
132
+ --color-additional-b3: #ffb5cd;
133
+ --color-additional-c1: #e64920;
134
+ --color-additional-c2: #f46c1b;
135
+ --color-additional-c3: #ffe2a8;
136
+ --color-additional-d1: #ff8e00;
137
+ --color-additional-d2: #ffc100;
138
+ --color-additional-d3: #fff9a2;
139
+ --color-additional-e1: #771db4;
140
+ --color-additional-e2: #a02be5;
141
+ --color-additional-e3: #e9b7fe;
142
+ --color-additional-f1: #107c60;
143
+ --color-additional-f2: #17ae87;
144
+ --color-additional-f3: #abeada;
145
+ --color-additional-g1: #b88f27;
146
+ --color-additional-g2: #e0b548;
147
+ --color-additional-g3: #f4d37d;
148
+ --color-additional-h1: #747e89;
149
+ --color-additional-h2: #bdc4cb;
125
150
  }
package/__inner__/esm/components/ThemeProvider/_typography/Theme_typography_ozenDefault.css CHANGED
@@ -1,15 +1,15 @@
1
1
  .Theme_typography_ozenDefault {
2
+ --typography-text-xl_1-font: 500 24px/32px 'Roboto', sans-serif;
2
3
  --typography-text-4xl_1-font: 500 40px/56px 'Roboto', sans-serif;
3
4
  --typography-text-3xl_1-font: 500 32px/40px 'Roboto', sans-serif;
4
5
  --typography-text-2xl_1-font: 500 28px/36px 'Roboto', sans-serif;
5
- --typography-text-xl_1-font: 500 24px/32px 'Roboto', sans-serif;
6
- --typography-heading-4xl-font: 500 40px/56px 'Roboto', sans-serif;
6
+ --typography-heading-4xl-font: 500 48px/64px 'Roboto', sans-serif;
7
7
  --typography-text-4xl-font: 400 40px/56px 'Roboto', sans-serif;
8
- --typography-heading-3xl-font: 500 32px/40px 'Roboto', sans-serif;
8
+ --typography-heading-3xl-font: 700 40px/56px 'Roboto', sans-serif;
9
9
  --typography-text-3xl-font: 400 32px/40px 'Roboto', sans-serif;
10
- --typography-heading-2xl-font: 500 28px/36px 'Roboto', sans-serif;
10
+ --typography-heading-2xl-font: 700 32px/40px 'Roboto', sans-serif;
11
11
  --typography-text-2xl-font: 400 28px/36px 'Roboto', sans-serif;
12
- --typography-heading-xl-font: 500 24px/32px 'Roboto', sans-serif;
12
+ --typography-heading-xl-font: 700 24px/32px 'Roboto', sans-serif;
13
13
  --typography-text-xl-font: 400 24px/32px 'Roboto', sans-serif;
14
14
  --typography-text-l-font: 400 18px/28px 'Roboto', sans-serif;
15
15
  --typography-text-l_1-font: 500 18px/28px 'Roboto', sans-serif;
package/__inner__/esm/components/ThemeProvider/themes/helper.d.ts CHANGED
@@ -1,9 +1,9 @@
1
- export declare const color: readonly ["--color-content-primary", "--color-content-secondary", "--color-content-tertiary", "--color-content-disabled", "--color-content-ghost-disabled", "--color-content-action", "--color-content-action-hover", "--color-content-action-pressed", "--color-content-action-dark", "--color-content-action-on", "--color-content-error", "--color-content-error-hover", "--color-content-error-pressed", "--color-content-error-dark", "--color-content-warning", "--color-content-warning-hover", "--color-content-warning-pressed", "--color-content-warning-dark", "--color-content-success", "--color-content-success-hover", "--color-content-success-pressed", "--color-content-success-dark", "--color-content-info", "--color-content-info-hover", "--color-content-info-pressed", "--color-content-info-dark", "--color-content-primary-inverse", "--color-background-main", "--color-background-main-hover", "--color-background-main-pressed", "--color-background-primary", "--color-background-primary-hover", "--color-background-primary-pressed", "--color-background-secondary", "--color-background-secondary-hover", "--color-background-secondary-pressed", "--color-background-tertiary", "--color-background-tertiary-hover", "--color-background-tertiary-pressed", "--color-background-disabled", "--color-background-action", "--color-background-action-hover", "--color-background-action-pressed", "--color-background-action-active-disabled", "--color-background-action-light", "--color-background-action-light-hover", "--color-background-action-light-pressed", "--color-background-error", "--color-background-error-hover", "--color-background-error-pressed", "--color-background-error-light", "--color-background-error-light-hover", "--color-background-error-light-pressed", "--color-background-warning", "--color-background-warning-hover", "--color-background-warning-pressed", "--color-background-warning-light", "--color-background-warning-light-hover", "--color-background-warning-light-pressed", "--color-background-success", "--color-background-success-hover", "--color-background-success-pressed", "--color-background-success-light", "--color-background-success-light-hover", "--color-background-success-light-pressed", "--color-background-info", "--color-background-info-hover", "--color-background-info-pressed", "--color-background-info-light", "--color-background-info-light-hover", "--color-background-info-light-pressed", "--color-background-main-inverse", "--color-background-overlay", "--color-background-ghost", "--color-background-ghost-hover", "--color-background-ghost-pressed", "--color-background-ghost-disabled", "--color-border-main", "--color-border-main-hover", "--color-border-main-pressed", "--color-border-secondary", "--color-border-secondary-hover", "--color-border-secondary-pressed", "--color-border-disabled", "--color-border-ghost-disabled", "--color-border-focused", "--color-border-action", "--color-border-action-hover", "--color-border-action-pressed", "--color-border-error", "--color-border-warning", "--color-border-success", "--color-border-info", "--color-border-main-on", "--color-additional-a1", "--color-additional-a2", "--color-additional-a3", "--color-additional-b1", "--color-additional-b2", "--color-additional-b3", "--color-additional-c1", "--color-additional-c2", "--color-additional-c3", "--color-additional-d1", "--color-additional-d2", "--color-additional-d3", "--color-additional-e1", "--color-additional-e2", "--color-additional-e3", "--color-additional-f1", "--color-additional-f2", "--color-additional-f3", "--color-additional-g1", "--color-additional-g2", "--color-additional-g3", "--color-additional-h1", "--color-additional-h2", "--color-additional-h3", "--color-gradient-gr1", "--color-gradient-gr2", "--color-gradient-gr3", "--color-gradient-gr4", "--color-gradient-gr5"];
1
+ export declare const color: readonly ["--color-content-primary", "--color-content-secondary", "--color-additional-h3", "--color-content-tertiary", "--color-content-disabled", "--color-content-ghost-disabled", "--color-content-action", "--color-content-action-hover", "--color-content-action-pressed", "--color-content-action-dark", "--color-content-action-on", "--color-content-error", "--color-content-error-hover", "--color-content-error-pressed", "--color-content-error-dark", "--color-content-warning", "--color-content-warning-hover", "--color-content-warning-pressed", "--color-content-warning-dark", "--color-content-success", "--color-content-success-hover", "--color-content-success-pressed", "--color-content-success-dark", "--color-content-info", "--color-content-info-hover", "--color-content-info-pressed", "--color-content-info-dark", "--color-content-primary-inverse", "--color-content-accent-main", "--color-accent-main", "--color-content-accent-primary", "--color-accent-primary", "--color-content-accent-disabled", "--color-background-main", "--color-background-main-hover", "--color-background-main-pressed", "--color-background-primary", "--color-background-primary-hover", "--color-background-primary-pressed", "--color-background-secondary", "--color-background-secondary-hover", "--color-background-secondary-pressed", "--color-background-tertiary", "--color-background-tertiary-hover", "--color-background-tertiary-pressed", "--color-background-disabled", "--color-background-action", "--color-background-action-hover", "--color-background-action-pressed", "--color-background-action-active-disabled", "--color-background-action-light", "--color-background-action-light-hover", "--color-background-action-light-pressed", "--color-background-error", "--color-background-error-hover", "--color-background-error-pressed", "--color-background-error-light", "--color-background-error-light-hover", "--color-background-error-light-pressed", "--color-background-warning", "--color-background-warning-hover", "--color-background-warning-pressed", "--color-background-warning-light", "--color-background-warning-light-hover", "--color-background-warning-light-pressed", "--color-background-success", "--color-background-success-hover", "--color-background-success-pressed", "--color-background-success-light", "--color-background-success-light-hover", "--color-background-success-light-pressed", "--color-background-info", "--color-background-info-hover", "--color-background-info-pressed", "--color-background-info-light", "--color-background-info-light-hover", "--color-background-info-light-pressed", "--color-background-main-inverse", "--color-background-overlay", "--color-background-ghost", "--color-background-ghost-hover", "--color-background-ghost-pressed", "--color-background-ghost-disabled", "--color-background-accent-action-light-hover", "--color-background-accent-action-light-pressed", "--color-background-accent-error-light-hover", "--color-background-accent-error-light-pressed", "--color-background-accent-warning-light-hover", "--color-background-accent-warning-light-pressed", "--color-background-accent-success-light-hover", "--color-background-accent-success-light-pressed", "--color-background-accent-info-light-hover", "--color-background-accent-info-light-pressed", "--color-border-main", "--color-border-main-hover", "--color-border-main-pressed", "--color-border-secondary", "--color-border-secondary-hover", "--color-border-secondary-pressed", "--color-border-disabled", "--color-border-ghost-disabled", "--color-border-focused", "--color-border-action", "--color-border-action-hover", "--color-border-action-pressed", "--color-border-error", "--color-border-warning", "--color-border-success", "--color-border-info", "--color-border-main-on", "--color-border-accent-main", "--color-border-accent-disabled", "--color-border-accent-focused", "--color-accent-main-hover", "--color-accent-main-pressed", "--color-accent-primary-hover", "--color-accent-primary-pressed", "--color-accent-secondary", "--color-accent-secondary-hover", "--color-accent-secondary-pressed", "--color-accent-tertiary", "--color-accent-tertiary-hover", "--color-accent-tertiary-pressed", "--color-accent-disabled", "--color-accent-main-inverse", "--color-additional-a1", "--color-additional-a2", "--color-additional-a3", "--color-additional-b1", "--color-additional-b2", "--color-additional-b3", "--color-additional-c1", "--color-additional-c2", "--color-additional-c3", "--color-additional-d1", "--color-additional-d2", "--color-additional-d3", "--color-additional-e1", "--color-additional-e2", "--color-additional-e3", "--color-additional-f1", "--color-additional-f2", "--color-additional-f3", "--color-additional-g1", "--color-additional-g2", "--color-additional-g3", "--color-additional-h1", "--color-additional-h2"];
2
2
  export declare const borderRadius: readonly ["--border-radius-l", "--border-radius-xl", "--border-radius-m", "--border-radius-s", "--border-radius-xs", "--border-radius-2xs"];
3
3
  export declare const borderWidth: readonly ["--border-width-s", "--border-width-m"];
4
4
  export declare const shadow: readonly ["--shadow-l", "--shadow-m", "--shadow-s"];
5
5
  export declare const breakpoint: readonly ["--breakpoint-xs", "--breakpoint-s", "--breakpoint-m", "--breakpoint-l"];
6
6
  export declare const zIndex: readonly ["--z-index-default", "--z-index-absolute", "--z-index-header", "--z-index-sidebar", "--z-index-modal", "--z-index-popover", "--z-index-snackbar", "--z-index-chat"];
7
7
  export declare const space: readonly ["--space-8xl", "--space-7xl", "--space-6xl", "--space-5xl", "--space-4xl", "--space-3xl", "--space-2xl", "--space-xl", "--space-l", "--space-m", "--space-s", "--space-xs"];
8
- export declare const typography: readonly ["--typography-text-4xl_1-font", "--typography-text-3xl_1-font", "--typography-text-2xl_1-font", "--typography-text-xl_1-font", "--typography-heading-4xl-font", "--typography-text-4xl-font", "--typography-heading-3xl-font", "--typography-text-3xl-font", "--typography-heading-2xl-font", "--typography-text-2xl-font", "--typography-heading-xl-font", "--typography-text-xl-font", "--typography-text-l-font", "--typography-text-l_1-font", "--typography-text-m-font", "--typography-text-m_1-font", "--typography-text-s-font", "--typography-text-s_1-font", "--typography-text-xs-font", "--typography-text-xs_1-font", "--typography-text-2xs-font", "--typography-text-2xs_1-font", "--typography-text-3xs-font", "--typography-caption-3xs-font", "--typography-caption-3xs-text_transform", "--typography-caption-3xs-letter_spacing", "--typography-text-3xs_1-font", "--typography-caption-3xs_1-font", "--typography-caption-3xs_1-text_transform", "--typography-caption-3xs_1-letter_spacing"];
8
+ export declare const typography: readonly ["--typography-text-xl_1-font", "--typography-text-4xl_1-font", "--typography-text-3xl_1-font", "--typography-text-2xl_1-font", "--typography-heading-4xl-font", "--typography-text-4xl-font", "--typography-heading-3xl-font", "--typography-text-3xl-font", "--typography-heading-2xl-font", "--typography-text-2xl-font", "--typography-heading-xl-font", "--typography-text-xl-font", "--typography-text-l-font", "--typography-text-l_1-font", "--typography-text-m-font", "--typography-text-m_1-font", "--typography-text-s-font", "--typography-text-s_1-font", "--typography-text-xs-font", "--typography-text-xs_1-font", "--typography-text-2xs-font", "--typography-text-2xs_1-font", "--typography-text-3xs-font", "--typography-caption-3xs-font", "--typography-caption-3xs-text_transform", "--typography-caption-3xs-letter_spacing", "--typography-text-3xs_1-font", "--typography-caption-3xs_1-font", "--typography-caption-3xs_1-text_transform", "--typography-caption-3xs_1-letter_spacing"];
9
9
  export declare const transition: readonly ["--transition-default", "--transition-slow"];
package/__inner__/esm/components/ThemeProvider/themes/helper.js CHANGED
@@ -1,6 +1,7 @@
1
1
  export var color = [
2
2
  '--color-content-primary',
3
3
  '--color-content-secondary',
4
+ '--color-additional-h3',
4
5
  '--color-content-tertiary',
5
6
  '--color-content-disabled',
6
7
  '--color-content-ghost-disabled',
@@ -26,6 +27,11 @@ export var color = [
26
27
  '--color-content-info-pressed',
27
28
  '--color-content-info-dark',
28
29
  '--color-content-primary-inverse',
30
+ '--color-content-accent-main',
31
+ '--color-accent-main',
32
+ '--color-content-accent-primary',
33
+ '--color-accent-primary',
34
+ '--color-content-accent-disabled',
29
35
  '--color-background-main',
30
36
  '--color-background-main-hover',
31
37
  '--color-background-main-pressed',
@@ -76,6 +82,16 @@ export var color = [
76
82
  '--color-background-ghost-hover',
77
83
  '--color-background-ghost-pressed',
78
84
  '--color-background-ghost-disabled',
85
+ '--color-background-accent-action-light-hover',
86
+ '--color-background-accent-action-light-pressed',
87
+ '--color-background-accent-error-light-hover',
88
+ '--color-background-accent-error-light-pressed',
89
+ '--color-background-accent-warning-light-hover',
90
+ '--color-background-accent-warning-light-pressed',
91
+ '--color-background-accent-success-light-hover',
92
+ '--color-background-accent-success-light-pressed',
93
+ '--color-background-accent-info-light-hover',
94
+ '--color-background-accent-info-light-pressed',
79
95
  '--color-border-main',
80
96
  '--color-border-main-hover',
81
97
  '--color-border-main-pressed',
@@ -93,6 +109,21 @@ export var color = [
93
109
  '--color-border-success',
94
110
  '--color-border-info',
95
111
  '--color-border-main-on',
112
+ '--color-border-accent-main',
113
+ '--color-border-accent-disabled',
114
+ '--color-border-accent-focused',
115
+ '--color-accent-main-hover',
116
+ '--color-accent-main-pressed',
117
+ '--color-accent-primary-hover',
118
+ '--color-accent-primary-pressed',
119
+ '--color-accent-secondary',
120
+ '--color-accent-secondary-hover',
121
+ '--color-accent-secondary-pressed',
122
+ '--color-accent-tertiary',
123
+ '--color-accent-tertiary-hover',
124
+ '--color-accent-tertiary-pressed',
125
+ '--color-accent-disabled',
126
+ '--color-accent-main-inverse',
96
127
  '--color-additional-a1',
97
128
  '--color-additional-a2',
98
129
  '--color-additional-a3',
@@ -116,12 +147,6 @@ export var color = [
116
147
  '--color-additional-g3',
117
148
  '--color-additional-h1',
118
149
  '--color-additional-h2',
119
- '--color-additional-h3',
120
- '--color-gradient-gr1',
121
- '--color-gradient-gr2',
122
- '--color-gradient-gr3',
123
- '--color-gradient-gr4',
124
- '--color-gradient-gr5',
125
150
  ];
126
151
  export var borderRadius = [
127
152
  '--border-radius-l',
@@ -164,10 +189,10 @@ export var space = [
164
189
  '--space-xs',
165
190
  ];
166
191
  export var typography = [
192
+ '--typography-text-xl_1-font',
167
193
  '--typography-text-4xl_1-font',
168
194
  '--typography-text-3xl_1-font',
169
195
  '--typography-text-2xl_1-font',
170
- '--typography-text-xl_1-font',
171
196
  '--typography-heading-4xl-font',
172
197
  '--typography-text-4xl-font',
173
198
  '--typography-heading-3xl-font',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ozen-ui/kit",
3
- "version": "0.5.0",
3
+ "version": "0.6.0",
4
4
  "description": "React component library",
5
5
  "files": [
6
6
  "*"