@canonical/launchpad-design-tokens 1.0.5 → 1.0.6

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 (13) hide show
  1. package/dist/css/color/dark.css +18 -11
  2. package/dist/css/color/light.css +18 -11
  3. package/dist/css/color/system.css +36 -22
  4. package/dist/css/dimension/extraWide.css +2 -2
  5. package/dist/css/dimension/medium.css +2 -2
  6. package/dist/css/dimension/narrow.css +2 -2
  7. package/dist/css/dimension/responsive.css +2 -2
  8. package/dist/css/dimension/wide.css +2 -2
  9. package/dist/css/typography/extraWide.css +10 -10
  10. package/dist/css/typography/medium.css +10 -10
  11. package/dist/css/typography/narrow.css +10 -10
  12. package/dist/css/typography/wide.css +10 -10
  13. package/package.json +1 -1
package/dist/css/color/dark.css CHANGED
@@ -41,20 +41,10 @@
41
41
  --tmp-color-background-button-negative-hover: #8a0f1e;
42
42
  --tmp-color-background-button-negative-active: #7c0e1b;
43
43
  --tmp-color-border-default: rgba(255, 255, 255, 0.2);
44
+ --tmp-color-border-highlight: #ffffff;
44
45
  --tmp-color-border-high-contrast: #939393;
45
46
  --tmp-color-border-low-contrast: rgba(255, 255, 255, 0.1);
46
47
  --tmp-color-border-neutral: #a6a6a6;
47
- --tmp-color-border-positive: #62a36c;
48
- --tmp-color-border-negative: #d17b85;
49
- --tmp-color-border-information: #5ea6ed;
50
- --tmp-color-border-caution: #c48831;
51
- --tmp-color-icon-default: #000000;
52
- --tmp-color-icon-muted: rgba(0, 0, 0, 0.6);
53
- --tmp-color-icon-positive: #0e8420;
54
- --tmp-color-icon-negative: #c7162b;
55
- --tmp-color-icon-information: #24598f;
56
- --tmp-color-icon-caution: #cc7900;
57
- --tmp-color-icon-link: #0066cc;
58
48
  --tmp-color-icon-status-shade-1: #f7f7f7;
59
49
  --tmp-color-icon-status-shade-2: #d9d9d9;
60
50
  --tmp-color-icon-status-queued: #808080;
@@ -64,4 +54,21 @@
64
54
  --tmp-color-icon-button-base: #000000;
65
55
  --tmp-color-icon-button-positive: #ffffff;
66
56
  --tmp-color-icon-button-negative: #ffffff;
57
+ --tmp-color-fill-positive-default: #008013;
58
+ --tmp-color-fill-positive-hover: #00670f;
59
+ --tmp-color-fill-positive-active: #00570d;
60
+ --tmp-color-fill-negative-default: #a11223;
61
+ --tmp-color-fill-negative-hover: #8a0f1e;
62
+ --tmp-color-fill-negative-active: #7c0e1b;
63
+ --tmp-color-border-positive: var(--tmp-color-positive);
64
+ --tmp-color-border-negative: var(--tmp-color-negative);
65
+ --tmp-color-border-information: var(--tmp-color-information);
66
+ --tmp-color-border-caution: var(--tmp-color-caution);
67
+ --tmp-color-icon-default: var(--tmp-color-text-default);
68
+ --tmp-color-icon-muted: var(--tmp-color-text-muted);
69
+ --tmp-color-icon-positive: var(--tmp-color-positive);
70
+ --tmp-color-icon-negative: var(--tmp-color-negative);
71
+ --tmp-color-icon-information: var(--tmp-color-information);
72
+ --tmp-color-icon-caution: var(--tmp-color-caution);
73
+ --tmp-color-icon-link: var(--tmp-color-text-link-default);
67
74
  }
package/dist/css/color/light.css CHANGED
@@ -41,20 +41,10 @@
41
41
  --tmp-color-background-button-negative-hover: #b01326;
