@mastorscdn/core 1.0.1 → 1.0.3
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/README.md +10 -10
- package/dist/mastors-core.css +3843 -196
- package/dist/mastors-core.css.map +1 -1
- package/dist/mastors-core.min.css +1 -1
- package/package.json +1 -1
- package/scss/_index.scss +14 -0
- package/scss/accessibility/_a11y.scss +3 -3
- package/scss/base/_reset.scss +6 -6
- package/scss/config/_settings.scss +218 -22
- package/scss/helpers/_states.scss +3 -1
- package/scss/mixins/_css-vars.scss +7 -0
- package/scss/themes/_dark.scss +31 -31
- package/scss/themes/_light.scss +31 -31
- package/scss/tokens/_colors.scss +342 -24
- package/scss/utilities/_borders.scss +6 -6
package/README.md
CHANGED
|
@@ -26,7 +26,7 @@ Mastors-Core is the **foundational layer** of the entire Mastors CDN ecosystem.
|
|
|
26
26
|
## Architecture
|
|
27
27
|
|
|
28
28
|
```
|
|
29
|
-
|
|
29
|
+
mastorscdn-core/
|
|
30
30
|
├── scss/
|
|
31
31
|
│ ├── config/ # Feature flags, settings
|
|
32
32
|
│ ├── tokens/ # Design tokens (colors, shadows, radius…)
|
|
@@ -54,13 +54,13 @@ mastors-core/
|
|
|
54
54
|
## Installation
|
|
55
55
|
|
|
56
56
|
```bash
|
|
57
|
-
npm install @
|
|
57
|
+
npm install @mastorscdn/core
|
|
58
58
|
```
|
|
59
59
|
|
|
60
60
|
Or with Yarn:
|
|
61
61
|
|
|
62
62
|
```bash
|
|
63
|
-
yarn add @
|
|
63
|
+
yarn add @mastorscdn/core
|
|
64
64
|
```
|
|
65
65
|
|
|
66
66
|
---
|
|
@@ -77,7 +77,7 @@ npm run sass:all
|
|
|
77
77
|
|
|
78
78
|
```scss
|
|
79
79
|
// Import the full API (functions, mixins, tokens — no CSS output)
|
|
80
|
-
@use '@
|
|
80
|
+
@use '@mastorscdn/core' as mc;
|
|
81
81
|
|
|
82
82
|
.my-card {
|
|
83
83
|
background-color: mc.color('surface');
|
|
@@ -94,7 +94,7 @@ npm run sass:all
|
|
|
94
94
|
### Use with configuration overrides
|
|
95
95
|
|
|
96
96
|
```scss
|
|
97
|
-
@use '@
|
|
97
|
+
@use '@mastorscdn/core' with (
|
|
98
98
|
$enable-dark-theme: true,
|
|
99
99
|
$enable-utilities: true,
|
|
100
100
|
$enable-accessibility: true,
|
|
@@ -118,7 +118,7 @@ In each library:
|
|
|
118
118
|
|
|
119
119
|
```scss
|
|
120
120
|
// At the top of every Mastors library
|
|
121
|
-
@use '@
|
|
121
|
+
@use '@mastorscdn/core' as mc;
|
|
122
122
|
|
|
123
123
|
// Then use core tokens, functions, mixins freely
|
|
124
124
|
.mastors-flex-row {
|
|
@@ -131,7 +131,7 @@ In each library:
|
|
|
131
131
|
## Token Functions
|
|
132
132
|
|
|
133
133
|
```scss
|
|
134
|
-
@use '@
|
|
134
|
+
@use '@mastorscdn/core' as mc;
|
|
135
135
|
|
|
136
136
|
// Color token
|
|
137
137
|
color: mc.color('primary'); // #2563eb
|
|
@@ -180,7 +180,7 @@ font-size: mc.em(14); // 0.875em
|
|
|
180
180
|
## Responsive Mixins
|
|
181
181
|
|
|
182
182
|
```scss
|
|
183
|
-
@use '@
|
|
183
|
+
@use '@mastorscdn/core' as mc;
|
|
184
184
|
|
|
185
185
|
.element {
|
|
186
186
|
// min-width (mobile first)
|
|
@@ -211,7 +211,7 @@ font-size: mc.em(14); // 0.875em
|
|
|
211
211
|
## Helper Mixins
|
|
212
212
|
|
|
213
213
|
```scss
|
|
214
|
-
@use '@
|
|
214
|
+
@use '@mastorscdn/core' as mc;
|
|
215
215
|
|
|
216
216
|
// Centering
|
|
217
217
|
.centered {
|
|
@@ -297,7 +297,7 @@ font-size: mc.em(14); // 0.875em
|
|
|
297
297
|
### Custom Theme (SCSS)
|
|
298
298
|
|
|
299
299
|
```scss
|
|
300
|
-
@use '@
|
|
300
|
+
@use '@mastorscdn/core/themes/custom' with (
|
|
301
301
|
$theme-name: 'enterprise',
|
|
302
302
|
$custom-tokens: (
|
|
303
303
|
'--mastors-color-primary': #0f4c75,
|