@mineui/tokens 0.0.2 → 0.0.4

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/README.md +38 -38
  2. package/package.json +2 -2
package/README.md CHANGED
@@ -8,7 +8,7 @@
8
8
  </div>
9
9
 
10
10
  <div align="center">
11
- <img src="https://img.shields.io/badge/v-0.0.2-black"/>
11
+ <img src="https://img.shields.io/badge/v-0.0.4-black"/>
12
12
  <a href="https://github.com/mineui-org"><img src="https://img.shields.io/badge/🔥-@mineui-black"/></a>
13
13
  <br>
14
14
  <img src="https://img.shields.io/badge/coverage-~%25-brightgreen" alt="Test Coverage" />
@@ -56,9 +56,9 @@
56
56
 
57
57
  ```scss
58
58
  .button {
59
- background: $blue-6; // Main blue
60
- color: $gray-0; // Almost white
61
- border: 1px solid $gray-3;
59
+ background : $blue-6; // Main blue
60
+ color : $gray-0; // Almost white
61
+ border : 1px solid $gray-3;
62
62
  }
63
63
  ```
64
64
 
@@ -66,10 +66,10 @@
66
66
 
67
67
  ```scss
68
68
  .card {
69
- padding: $sp-6; // 1.5rem (24px)
70
- font-size: $fs-lg; // 1.125rem (18px)
71
- font-weight: $fw-medium; // 500
72
- border-radius: $br-lg; // 0.5rem (8px)
69
+ padding : $sp-6; // 1.5rem (24px)
70
+ font-size : $fs-lg; // 1.125rem (18px)
71
+ font-weight : $fw-medium; // 500
72
+ border-radius : $br-lg; // 0.5rem (8px)
73
73
  }
74
74
  ```
75
75
 
@@ -86,18 +86,18 @@
86
86
 
87
87
  ```scss
88
88
  // Gray scale (12 shades)
89
- $gray-0 to $gray-11
90
-
89
+ $gray-0 to $gray-11
90
+
91
91
  // Brand colors (11 shades each)
92
- $blue-1 to $blue-11
93
- $green-1 to $green-11
94
- $red-1 to $red-11
95
- $amber-1 to $amber-11
92
+ $blue-1 to $blue-11
93
+ $green-1 to $green-11
94
+ $red-1 to $red-11
95
+ $amber-1 to $amber-11
96
96
  $orange-1 to $orange-11
97
97
  $purple-1 to $purple-11
98
- $pink-1 to $pink-11
99
- $cyan-1 to $cyan-11
100
- $teal-1 to $teal-11
98
+ $pink-1 to $pink-11
99
+ $cyan-1 to $cyan-11
100
+ $teal-1 to $teal-11
101
101
  $indigo-1 to $indigo-11
102
102
  ```
103
103
 
@@ -106,8 +106,8 @@
106
106
  > Perfect scale from 0 to 64 (0px to 256px).
107
107
 
108
108
  ```scss
109
- $sp-0, $sp-1, $sp-2, $sp-3, $sp-4, $sp-5, $sp-6,
110
- $sp-7, $sp-8, $sp-9, $sp-10, $sp-12, $sp-14, $sp-16,
109
+ $sp-0, $sp-1, $sp-2, $sp-3, $sp-4, $sp-5, $sp-6,
110
+ $sp-7, $sp-8, $sp-9, $sp-10, $sp-12, $sp-14, $sp-16,
111
111
  $sp-20, $sp-24, $sp-28, $sp-32, $sp-36, $sp-40,
112
112
  $sp-44, $sp-48, $sp-52, $sp-56, $sp-60, $sp-64
113
113
  ```
@@ -119,16 +119,16 @@
119
119
  ```scss
120
120
  // Families
121
121
  $font-sans, $font-serif, $font-mono, $font-arabic
122
-
122
+
123
123
  // Sizes
124
124
  $fs-xs to $fs-9xl
125
-
125
+
126
126
  // Weights
127
127
  $fw-thin to $fw-black
128
-
128
+
129
129
  // Line heights
130
130
  $lh-none to $lh-loose
131
-
131
+
132
132
  // Letter spacing
133
133
  $ls-tighter to $ls-widest
134
134
  ```
