@maggioli-design-system/styles 9.0.0 → 10.0.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 (19) hide show
  1. package/package.json +11 -10
  2. package/dist/css/base.css +0 -96
  3. package/dist/css/colors-hex-brand-synbee.css +0 -208
  4. package/dist/css/colors-hex-brand.css +0 -49
  5. package/dist/css/colors-hex-label.css +0 -346
  6. package/dist/css/colors-hex-status.css +0 -148
  7. package/dist/css/colors-hex-tones.css +0 -181
  8. package/dist/css/colors-hex.css +0 -868
  9. package/dist/css/colors-rgb-brand-synbee.css +0 -208
  10. package/dist/css/colors-rgb-brand.css +0 -49
  11. package/dist/css/colors-rgb-label.css +0 -346
  12. package/dist/css/colors-rgb-status.css +0 -148
  13. package/dist/css/colors-rgb-tones.css +0 -181
  14. package/dist/css/colors-rgb.css +0 -868
  15. package/dist/css/globals.css +0 -14
  16. package/dist/css/reset.css +0 -463
  17. package/dist/css/typography.css +0 -148
  18. package/dist/tailwind/base.css +0 -96
  19. package/dist/tailwind/typography.css +0 -151
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@maggioli-design-system/styles",
3
- "version": "9.0.0",
3
+ "version": "10.0.0",
4
4
  "description": "This module contains SCSS and CSS styles used by Maggioli Design System, it also makes available a Tailwind config based on Maggioli design tokens.",
5
5
  "main": "./tailwind.config.js",
6
6
  "scripts": {
@@ -41,17 +41,18 @@
41
41
  ],
42
42
  "license": "ISC",
43
43
  "dependencies": {
44
- "@fontsource/karla": "^4.5.8",
45
- "@fontsource/merriweather": "^4.5.12",
46
- "@fontsource/roboto": "^4.5.7",
47
- "@maggioli-design-system/design-tokens": "^9.0.0",
44
+ "@fontsource/karla": "^4.5.10",
45
+ "@fontsource/merriweather": "^4.5.14",
46
+ "@fontsource/roboto": "^4.5.8",
47
+ "@fontsource/roboto-mono": "^4.5.8",
48
+ "@maggioli-design-system/design-tokens": "^10.0.0",
48
49
  "normalize.css": "^8.0.1"
49
50
  },
50
51
  "devDependencies": {
51
- "autoprefixer": "^10.4.7",
52
- "postcss-cli": "^9.1.0",
53
- "postcss": "^8.4.13",
54
- "postcss-import": "^14.0.7",
55
- "tailwindcss": "^3.1.8"
52
+ "autoprefixer": "^10.4.13",
53
+ "postcss-cli": "^10.1.0",
54
+ "postcss": "^8.4.19",
55
+ "postcss-import": "^15.0.1",
56
+ "tailwindcss": "^3.2.4"
56
57
  }
57
58
  }