42
42
  --tmp-color-background-button-negative-active: #a21223;
43
43
  --tmp-color-border-default: rgba(0, 0, 0, 0.2);
44
+ --tmp-color-border-highlight: #000000;
44
45
  --tmp-color-border-high-contrast: #707070;
45
46
  --tmp-color-border-low-contrast: rgba(0, 0, 0, 0.1);
46
47
  --tmp-color-border-neutral: rgba(0, 0, 0, 0.56);
47
- --tmp-color-border-positive: #0e8420;
48
- --tmp-color-border-negative: #c7162b;
49
- --tmp-color-border-information: #24598f;
50
- --tmp-color-border-caution: #cc7900;
51
- --tmp-color-icon-default: #000000;
52
- --tmp-color-icon-muted: rgba(0, 0, 0, 0.6);
53
- --tmp-color-icon-positive: #0e8420;
54
- --tmp-color-icon-negative: #c7162b;
55
- --tmp-color-icon-information: #24598f;
56
- --tmp-color-icon-caution: #cc7900;
57
- --tmp-color-icon-link: #0066cc;
58
48
  --tmp-color-icon-status-shade-1: #f7f7f7;
59
49
  --tmp-color-icon-status-shade-2: #d9d9d9;
60
50
  --tmp-color-icon-status-queued: #808080;
@@ -64,4 +54,21 @@
64
54
  --tmp-color-icon-button-base: #000000;
65
55
  --tmp-color-icon-button-positive: #ffffff;
66
56
  --tmp-color-icon-button-negative: #ffffff;
57
+ --tmp-color-fill-positive-hover: #0c6d1a;
58
+ --tmp-color-fill-positive-active: #0a5f17;
59
+ --tmp-color-fill-negative-hover: #b01326;
60
+ --tmp-color-fill-negative-active: #a21223;
61
+ --tmp-color-border-positive: var(--tmp-color-positive);
62
+ --tmp-color-border-negative: var(--tmp-color-negative);
63
+ --tmp-color-border-information: var(--tmp-color-information);
64
+ --tmp-color-border-caution: var(--tmp-color-caution);
65
+ --tmp-color-icon-default: var(--tmp-color-text-default);
66
+ --tmp-color-icon-muted: var(--tmp-color-text-muted);
67
+ --tmp-color-icon-positive: var(--tmp-color-positive);
68
+ --tmp-color-icon-negative: var(--tmp-color-negative);
69
+ --tmp-color-icon-information: var(--tmp-color-information);
70
+ --tmp-color-icon-caution: var(--tmp-color-caution);
71
+ --tmp-color-icon-link: var(--tmp-color-text-link-default);
72
+ --tmp-color-fill-positive-default: var(--tmp-color-positive);
73
+ --tmp-color-fill-negative-default: var(--tmp-color-negative);
67
74
  }
package/dist/css/color/system.css CHANGED
@@ -42,20 +42,10 @@
42
42
  --tmp-color-background-button-negative-hover: #8a0f1e;
43
43
  --tmp-color-background-button-negative-active: #7c0e1b;
44
44
  --tmp-color-border-default: rgba(255, 255, 255, 0.2);
45
+ --tmp-color-border-highlight: #ffffff;
45
46
  --tmp-color-border-high-contrast: #939393;
46
47
  --tmp-color-border-low-contrast: rgba(255, 255, 255, 0.1);
47
48
  --tmp-color-border-neutral: #a6a6a6;
48
- --tmp-color-border-positive: #62a36c;
49
- --tmp-color-border-negative: #d17b85;
50
- --tmp-color-border-information: #5ea6ed;
51
- --tmp-color-border-caution: #c48831;
52
- --tmp-color-icon-default: #000000;
53
- --tmp-color-icon-muted: rgba(0, 0, 0, 0.6);
54
- --tmp-color-icon-positive: #0e8420;
55
- --tmp-color-icon-negative: #c7162b;
56
- --tmp-color-icon-information: #24598f;
57
- --tmp-color-icon-caution: #cc7900;
58
- --tmp-color-icon-link: #0066cc;
59
49
  --tmp-color-icon-status-shade-1: #f7f7f7;
