@acorex/styles 7.0.34 → 7.0.36

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@acorex/styles",
3
- "version": "7.0.34",
3
+ "version": "7.0.36",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "author": "",
@@ -1,9 +1,11 @@
1
1
  @mixin light-variables() {
2
2
  --ax-color-background-default: 250, 250, 250;
3
3
  --ax-color-text-default: 18, 18, 18;
4
- --ax-color-border-default: 201, 201, 201;
4
+ --ax-color-border-default: 228, 228, 228;
5
5
  --ax-color-surface: 255, 255, 255;
6
+ --ax-color-surface-fore: 18, 18, 18;
6
7
  --ax-color-on-surface: 242, 242, 242;
8
+ --ax-color-on-surface-fore: 20, 20, 20;
7
9
  --ax-color-ghost: 30, 41, 59;
8
10
  --ax-color-ghost-fore: 0, 0, 0;
9
11
  }
@@ -66,10 +66,9 @@
66
66
  border: 1px solid;
67
67
  border-color: rgba(var(--ax-color-border-default));
68
68
  border-radius: var(--ax-rounded-border-default);
69
- box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
70
- 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
69
+ box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
71
70
  overflow: hidden;
72
-
71
+ margin-top: 0.25rem;
73
72
  ax-header,
74
73
  ax-footer {
75
74
  background-color: rgba(var(--ax-color-surface));
@@ -110,8 +109,7 @@
110
109
  border: 1px solid;
111
110
  border-color: rgba(var(--ax-color-border-default));
112
111
  border-radius: var(--ax-rounded-border-default);
113
- box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
114
- 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
112
+ box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
115
113
  padding: 0.5rem 0;
116
114
 
117
115
  .ax-button-item {
@@ -120,8 +118,8 @@
120
118
  align-items: center;
121
119
  justify-content: flex-start;
122
120
  padding: 0.5rem;
123
- padding-inline-start: 0.5rem;
124
- padding-inline-end: 1rem;
121
+ padding-inline-start: 1.5rem;
122
+ padding-inline-end: 2rem;
125
123
  font-size: 0.875rem;
126
124
  color: rgba(var(--ax-color-text-default));
127
125
  user-select: none;
@@ -15,7 +15,6 @@
15
15
  border-radius: var(--ax-rounded-border-default);
16
16
  font-size: 1rem;
17
17
  overflow: hidden;
18
- box-shadow: 0 1px 0px 0px rgb(0 0 0 / 10%), 0 0px 0px 0px rgb(0 0 0 / 10%);
19
18
  &:focus-within {
20
19
  border-color: rgb(var(--ax-color-primary-500));
21
20
  box-shadow: 0px 0 0px 1px rgb(var(--ax-color-primary-500));
@@ -1,5 +1,11 @@
1
1
  @import '../variables/index.scss';
2
2
 
3
+ *,
4
+ ::before,
5
+ ::after {
6
+ border-color: rgba(var(--ax-color-border-default));
7
+ }
8
+
3
9
  [class*=' ax-icon-'],
4
10
  [class^='ax-icon-'] {
5
11
  vertical-align: middle;
@@ -22,12 +22,8 @@ module.exports = withAnimations({
22
22
  colors: {
23
23
  black: withOpacityValue('--ax-color-black'),
24
24
  white: withOpacityValue('--ax-color-white'),
25
- surface: withOpacityValue('--ax-color-surface'),
26
- 'on-surface': withOpacityValue('--ax-color-on-surface'),
27
- 'border-color': 'rgba(var(--ax-color-border-default))',
28
25
  primary: {
29
26
  DEFAULT: withOpacityValue('--ax-color-primary-500'),
30
- fore: withOpacityValue('--ax-color-primary-fore'),
31
27
  50: withOpacityValue('--ax-color-primary-50'),
32
28
  100: withOpacityValue('--ax-color-primary-100'),
33
29
  200: withOpacityValue('--ax-color-primary-200'),
@@ -41,7 +37,6 @@ module.exports = withAnimations({
41
37
  },
42
38
  secondary: {
43
39
  DEFAULT: withOpacityValue('--ax-color-secondary-500'),
44
- fore: withOpacityValue('--ax-color-secondary-fore'),
45
40
  50: withOpacityValue('--ax-color-secondary-50'),
46
41
  100: withOpacityValue('--ax-color-secondary-100'),
47
42
  200: withOpacityValue('--ax-color-secondary-200'),
@@ -55,7 +50,6 @@ module.exports = withAnimations({
55
50
  },
56
51
  success: {
57
52
  DEFAULT: withOpacityValue('--ax-color-success-500'),
58
- fore: withOpacityValue('--ax-color-success-fore'),
59
53
  50: withOpacityValue('--ax-color-success-50'),
60
54
  100: withOpacityValue('--ax-color-success-100'),
61
55
  200: withOpacityValue('--ax-color-success-200'),
@@ -69,7 +63,6 @@ module.exports = withAnimations({
69
63
  },
70
64
  danger: {
71
65
  DEFAULT: withOpacityValue('--ax-color-danger-500'),
72
- fore: withOpacityValue('--ax-color-danger-fore'),
73
66
  50: withOpacityValue('--ax-color-danger-50'),
74
67
  100: withOpacityValue('--ax-color-danger-100'),
75
68
  200: withOpacityValue('--ax-color-danger-200'),
@@ -83,7 +76,6 @@ module.exports = withAnimations({
83
76
  },
84
77
  warning: {
85
78
  DEFAULT: withOpacityValue('--ax-color-warning-500'),
86
- fore: withOpacityValue('--ax-color-warning-fore'),
87
79
  50: withOpacityValue('--ax-color-warning-50'),
88
80
  100: withOpacityValue('--ax-color-warning-100'),
89
81
  200: withOpacityValue('--ax-color-warning-200'),
@@ -96,6 +88,24 @@ module.exports = withAnimations({
96
88
  900: withOpacityValue('--ax-color-warning-900'),
97
89
  },
98
90
  },
91
+ textColor: {
92
+ default: withOpacityValue('--ax-color-text-default'),
93
+ 'surface-fore': withOpacityValue('--ax-color-surface-fore'),
94
+ 'on-surface-fore': withOpacityValue('--ax-color-on-surface-fore'),
95
+ 'primary-fore': withOpacityValue('--ax-color-primary-fore'),
96
+ 'secondary-fore': withOpacityValue('--ax-color-secondary-fore'),
97
+ 'success-fore': withOpacityValue('--ax-color-success-fore'),
98
+ 'warning-fore': withOpacityValue('--ax-color-warning-fore'),
99
+ 'danger-fore': withOpacityValue('--ax-color-danger-fore'),
100
+ },
101
+ backgroundColor: {
102
+ default: withOpacityValue('--ax-color-background-default'),
103
+ surface: withOpacityValue('--ax-color-surface'),
104
+ 'on-surface': withOpacityValue('--ax-color-on-surface'),
105
+ },
106
+ borderColor: {
107
+ default: 'rgba(var(--ax-color-border-default))',
108
+ },
99
109
  maxWidth: {
100
110
  '8xl': '90rem',
101
111
  },
@@ -120,14 +130,6 @@ module.exports = withAnimations({
120
130
  borderColor: 'rgb(var(--ax-color-border-default))',
121
131
  borderRadius: 'var(--ax-rounded-border-default)',
122
132
  },
123
- '.bg-default': {
124
- backgroundColor:
125
- 'rgb(var(--ax-color-default-background) / var(--tw-bg-opacity))',
126
- },
127
- '.text-default': {
128
- backgroundColor:
129
- 'rgb(var(--ax-color-default-color) / var(--tw-text-opacity))',
130
- },
131
133
  '.tabs-fit': {
132
134
  width: '100%',
133
135
  },