package/dist/css/base.css DELETED
@@ -1,96 +0,0 @@
1
-
2
- html {
3
- scroll-behavior: smooth;
4
- }
5
- body,
6
- html {
7
- margin: 0px;
8
- }
9
- body {
10
- font-size: 1rem;
11
- line-height: 1.5rem;
12
- font-family: Karla, -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', 'Helvetica Neue', sans-serif;
13
- --tw-text-opacity: 1;
14
- color: rgba(var(--tone-neutral-02), var(--tw-text-opacity));
15
-
16
- -moz-osx-font-smoothing: grayscale;
17
- -webkit-font-smoothing: antialiased;
18
- -webkit-tap-highlight-color: transparent;
19
- text-rendering: optimizelegibility;
20
- -webkit-text-size-adjust: 100%;
21
- -moz-text-size-adjust: 100%;
22
- text-size-adjust: 100%;
23
- }
24
- ::-moz-selection {
25
- background-color: var(--selection-background, rgb(var(--label-sky-09)));
26
- color: var(--selection-color, rgb(var(--label-sky-01)));
27
- }
28
- ::selection {
29
- background-color: var(--selection-background, rgb(var(--label-sky-09)));
30
- color: var(--selection-color, rgb(var(--label-sky-01)));
31
- }
32
- button,
33
- optgroup,
34
- select {
35
- font-family: Roboto, -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', 'Helvetica Neue', sans-serif;
36
- font-weight: 500;
37
- line-height: 1.625;
38
- -webkit-font-smoothing: antialiased;
39
- -moz-osx-font-smoothing: grayscale;
40
- }
41
- input,
42
- textarea {
43
- -webkit-appearance: none;
44
- -moz-appearance: none;
45
- appearance: none;
46
-
47
- font-family: inherit;
48
- }
49
- b,
50
- strong {
51
- font-weight: 600;
52
- letter-spacing: -0.025em;
53
- }
54
- a {
55
- --tw-text-opacity: 1;
56
- color: rgba(var(--brand-maggioli-03), var(--tw-text-opacity));
57
-
58
- font-family: inherit;
59
- font-size: inherit;
60
- font-weight: inherit;
61
- }
62
- a,
63
- aside,
64
- body,
65
- code,
66
- div,
67
- datalist,
68
- footer,
69
- form,
70
- h1,
71
- h2,
72
- h3,
73
- h4,
74
- h5,
75
- h6,
76
- header,
77
- hr,
78
- html,
79
- input,
80
- li,
81
- main,
82
- section,
83
- span,
84
- ul,
85
- textarea {
86
- box-sizing: border-box;
87
- }
88
- h1,
89
- h2,
90
- h3,
91
- h4,
92
- h5,
93
- h6,
94
- p {
95
- margin: 0px;
96
- }
package/dist/css/colors-hex-brand-synbee.css DELETED
@@ -1,208 +0,0 @@
1
- /*
2
- Generated by Style Dictionary
3
- Do not edit directly
4
- Generated at Tue, 04 Oct 2022 09:16:57 GMT
5
- */
6
-
7
- :root {
8
- --brand-synbee-eolo-01: #2b4066;
9
- --brand-synbee-eolo-02: #324a76;
10
- --brand-synbee-eolo-03: #3d5b91;
11
- --brand-synbee-eolo-04: #496dad;
12
- --brand-synbee-eolo-05: #6585be;
13
- --brand-synbee-eolo-06: #8aa2ce;
14
- --brand-synbee-eolo-07: #b0c1de;
15
- --brand-synbee-eolo-08: #cfd9eb;
16
- --brand-synbee-eolo-09: #e3e9f3;
17
- --brand-synbee-eolo-10: #f2f5f9;
18
- --brand-synbee-eolo: #597cb9;
19
- --brand-synbee-eolo-v1-01: #1a263d;
20
- --brand-synbee-eolo-v1-02: #233452;
21
- --brand-synbee-eolo-v1-03: #2b4066;
22
- --brand-synbee-eolo-v1-04: #334c79;
23
- --brand-synbee-eolo-v1-05: #3b598d;
24
- --brand-synbee-eolo-v1-06: #4465a0;
25
- --brand-synbee-eolo-v1-07: #4c72b4;
26
- --brand-synbee-eolo-v1-08: #5d80bb;
27
- --brand-synbee-eolo-v1-09: #708ec3;
28
- --brand-synbee-eolo-v1-10: #859ecb;
29
- --brand-synbee-eolo-v1-11: #98aed4;
30
- --brand-synbee-eolo-v1-12: #acbddc;
31
- --brand-synbee-eolo-v1-13: #bccae3;
32
- --brand-synbee-eolo-v1-14: #c6d2e7;
33
- --brand-synbee-eolo-v1-15: #cfd9eb;
34
- --brand-synbee-eolo-v1-16: #d8e0ee;
35
- --brand-synbee-eolo-v1-17: #e0e7f2;
36
- --brand-synbee-eolo-v1-18: #e9eef6;
37
- --brand-synbee-eolo-v1-19: #f0f3f9;
38
- --brand-synbee-eolo-v1-20: #f6f8fb;
39
- --brand-synbee-eolo-v1: #597cb9;
40
- --brand-synbee-01: #513e00;
41
- --brand-synbee-02: #5e4800;
42
- --brand-synbee-03: #735800;
43
- --brand-synbee-04: #896900;
44
- --brand-synbee-05: #a67f00;
45
- --brand-synbee-06: #c99b00;
46
- --brand-synbee-07: #efb800;
47
- --brand-synbee-08: #ffd446;
48
- --brand-synbee-09: #ffe89a;
49
- --brand-synbee-10: #fff5d5;
50
- --brand-synbee: #ffcf30;
51
- --adjust-tone-01: #262626;
52
- --adjust-tone-02: #343434;
53
- --adjust-tone-03: #404040;
54
- --adjust-tone-04: #4c4c4c;
55
- --adjust-tone-05: #595959;
56
- --adjust-tone-06: #656565;
57
- --adjust-tone-07: #727272;
58
- --adjust-tone-08: #7f7f7f;
59
- --adjust-tone-09: #8d8d8d;
60
- --adjust-tone-10: #9d9d9d;
61
- --adjust-tone-11: #acacac;
62
- --adjust-tone-12: #bcbcbc;
63
- --adjust-tone-13: #c9c9c9;
64
- --adjust-tone-14: #d2d2d2;
65
- --adjust-tone-15: #d9d9d9;
66
- --adjust-tone-16: #dfdfdf;
67
- --adjust-tone-17: #e7e7e7;
68
- --adjust-tone-18: #ededed;
69
- --adjust-tone-19: #f3f3f3;
70
- --adjust-tone-20: #f9f9f9;
71
- --adjust-tone: #ffffff;
72
- }
73
-
74
- :root.dark-mode {
75
- --brand-synbee-eolo-01: #a3b6d8;
76
- --brand-synbee-eolo-02: #91a8d1;
77
- --brand-synbee-eolo-03: #7692c5;
78
- --brand-synbee-eolo-04: #5b7eba;
79
- --brand-synbee-eolo-05: #4567a3;
80
- --brand-synbee-eolo-06: #354f7d;
81
- --brand-synbee-eolo-07: #26395b;
82
- --brand-synbee-eolo-08: #1b283f;
83
- --brand-synbee-eolo-09: #131c2c;
84
- --brand-synbee-eolo-10: #090e16;
85
- --brand-synbee-eolo: #597cb9;
86
- --brand-synbee-eolo-v1-01: #d1daeb;
87
- --brand-synbee-eolo-v1-02: #bac8e2;
88
- --brand-synbee-eolo-v1-03: #a3b6d8;
89
- --brand-synbee-eolo-v1-04: #8ea6cf;
90
- --brand-synbee-eolo-v1-05: #7a96c7;
91
- --brand-synbee-eolo-v1-06: #6686bf;
92
- --brand-synbee-eolo-v1-07: #5579b7;
93
- --brand-synbee-eolo-v1-08: #486caa;
94
- --brand-synbee-eolo-v1-09: #405f97;
95
- --brand-synbee-eolo-v1-10: #375282;
96
- --brand-synbee-eolo-v1-11: #2f4770;
97
- --brand-synbee-eolo-v1-12: #283c5e;
98
- --brand-synbee-eolo-v1-13: #223351;
99
- --brand-synbee-eolo-v1-14: #1e2d47;
100
- --brand-synbee-eolo-v1-15: #1b283f;
101
- --brand-synbee-eolo-v1-16: #172337;
102
- --brand-synbee-eolo-v1-17: #131d2e;
103
- --brand-synbee-eolo-v1-18: #101725;
104
- --brand-synbee-eolo-v1-19: #0b101a;
105
- --brand-synbee-eolo-v1-20: #06090f;
106
- --brand-synbee-eolo-v1: #597cb9;
107
- --brand-synbee-01: #e2ae00;
108
- --brand-synbee-02: #d1a000;
109
- --brand-synbee-03: #b68c00;
110
- --brand-synbee-04: #9d7800;
111
- --brand-synbee-05: #816300;
112
- --brand-synbee-06: #644c00;
113
- --brand-synbee-07: #483700;
114
- --brand-synbee-08: #332700;
115
- --brand-synbee-09: #231b00;
116
- --brand-synbee-10: #120e00;
117
- --brand-synbee: #ffcf30;
118
- --adjust-tone-01: #d9d9d9;
119
- --adjust-tone-02: #c7c7c7;
120
- --adjust-tone-03: #b5b5b5;
121
- --adjust-tone-04: #a4a4a4;
122
- --adjust-tone-05: #959595;
123
- --adjust-tone-06: #858585;
124
- --adjust-tone-07: #787878;
125
- --adjust-tone-08: #6c6c6c;
126
- --adjust-tone-09: #606060;
127
- --adjust-tone-10: #525252;
128
- --adjust-tone-11: #474747;
129
- --adjust-tone-12: #3c3c3c;
130
- --adjust-tone-13: #333333;
131
- --adjust-tone-14: #2d2d2d;
132
- --adjust-tone-15: #282828;
133
- --adjust-tone-16: #222222;
134
- --adjust-tone-17: #1d1d1d;
135
- --adjust-tone-18: #181818;
136
- --adjust-tone-19: #101010;
137
- --adjust-tone-20: #080808;
138
- --adjust-tone: #000000;
139
- }
140
-
141
- @media (prefers-color-scheme: dark) {
142
- :root.system-mode {
143
- --brand-synbee-eolo-01: #a3b6d8;
144
- --brand-synbee-eolo-02: #91a8d1;
145
- --brand-synbee-eolo-03: #7692c5;
146
- --brand-synbee-eolo-04: #5b7eba;
147
- --brand-synbee-eolo-05: #4567a3;
148
- --brand-synbee-eolo-06: #354f7d;
149
- --brand-synbee-eolo-07: #26395b;
150
- --brand-synbee-eolo-08: #1b283f;
151
- --brand-synbee-eolo-09: #131c2c;
152
- --brand-synbee-eolo-10: #090e16;
153
- --brand-synbee-eolo: #597cb9;
154
- --brand-synbee-eolo-v1-01: #d1daeb;
155
- --brand-synbee-eolo-v1-02: #bac8e2;
156
- --brand-synbee-eolo-v1-03: #a3b6d8;
157
- --brand-synbee-eolo-v1-04: #8ea6cf;
158
- --brand-synbee-eolo-v1-05: #7a96c7;
159
- --brand-synbee-eolo-v1-06: #6686bf;
160
- --brand-synbee-eolo-v1-07: #5579b7;
161
- --brand-synbee-eolo-v1-08: #486caa;
162
- --brand-synbee-eolo-v1-09: #405f97;
163
- --brand-synbee-eolo-v1-10: #375282;
164
- --brand-synbee-eolo-v1-11: #2f4770;
165
- --brand-synbee-eolo-v1-12: #283c5e;
166
- --brand-synbee-eolo-v1-13: #223351;
167
- --brand-synbee-eolo-v1-14: #1e2d47;
168
- --brand-synbee-eolo-v1-15: #1b283f;
169
- --brand-synbee-eolo-v1-16: #172337;
170
- --brand-synbee-eolo-v1-17: #131d2e;
171
- --brand-synbee-eolo-v1-18: #101725;
172
- --brand-synbee-eolo-v1-19: #0b101a;
173
- --brand-synbee-eolo-v1-20: #06090f;
174
- --brand-synbee-eolo-v1: #597cb9;
175
- --brand-synbee-01: #e2ae00;
176
- --brand-synbee-02: #d1a000;
177
- --brand-synbee-03: #b68c00;
178
- --brand-synbee-04: #9d7800;
179
- --brand-synbee-05: #816300;
180
- --brand-synbee-06: #644c00;
181
- --brand-synbee-07: #483700;
182
- --brand-synbee-08: #332700;
183
- --brand-synbee-09: #231b00;
184
- --brand-synbee-10: #120e00;
185
- --brand-synbee: #ffcf30;
186
- --adjust-tone-01: #d9d9d9;
187
- --adjust-tone-02: #c7c7c7;
188
- --adjust-tone-03: #b5b5b5;
189
- --adjust-tone-04: #a4a4a4;
190
- --adjust-tone-05: #959595;
191
- --adjust-tone-06: #858585;
192
- --adjust-tone-07: #787878;
193
- --adjust-tone-08: #6c6c6c;
194
- --adjust-tone-09: #606060;
195
- --adjust-tone-10: #525252;
196
- --adjust-tone-11: #474747;
197
- --adjust-tone-12: #3c3c3c;
198
- --adjust-tone-13: #333333;
199
- --adjust-tone-14: #2d2d2d;
200
- --adjust-tone-15: #282828;
201
- --adjust-tone-16: #222222;
202
- --adjust-tone-17: #1d1d1d;
203
- --adjust-tone-18: #181818;
204
- --adjust-tone-19: #101010;
205
- --adjust-tone-20: #080808;
206
- --adjust-tone: #000000;
207
- }
208
- }
package/dist/css/colors-hex-brand.css DELETED
@@ -1,49 +0,0 @@
1
- /*
2
- Generated by Style Dictionary
3
- Do not edit directly
4
- Generated at Tue, 04 Oct 2022 09:16:57 GMT
5
- */
6
-
7
- :root {
8
- --brand-maggioli-01: #00379e;
9
- --brand-maggioli-02: #0240b4;
10
- --brand-maggioli-03: #0a50d4;
11
- --brand-maggioli-04: #1f65e8;
12
- --brand-maggioli-05: #5183df;
13
- --brand-maggioli-06: #85a2da;
14
- --brand-maggioli-07: #b2c1dc;
15
- --brand-maggioli-08: #d2d8e4;
16
- --brand-maggioli-09: #e6e9ed;
17
- --brand-maggioli-10: #f4f5f6;
18
- --brand-maggioli: #00379e;
19
- }
20
-
21
- :root.dark-mode {
22
- --brand-maggioli-01: #a3b6db;
23
- --brand-maggioli-02: #8da8da;
24
- --brand-maggioli-03: #6a91dc;
25
- --brand-maggioli-04: #447ae1;
26
- --brand-maggioli-05: #135ce6;
27
- --brand-maggioli-06: #0344be;
28
- --brand-maggioli-07: #01318c;
29
- --brand-maggioli-08: #07255c;
30
- --brand-maggioli-09: #0c1b37;
31
- --brand-maggioli-10: #0b0e14;
32
- --brand-maggioli: #00379e;
33
- }
34
-
35
- @media (prefers-color-scheme: dark) {
36
- :root.system-mode {
37
- --brand-maggioli-01: #a3b6db;
38
- --brand-maggioli-02: #8da8da;
39
- --brand-maggioli-03: #6a91dc;
40
- --brand-maggioli-04: #447ae1;
41
- --brand-maggioli-05: #135ce6;
42
- --brand-maggioli-06: #0344be;
43
- --brand-maggioli-07: #01318c;
44
- --brand-maggioli-08: #07255c;
45
- --brand-maggioli-09: #0c1b37;
46
- --brand-maggioli-10: #0b0e14;
47
- --brand-maggioli: #00379e;
48
- }
49
- }