60
50
  --tmp-color-icon-status-shade-2: #d9d9d9;
61
51
  --tmp-color-icon-status-queued: #808080;
@@ -65,6 +55,23 @@
65
55
  --tmp-color-icon-button-base: #000000;
66
56
  --tmp-color-icon-button-positive: #ffffff;
67
57
  --tmp-color-icon-button-negative: #ffffff;
58
+ --tmp-color-fill-positive-default: #008013;
59
+ --tmp-color-fill-positive-hover: #00670f;
60
+ --tmp-color-fill-positive-active: #00570d;
61
+ --tmp-color-fill-negative-default: #a11223;
62
+ --tmp-color-fill-negative-hover: #8a0f1e;
63
+ --tmp-color-fill-negative-active: #7c0e1b;
64
+ --tmp-color-border-positive: var(--tmp-color-positive);
65
+ --tmp-color-border-negative: var(--tmp-color-negative);
66
+ --tmp-color-border-information: var(--tmp-color-information);
67
+ --tmp-color-border-caution: var(--tmp-color-caution);
68
+ --tmp-color-icon-default: var(--tmp-color-text-default);
69
+ --tmp-color-icon-muted: var(--tmp-color-text-muted);
70
+ --tmp-color-icon-positive: var(--tmp-color-positive);
71
+ --tmp-color-icon-negative: var(--tmp-color-negative);
72
+ --tmp-color-icon-information: var(--tmp-color-information);
73
+ --tmp-color-icon-caution: var(--tmp-color-caution);
74
+ --tmp-color-icon-link: var(--tmp-color-text-link-default);
68
75
  }
69
76
  }
70
77
 
@@ -113,20 +120,10 @@
113
120
  --tmp-color-background-button-negative-hover: #b01326;
114
121
  --tmp-color-background-button-negative-active: #a21223;
115
122
  --tmp-color-border-default: rgba(0, 0, 0, 0.2);
123
+ --tmp-color-border-highlight: #000000;
116
124
  --tmp-color-border-high-contrast: #707070;
117
125
  --tmp-color-border-low-contrast: rgba(0, 0, 0, 0.1);
118
126
  --tmp-color-border-neutral: rgba(0, 0, 0, 0.56);
119
- --tmp-color-border-positive: #0e8420;
120
- --tmp-color-border-negative: #c7162b;
121
- --tmp-color-border-information: #24598f;
122
- --tmp-color-border-caution: #cc7900;
123
- --tmp-color-icon-default: #000000;
124
- --tmp-color-icon-muted: rgba(0, 0, 0, 0.6);
125
- --tmp-color-icon-positive: #0e8420;
126
- --tmp-color-icon-negative: #c7162b;
127
- --tmp-color-icon-information: #24598f;
128
- --tmp-color-icon-caution: #cc7900;
129
- --tmp-color-icon-link: #0066cc;
130
127
  --tmp-color-icon-status-shade-1: #f7f7f7;
131
128
  --tmp-color-icon-status-shade-2: #d9d9d9;
132
129
  --tmp-color-icon-status-queued: #808080;
@@ -136,5 +133,22 @@
136
133
  --tmp-color-icon-button-base: #000000;
137
134
  --tmp-color-icon-button-positive: #ffffff;
138
135
  --tmp-color-icon-button-negative: #ffffff;
