@medquantis/design-system 1.0.1 → 1.1.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.
- package/README.md +57 -1
- package/css/base.css +2 -2
- package/css/components.css +2 -2
- package/css/kit/document.css +91 -0
- package/css/kit/print.css +81 -0
- package/css/kit/slide-frame.css +99 -0
- package/css/slide.css +1 -1
- package/dist/DESIGN.md +891 -0
- package/dist/kit/brand.css +12 -0
- package/dist/kit/core.css +69 -0
- package/dist/kit/dataviz.css +16 -0
- package/dist/kit/document.css +104 -0
- package/dist/kit/guidance.md +310 -0
- package/dist/kit/print.css +95 -0
- package/dist/kit/slide-frame.css +114 -0
- package/dist/kit/space-shape.css +13 -0
- package/dist/kit/type.css +17 -0
- package/dist/llms-full.txt +5 -1
- package/dist/llms.txt +23 -23
- package/dist/tokens.css +4 -0
- package/dist/tokens.json +44 -0
- package/kit-manifest.json +14 -0
- package/package.json +11 -2
package/dist/llms-full.txt
CHANGED
|
@@ -756,7 +756,7 @@ Every local one-off (a component or a token a consumer adds under its own prefix
|
|
|
756
756
|
|
|
757
757
|
# Tokens
|
|
758
758
|
|
|
759
|
-
Every token of release 1.0
|
|
759
|
+
Every token of release 1.1.0, generated from dist/tokens.json. Consumers use the semantic names; the `--mq-core-*` names exist so semantic tokens can point at them. A deprecated token names its replacement.
|
|
760
760
|
|
|
761
761
|
## Semantic tokens
|
|
762
762
|
|
|
@@ -838,6 +838,8 @@ Every token of release 1.0.1, generated from dist/tokens.json. Consumers use the
|
|
|
838
838
|
| `--mq-font-weight-emphasis` | `600` | Owner ruling 4, 2026-10-09: a short highlighted word inside body text, as the Med of the logo. |
|
|
839
839
|
| `--mq-font-weight-body` | `400` | Body text. |
|
|
840
840
|
| `--mq-font-weight-light` | `300` | Owner ruling 6, 2026-10-09: only the Quantis half of the wordmark; never for headings or body text. |
|
|
841
|
+
| `--mq-font-line-height-body` | `1.55` | Body line height of documents, slides and pages (owner, 2026-10-15). |
|
|
842
|
+
| `--mq-font-line-height-tight` | `1.15` | Tight line height of section titles; the display title keeps its own 1.08 (owner, 2026-10-15). |
|
|
841
843
|
| `--mq-font-size-hero-min` | `34px` | Hero title at the narrowest viewport. |
|
|
842
844
|
| `--mq-font-size-hero-max` | `56px` | Hero title at the widest viewport. |
|
|
843
845
|
| `--mq-font-size-h2` | `32px` | Section title. |
|
|
@@ -917,6 +919,8 @@ Every token of release 1.0.1, generated from dist/tokens.json. Consumers use the
|
|
|
917
919
|
| `--mq-core-font-size-56` | `56px` | Font size 56 px (Report design system, 2026-10-08). |
|
|
918
920
|
| `--mq-core-font-size-12-5` | `12.5px` | Font size 12.5 px (Report design system, 2026-10-08). |
|
|
919
921
|
| `--mq-core-font-size-16-5` | `16.5px` | Font size 16.5 px (Report design system, 2026-10-08). |
|
|
922
|
+
| `--mq-core-font-line-height-1-15` | `1.15` | Line height 1.15, the tight end of headings, counters and stat figures (owner, 2026-10-15). |
|
|
923
|
+
| `--mq-core-font-line-height-1-55` | `1.55` | Line height 1.55 of app UI text, labels, descriptions and the document body (owner, 2026-10-15). |
|
|
920
924
|
| `--mq-core-radius-3` | `3px` | Owner ruling 3, 2026-10-09: small items (tags, inputs, chips). |
|
|
921
925
|
| `--mq-core-radius-6` | `6px` | Owner ruling 3, 2026-10-09: cards and panels; the maximum anywhere, no pill shapes. |
|
|
922
926
|
| `--mq-core-radius-12` | `12px` | Owner ruling 3, amended 2026-10-10: the one exception above 6 px, for app dialogs and modals, side drawers and command palettes only; never in documents, slides, cards or website media. |
|
package/dist/llms.txt
CHANGED
|
@@ -8,32 +8,32 @@ The links below point at the exact release on the jsDelivr CDN; pin that version
|
|
|
8
8
|
|
|
9
9
|
## Guidelines
|
|
10
10
|
|
|
11
|
-
- [Principles](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
12
|
-
- [Brand](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
13
|
-
- [Voice](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
14
|
-
- [Writing](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
15
|
-
- [Colour](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
16
|
-
- [Typography](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
17
|
-
- [Layout](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
18
|
-
- [Charts](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
19
|
-
- [Data patterns](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
20
|
-
- [Accessibility](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
21
|
-
- [Specialising the design system](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
11
|
+
- [Principles](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/principles.md): The principles that decide the cases the other files do not cover
|
|
12
|
+
- [Brand](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/brand.md): Name, tagline, legal line, wordmark, monogram, favicon, icons
|
|
13
|
+
- [Voice](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/voice.md): Tone, words to prefer and avoid, languages, terminology in French, German, Italian and English
|
|
14
|
+
- [Writing](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/writing.md): No em or en dash, titles, sentences and lists, French typography
|
|
15
|
+
- [Colour](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/colour.md): Semantic colour tokens, the medium split, navy panels, states by mark style, status colours in apps
|
|
16
|
+
- [Typography](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/typography.md): Families, weights, roles, sizes and line heights
|
|
17
|
+
- [Layout](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/layout.md): Media, report skeleton, widths and spacing, radius, components, tables, app patterns, print
|
|
18
|
+
- [Charts](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/charts.md): The ordered palette, highlight on grey, sequential and diverging use, marks, legends
|
|
19
|
+
- [Data patterns](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/data-patterns.md): Numbers, amounts, dates, null versus zero, confidential and illustrative data
|
|
20
|
+
- [Accessibility](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/accessibility.md): WCAG 2.2 AA, contrast pairs, focus, targets, motion, structure
|
|
21
|
+
- [Specialising the design system](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/specialising.md): Framework neutrality, the four rules, the promotion tests, the one-off log
|
|
22
22
|
|
|
23
23
|
## Tokens and CSS
|
|
24
24
|
|
|
25
|
-
- [tokens.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
26
|
-
- [tokens.json](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
27
|
-
- [tailwind.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
28
|
-
- [base.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
29
|
-
- [components.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
30
|
-
- [slide.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
31
|
-
- [print.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
32
|
-
- [app.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
33
|
-
- [fonts.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
25
|
+
- [tokens.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/dist/tokens.css): every token as a `--mq-*` custom property; load it first
|
|
26
|
+
- [tokens.json](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/dist/tokens.json): every token with its resolved value and description
|
|
27
|
+
- [tailwind.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/dist/tailwind.css): Tailwind 4 theme with 50 to 950 scales, for apps
|
|
28
|
+
- [base.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/css/base.css): typography roles for documents
|
|
29
|
+
- [components.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/css/components.css): the shared `mq-` document components
|
|
30
|
+
- [slide.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/css/slide.css): the 1280 by 720 slide canvas
|
|
31
|
+
- [print.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/css/print.css): A4 pages with exact colour printing
|
|
32
|
+
- [app.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/css/app.css): status badges, for interactive apps only
|
|
33
|
+
- [fonts.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/fonts/fonts.css): self-hosted Outfit, Newsreader and Geist Mono
|
|
34
34
|
|
|
35
35
|
## Optional
|
|
36
36
|
|
|
37
|
-
- [llms-full.txt](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
38
|
-
- [kit-contract.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
39
|
-
- [Guidelines index](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.0
|
|
37
|
+
- [llms-full.txt](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/dist/llms-full.txt): every guideline in full and every token with its value
|
|
38
|
+
- [kit-contract.css](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/dist/kit-contract.css): unprefixed names for homemade-claude-kit renderers only, never loaded in an app
|
|
39
|
+
- [Guidelines index](https://cdn.jsdelivr.net/npm/@medquantis/design-system@1.1.0/guidelines/README.md): the file list and where each legacy rule went
|
package/dist/tokens.css
CHANGED
|
@@ -59,6 +59,8 @@
|
|
|
59
59
|
--mq-core-font-size-56: 56px; /** Font size 56 px (Report design system, 2026-10-08). */
|
|
60
60
|
--mq-core-font-size-12-5: 12.5px; /** Font size 12.5 px (Report design system, 2026-10-08). */
|
|
61
61
|
--mq-core-font-size-16-5: 16.5px; /** Font size 16.5 px (Report design system, 2026-10-08). */
|
|
62
|
+
--mq-core-font-line-height-1-15: 1.15; /** Line height 1.15, the tight end of headings, counters and stat figures (owner, 2026-10-15). */
|
|
63
|
+
--mq-core-font-line-height-1-55: 1.55; /** Line height 1.55 of app UI text, labels, descriptions and the document body (owner, 2026-10-15). */
|
|
62
64
|
--mq-core-radius-3: 3px; /** Owner ruling 3, 2026-10-09: small items (tags, inputs, chips). */
|
|
63
65
|
--mq-core-radius-6: 6px; /** Owner ruling 3, 2026-10-09: cards and panels; the maximum anywhere, no pill shapes. */
|
|
64
66
|
--mq-core-radius-12: 12px; /** Owner ruling 3, amended 2026-10-10: the one exception above 6 px, for app dialogs and modals, side drawers and command palettes only; never in documents, slides, cards or website media. */
|
|
@@ -158,6 +160,8 @@
|
|
|
158
160
|
--mq-font-weight-emphasis: 600; /** Owner ruling 4, 2026-10-09: a short highlighted word inside body text, as the Med of the logo. */
|
|
159
161
|
--mq-font-weight-body: 400; /** Body text. */
|
|
160
162
|
--mq-font-weight-light: 300; /** Owner ruling 6, 2026-10-09: only the Quantis half of the wordmark; never for headings or body text. */
|
|
163
|
+
--mq-font-line-height-body: 1.55; /** Body line height of documents, slides and pages (owner, 2026-10-15). */
|
|
164
|
+
--mq-font-line-height-tight: 1.15; /** Tight line height of section titles; the display title keeps its own 1.08 (owner, 2026-10-15). */
|
|
161
165
|
--mq-font-size-hero-min: 34px; /** Hero title at the narrowest viewport. */
|
|
162
166
|
--mq-font-size-hero-max: 56px; /** Hero title at the widest viewport. */
|
|
163
167
|
--mq-font-size-h2: 32px; /** Section title. */
|
package/dist/tokens.json
CHANGED
|
@@ -572,6 +572,28 @@
|
|
|
572
572
|
],
|
|
573
573
|
"description": "Font size 16.5 px (Report design system, 2026-10-08)."
|
|
574
574
|
},
|
|
575
|
+
"--mq-core-font-line-height-1-15": {
|
|
576
|
+
"value": 1.15,
|
|
577
|
+
"type": "number",
|
|
578
|
+
"path": [
|
|
579
|
+
"core",
|
|
580
|
+
"font",
|
|
581
|
+
"line-height",
|
|
582
|
+
"1-15"
|
|
583
|
+
],
|
|
584
|
+
"description": "Line height 1.15, the tight end of headings, counters and stat figures (owner, 2026-10-15)."
|
|
585
|
+
},
|
|
586
|
+
"--mq-core-font-line-height-1-55": {
|
|
587
|
+
"value": 1.55,
|
|
588
|
+
"type": "number",
|
|
589
|
+
"path": [
|
|
590
|
+
"core",
|
|
591
|
+
"font",
|
|
592
|
+
"line-height",
|
|
593
|
+
"1-55"
|
|
594
|
+
],
|
|
595
|
+
"description": "Line height 1.55 of app UI text, labels, descriptions and the document body (owner, 2026-10-15)."
|
|
596
|
+
},
|
|
575
597
|
"--mq-core-radius-3": {
|
|
576
598
|
"value": "3px",
|
|
577
599
|
"type": "dimension",
|
|
@@ -1590,6 +1612,28 @@
|
|
|
1590
1612
|
],
|
|
1591
1613
|
"description": "Owner ruling 6, 2026-10-09: only the Quantis half of the wordmark; never for headings or body text."
|
|
1592
1614
|
},
|
|
1615
|
+
"--mq-font-line-height-body": {
|
|
1616
|
+
"value": 1.55,
|
|
1617
|
+
"type": "number",
|
|
1618
|
+
"path": [
|
|
1619
|
+
"semantic",
|
|
1620
|
+
"font",
|
|
1621
|
+
"line-height",
|
|
1622
|
+
"body"
|
|
1623
|
+
],
|
|
1624
|
+
"description": "Body line height of documents, slides and pages (owner, 2026-10-15)."
|
|
1625
|
+
},
|
|
1626
|
+
"--mq-font-line-height-tight": {
|
|
1627
|
+
"value": 1.15,
|
|
1628
|
+
"type": "number",
|
|
1629
|
+
"path": [
|
|
1630
|
+
"semantic",
|
|
1631
|
+
"font",
|
|
1632
|
+
"line-height",
|
|
1633
|
+
"tight"
|
|
1634
|
+
],
|
|
1635
|
+
"description": "Tight line height of section titles; the display title keeps its own 1.08 (owner, 2026-10-15)."
|
|
1636
|
+
},
|
|
1593
1637
|
"--mq-font-size-hero-min": {
|
|
1594
1638
|
"value": "34px",
|
|
1595
1639
|
"type": "dimension",
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
{
|
|
2
|
+
"contractVersion": "2.0.0",
|
|
3
|
+
"provides": {
|
|
4
|
+
"core": "./kit/core.css",
|
|
5
|
+
"dataviz": "./kit/dataviz.css",
|
|
6
|
+
"type": "./kit/type.css",
|
|
7
|
+
"space-shape": "./kit/space-shape.css",
|
|
8
|
+
"document": "./kit/document.css",
|
|
9
|
+
"slide-frame": "./kit/slide-frame.css",
|
|
10
|
+
"print": "./kit/print.css",
|
|
11
|
+
"brand": "./kit/brand.css",
|
|
12
|
+
"guidance": "./kit/guidance.md"
|
|
13
|
+
}
|
|
14
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@medquantis/design-system",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"description": "MedQuantis design tokens, shared CSS, assets, guidelines and Claude skill.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -16,6 +16,9 @@
|
|
|
16
16
|
"dist/tokens.json",
|
|
17
17
|
"dist/tailwind.css",
|
|
18
18
|
"dist/kit-contract.css",
|
|
19
|
+
"dist/kit/",
|
|
20
|
+
"kit-manifest.json",
|
|
21
|
+
"dist/DESIGN.md",
|
|
19
22
|
"dist/llms.txt",
|
|
20
23
|
"dist/llms-full.txt",
|
|
21
24
|
"css/",
|
|
@@ -30,6 +33,9 @@
|
|
|
30
33
|
"./tokens.json": "./dist/tokens.json",
|
|
31
34
|
"./tailwind.css": "./dist/tailwind.css",
|
|
32
35
|
"./kit-contract.css": "./dist/kit-contract.css",
|
|
36
|
+
"./kit/*": "./dist/kit/*",
|
|
37
|
+
"./kit-manifest.json": "./kit-manifest.json",
|
|
38
|
+
"./DESIGN.md": "./dist/DESIGN.md",
|
|
33
39
|
"./css/*": "./css/*",
|
|
34
40
|
"./fonts.css": "./fonts/fonts.css",
|
|
35
41
|
"./brand/*": "./brand/*",
|
|
@@ -59,12 +65,15 @@
|
|
|
59
65
|
"@fontsource-variable/geist-mono": "5.3.0",
|
|
60
66
|
"@fontsource-variable/newsreader": "5.3.0",
|
|
61
67
|
"@fontsource-variable/outfit": "5.3.0",
|
|
68
|
+
"@google/design.md": "0.4.0",
|
|
62
69
|
"@playwright/test": "1.64.0",
|
|
70
|
+
"ajv": "8.20.0",
|
|
63
71
|
"lucide": "1.55.0",
|
|
64
72
|
"postcss": "8.5.29",
|
|
65
73
|
"style-dictionary": "5.6.0",
|
|
66
74
|
"stylelint": "17.16.0",
|
|
67
75
|
"stylelint-declaration-strict-value": "1.12.1",
|
|
68
|
-
"stylelint-value-no-unknown-custom-properties": "6.1.1"
|
|
76
|
+
"stylelint-value-no-unknown-custom-properties": "6.1.1",
|
|
77
|
+
"yaml": "2.9.1"
|
|
69
78
|
}
|
|
70
79
|
}
|