@@ -140,7 +140,7 @@
140
140
  ```scss
141
141
  // Widths
142
142
  $bw-0 to $bw-8
143
-
143
+
144
144
  // Radius
145
145
  $br-none to $br-3xl, $br-full
146
146
  ```
@@ -152,8 +152,8 @@
152
152
  ```scss
153
153
  // Light mode
154
154
  $shadow-xs, $shadow-sm, $shadow-base, $shadow-md,
155
- $shadow-lg, $shadow-xl, $shadow-2xl, $shadow-inner
156
-
155
+ $shadow-lg, $shadow-xl, $shadow-2xl, $shadow-inner
156
+
157
157
  // Dark mode
158
158
  $shadow-xs-dark to $shadow-2xl-dark
159
159
  ```
@@ -164,8 +164,8 @@
164
164
 
165
165
  ```scss
166
166
  $z-0 to $z-50
167
- $z-dropdown, $z-sticky, $z-fixed, $z-backdrop,
168
- $z-modal, $z-popover, $z-tooltip, $z-notification
167
+ $z-dropdown, $z-sticky, $z-fixed, $z-backdrop,
168
+ $z-modal, $z-popover, $z-tooltip, $z-notification
169
169
  ```
170
170
 
171
171
  - #### Transitions
@@ -175,7 +175,7 @@
175
175
  ```scss
176
176
  // Durations
177
177
  $dur-instant to $dur-slowest
178
-
178
+
179
179
  // Easings
180
180
  $ease-linear, $ease-in, $ease-out, $ease-in-out,
181
181
  $ease-bounce, $ease-elastic
@@ -186,7 +186,7 @@
186
186
  > 0% to 100% in useful increments.
187
187
 
188
188
  ```scss
189
- $opacity-0, $opacity-5, $opacity-10, $opacity-20,
189
+ $opacity-0, $opacity-5, $opacity-10, $opacity-20,
190
190
  $opacity-25, $opacity-30, $opacity-40, $opacity-50,
191
191
  $opacity-60, $opacity-70, $opacity-75, $opacity-80,
192
192
  $opacity-90, $opacity-95, $opacity-100
@@ -197,12 +197,12 @@
197
197
  > Responsive design breakpoints.
198
198
 
199
199
  ```scss
200
- $bp-xs: 0
201
- $bp-sm: 640px
202
- $bp-md: 768px
203
- $bp-lg: 1024px
204
- $bp-xl: 1280px
205
- $bp-2xl: 1536px
200
+ $bp-xs : 0
201
+ $bp-sm : 640px
202
+ $bp-md : 768px
203
+ $bp-lg : 1024px
204
+ $bp-xl : 1280px
205
+ $bp-2xl : 1536px
206
206
  ```
207
207
 
208
208
  - #### Sizes
@@ -226,8 +226,8 @@
226
226
  > Common aspect ratios.
227
227
 
228
228
  ```scss
229
- $aspect-square, $aspect-video, $aspect-4-3,
230
- $aspect-21-9, $aspect-portrait, $aspect-auto
229
+ $aspect-square, $aspect-video, $aspect-4-3,
230
+ $aspect-21-9, $aspect-portrait, $aspect-auto
231
231
  ```
232
232
 
233
233
  <div align="center"> <img src="./assets/img/line.png" alt="line" style="display: block; margin-top:20px;margin-bottom:20px;width:500px;"/> </div>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mineui/tokens",
3
- "version": "0.0.2",
4
- "description": "tokens",
3
+ "version": "0.0.4",
4
+ "description": "350+ design tokens for modern UI systems—colors, spacing, typography, shadows, and more in HSL format",
5
5
  "keywords": ["mine", "ui", "tokens"],
6
6
  "license": "MIT",
7
7
  "homepage": "https://github.com/mineui-org/tokens#readme",