136
+ --tmp-color-fill-positive-hover: #0c6d1a;
137
+ --tmp-color-fill-positive-active: #0a5f17;
138
+ --tmp-color-fill-negative-hover: #b01326;
139
+ --tmp-color-fill-negative-active: #a21223;
140
+ --tmp-color-border-positive: var(--tmp-color-positive);
141
+ --tmp-color-border-negative: var(--tmp-color-negative);
142
+ --tmp-color-border-information: var(--tmp-color-information);
143
+ --tmp-color-border-caution: var(--tmp-color-caution);
144
+ --tmp-color-icon-default: var(--tmp-color-text-default);
145
+ --tmp-color-icon-muted: var(--tmp-color-text-muted);
146
+ --tmp-color-icon-positive: var(--tmp-color-positive);
147
+ --tmp-color-icon-negative: var(--tmp-color-negative);
148
+ --tmp-color-icon-information: var(--tmp-color-information);
149
+ --tmp-color-icon-caution: var(--tmp-color-caution);
150
+ --tmp-color-icon-link: var(--tmp-color-text-link-default);
151
+ --tmp-color-fill-positive-default: var(--tmp-color-positive);
152
+ --tmp-color-fill-negative-default: var(--tmp-color-negative);
139
153
  }
140
154
  }
package/dist/css/dimension/extraWide.css CHANGED
@@ -3,8 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --dimension-stroke-thickness-medium: 1px;
7
- --dimension-stroke-thickness-large: 2px;
6
+ --dimension-stroke-thickness-default: 1px;
7
+ --dimension-stroke-thickness-large: 3px;
8
8
  --dimension-radius-none: 0px;
9
9
  --dimension-radius-small: 0px;
10
10
  --dimension-radius-medium: 0px;
package/dist/css/dimension/medium.css CHANGED
@@ -3,8 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --dimension-stroke-thickness-medium: 1px;
7
- --dimension-stroke-thickness-large: 2px;
6
+ --dimension-stroke-thickness-default: 1px;
7
+ --dimension-stroke-thickness-large: 3px;
8
8
  --dimension-radius-none: 0px;
9
9
  --dimension-radius-small: 0px;
10
10
  --dimension-radius-medium: 0px;
package/dist/css/dimension/narrow.css CHANGED
@@ -3,8 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --dimension-stroke-thickness-medium: 1px;
7
- --dimension-stroke-thickness-large: 2px;
6
+ --dimension-stroke-thickness-default: 1px;
7
+ --dimension-stroke-thickness-large: 3px;
8
8
  --dimension-radius-none: 0px;
9
9
  --dimension-radius-small: 0px;
10
10
  --dimension-radius-medium: 0px;
package/dist/css/dimension/responsive.css CHANGED
@@ -3,8 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --dimension-stroke-thickness-medium: 1px;
7
- --dimension-stroke-thickness-large: 2px;
6
+ --dimension-stroke-thickness-default: 1px;
7
+ --dimension-stroke-thickness-large: 3px;
8
8
  --dimension-radius-none: 0px;
9
9
  --dimension-radius-small: 0px;
10
10
  --dimension-radius-medium: 0px;
package/dist/css/dimension/wide.css CHANGED
@@ -3,8 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --dimension-stroke-thickness-medium: 1px;
7
- --dimension-stroke-thickness-large: 2px;
6
+ --dimension-stroke-thickness-default: 1px;
7
+ --dimension-stroke-thickness-large: 3px;
8
8
  --dimension-radius-none: 0px;
9
9
  --dimension-radius-small: 0px;
10
10
  --dimension-radius-medium: 0px;
package/dist/css/typography/extraWide.css CHANGED
@@ -3,16 +3,6 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --tmp-typography-paragraph-xs: 400 0.75rem/1.125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
7
- --tmp-typography-paragraph-s: 400 0.875rem/1.3125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
8
- --tmp-typography-paragraph-default: 400 1rem/1.5rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
9
- --tmp-typography-code-xs: 400 0.75rem/1.125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
10
- --tmp-typography-code-s: 400 0.875rem/1.3125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
11
- --tmp-typography-code-default: 400 1rem/1.5rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
12
- --tmp-typography-h3: 450 1.75rem/2rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
13
- --tmp-typography-h4: 200 1.75rem/2rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
14
- --tmp-typography-h5: 450 1.5rem/2rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
15
- --tmp-typography-h6: 300 1.5rem/2rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
16
6
  --tmp-typography-weight-extra-thin: 180;
17
7
  --tmp-typography-weight-thin: 200;
18
8
  --tmp-typography-weight-light: 300;
@@ -33,4 +23,14 @@
33
23
  --tmp-typography-line-height-s: 1.3125rem;
34
24
  --tmp-typography-line-height-m: 1.5rem;
35
25
  --tmp-typography-line-height-l: 2rem;
26
+ --tmp-typography-paragraph-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-default);
27
+ --tmp-typography-paragraph-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-default);
28
+ --tmp-typography-paragraph-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-default);
29
+ --tmp-typography-code-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-mono);
30
+ --tmp-typography-code-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-mono);
31
+ --tmp-typography-code-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-mono);
32
+ --tmp-typography-h3: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
33
+ --tmp-typography-h4: var(--tmp-typography-weight-thin) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
34
+ --tmp-typography-h5: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
35
+ --tmp-typography-h6: var(--tmp-typography-weight-light) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
36
36
  }
package/dist/css/typography/medium.css CHANGED
@@ -3,16 +3,6 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --tmp-typography-paragraph-xs: 400 0.625rem/0.9375rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
7
- --tmp-typography-paragraph-s: 400 0.75rem/1.125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
8
- --tmp-typography-paragraph-default: 400 0.875rem/1.3125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
9
- --tmp-typography-code-xs: 400 0.625rem/0.9375rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
10
- --tmp-typography-code-s: 400 0.75rem/1.125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
11
- --tmp-typography-code-default: 400 0.875rem/1.3125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
12
- --tmp-typography-h3: 450 1.5rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
13
- --tmp-typography-h4: 200 1.5rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
14
- --tmp-typography-h5: 450 1.3125rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
15
- --tmp-typography-h6: 300 1.3125rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
16
6
  --tmp-typography-weight-extra-thin: 180;
17
7
  --tmp-typography-weight-thin: 200;
18
8
  --tmp-typography-weight-light: 300;
@@ -33,4 +23,14 @@
33
23
  --tmp-typography-line-height-s: 1.125rem;
34
24
  --tmp-typography-line-height-m: 1.3125rem;
35
25
  --tmp-typography-line-height-l: 1.75rem;
26
+ --tmp-typography-paragraph-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-default);
27
+ --tmp-typography-paragraph-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-default);
28
+ --tmp-typography-paragraph-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-default);
29
+ --tmp-typography-code-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-mono);
30
+ --tmp-typography-code-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-mono);
31
+ --tmp-typography-code-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-mono);
32
+ --tmp-typography-h3: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
33
+ --tmp-typography-h4: var(--tmp-typography-weight-thin) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
34
+ --tmp-typography-h5: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
35
+ --tmp-typography-h6: var(--tmp-typography-weight-light) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
36
36
  }
package/dist/css/typography/narrow.css CHANGED
@@ -3,16 +3,6 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --tmp-typography-paragraph-xs: 400 0.625rem/0.9375rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
7
- --tmp-typography-paragraph-s: 400 0.75rem/1.125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
8
- --tmp-typography-paragraph-default: 400 0.875rem/1.3125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
9
- --tmp-typography-code-xs: 400 0.625rem/0.9375rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
10
- --tmp-typography-code-s: 400 0.75rem/1.125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
11
- --tmp-typography-code-default: 400 0.875rem/1.3125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
12
- --tmp-typography-h3: 450 1.5rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
13
- --tmp-typography-h4: 200 1.5rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
14
- --tmp-typography-h5: 450 1.3125rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
15
- --tmp-typography-h6: 300 1.3125rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
16
6
  --tmp-typography-weight-extra-thin: 180;
17
7
  --tmp-typography-weight-thin: 200;
18
8
  --tmp-typography-weight-light: 300;
@@ -33,4 +23,14 @@
33
23
  --tmp-typography-line-height-s: 1.125rem;
34
24
  --tmp-typography-line-height-m: 1.3125rem;
35
25
  --tmp-typography-line-height-l: 1.75rem;
26
+ --tmp-typography-paragraph-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-default);
27
+ --tmp-typography-paragraph-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-default);
28
+ --tmp-typography-paragraph-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-default);
29
+ --tmp-typography-code-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-mono);
30
+ --tmp-typography-code-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-mono);
31
+ --tmp-typography-code-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-mono);
32
+ --tmp-typography-h3: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
33
+ --tmp-typography-h4: var(--tmp-typography-weight-thin) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
34
+ --tmp-typography-h5: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
35
+ --tmp-typography-h6: var(--tmp-typography-weight-light) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
36
36
  }
package/dist/css/typography/wide.css CHANGED
@@ -3,16 +3,6 @@
3
3
  */
4
4
 
5
5
  :root {
6
- --tmp-typography-paragraph-xs: 400 0.625rem/0.9375rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
7
- --tmp-typography-paragraph-s: 400 0.75rem/1.125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
8
- --tmp-typography-paragraph-default: 400 0.875rem/1.3125rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
9
- --tmp-typography-code-xs: 400 0.625rem/0.9375rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
10
- --tmp-typography-code-s: 400 0.75rem/1.125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
11
- --tmp-typography-code-default: 400 0.875rem/1.3125rem 'Ubuntu Sans Mono', 'Ubuntu Mono', Consolas, Monaco, Courier, monospace;
12
- --tmp-typography-h3: 450 1.5rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
13
- --tmp-typography-h4: 200 1.5rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
14
- --tmp-typography-h5: 450 1.3125rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
15
- --tmp-typography-h6: 300 1.3125rem/1.75rem 'Ubuntu Sans', Ubuntu, -apple-system, 'Segoe UI', Roboto, Oxygen, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
16
6
  --tmp-typography-weight-extra-thin: 180;
17
7
  --tmp-typography-weight-thin: 200;
18
8
  --tmp-typography-weight-light: 300;
@@ -33,4 +23,14 @@
33
23
  --tmp-typography-line-height-s: 1.125rem;
34
24
  --tmp-typography-line-height-m: 1.3125rem;
35
25
  --tmp-typography-line-height-l: 1.75rem;
26
+ --tmp-typography-paragraph-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-default);
27
+ --tmp-typography-paragraph-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-default);
28
+ --tmp-typography-paragraph-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-default);
29
+ --tmp-typography-code-xs: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-xs)/var(--tmp-typography-line-height-xs) var(--tmp-typography-font-family-mono);
30
+ --tmp-typography-code-s: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-s)/var(--tmp-typography-line-height-s) var(--tmp-typography-font-family-mono);
31
+ --tmp-typography-code-default: var(--tmp-typography-weight-regular) var(--tmp-typography-font-size-m)/var(--tmp-typography-line-height-m) var(--tmp-typography-font-family-mono);
32
+ --tmp-typography-h3: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
33
+ --tmp-typography-h4: var(--tmp-typography-weight-thin) var(--tmp-typography-font-size-xl)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
34
+ --tmp-typography-h5: var(--tmp-typography-weight-medium) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
35
+ --tmp-typography-h6: var(--tmp-typography-weight-light) var(--tmp-typography-font-size-l)/var(--tmp-typography-line-height-l) var(--tmp-typography-font-family-default);
36
36
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@canonical/launchpad-design-tokens",
3
- "version": "1.0.5",
3
+ "version": "1.0.6",
4
4
  "description": "Design tokens for Canonical's Launchpad",
5
5
  "files": ["dist/css"],
6
6
  "type": "module",