@momentum-design/components 0.8.0 → 0.8.1

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 (4) hide show
  1. package/dist/browser/index.js +47 -39
  2. package/dist/browser/index.js.map +2 -2
  3. package/dist/components/text/fonts.styles.js +37 -29
  4. package/package.json +1 -1
package/dist/components/text/fonts.styles.js CHANGED
@@ -1,6 +1,14 @@
1
1
  import { css } from 'lit';
2
2
  export const fontsStyles = css `
3
- :host([type="headline-small-regular"])::part(text) {
3
+ :host([tagname])::part(text) {
4
+ font-size: unset;
5
+ font-weight: unset;
6
+ line-height: unset;
7
+ text-decoration: unset;
8
+ text-transform: unset;
9
+ }
10
+
11
+ :host([type="headline-small-regular"]) {
4
12
  font-size: var(--mds-font-apps-headline-small-regular-font-size);
5
13
  font-weight: var(--mds-font-apps-headline-small-regular-font-weight);
6
14
  line-height: var(--mds-font-apps-headline-small-regular-line-height);
@@ -8,7 +16,7 @@ export const fontsStyles = css `
8
16
  text-transform: var(--mds-font-apps-headline-small-regular-text-case);
9
17
  }
10
18
 
11
- :host([type="headline-small-light"])::part(text) {
19
+ :host([type="headline-small-light"]) {
12
20
  font-size: var(--mds-font-apps-headline-small-light-font-size);
13
21
  font-weight: var(--mds-font-apps-headline-small-light-font-weight);
14
22
  line-height: var(--mds-font-apps-headline-small-light-line-height);
@@ -16,7 +24,7 @@ export const fontsStyles = css `
16
24
  text-transform: var(--mds-font-apps-headline-small-light-text-case);
17
25
  }
18
26
 
19
- :host([type="heading-xlarge-bold"])::part(text) {
27
+ :host([type="heading-xlarge-bold"]) {
20
28
  font-size: var(--mds-font-apps-heading-xlarge-bold-font-size);
21
29
  font-weight: var(--mds-font-apps-heading-xlarge-bold-font-weight);
22
30
  line-height: var(--mds-font-apps-heading-xlarge-bold-line-height);
@@ -24,7 +32,7 @@ export const fontsStyles = css `
24
32
  text-transform: var(--mds-font-apps-heading-xlarge-bold-text-case);
25
33
  }
26
34
 
27
- :host([type="heading-xlarge-medium"])::part(text) {
35
+ :host([type="heading-xlarge-medium"]) {
28
36
  font-size: var(--mds-font-apps-heading-xlarge-medium-font-size);
29
37
  font-weight: var(--mds-font-apps-heading-xlarge-medium-font-weight);
30
38
  line-height: var(--mds-font-apps-heading-xlarge-medium-line-height);
@@ -32,7 +40,7 @@ export const fontsStyles = css `
32
40
  text-transform: var(--mds-font-apps-heading-xlarge-medium-text-case);
33
41
  }
34
42
 
35
- :host([type="heading-xlarge-regular"])::part(text) {
43
+ :host([type="heading-xlarge-regular"]) {
36
44
  font-size: var(--mds-font-apps-heading-xlarge-regular-font-size);
37
45
  font-weight: var(--mds-font-apps-heading-xlarge-regular-font-weight);
38
46
  line-height: var(--mds-font-apps-heading-xlarge-regular-line-height);
@@ -40,7 +48,7 @@ export const fontsStyles = css `
40
48
  text-transform: var(--mds-font-apps-heading-xlarge-regular-text-case);
41
49
  }
42
50
 
43
- :host([type="heading-large-bold"])::part(text) {
51
+ :host([type="heading-large-bold"]) {
44
52
  font-size: var(--mds-font-apps-heading-large-bold-font-size);
45
53
  font-weight: var(--mds-font-apps-heading-large-bold-font-weight);
46
54
  line-height: var(--mds-font-apps-heading-large-bold-line-height);
@@ -48,7 +56,7 @@ export const fontsStyles = css `
48
56
  text-transform: var(--mds-font-apps-heading-large-bold-text-case);
49
57
  }
50
58
 
51
- :host([type="heading-large-medium"])::part(text) {
59
+ :host([type="heading-large-medium"]) {
52
60
  font-size: var(--mds-font-apps-heading-large-medium-font-size);
53
61
  font-weight: var(--mds-font-apps-heading-large-medium-font-weight);
54
62
  line-height: var(--mds-font-apps-heading-large-medium-line-height);
@@ -56,7 +64,7 @@ export const fontsStyles = css `
56
64
  text-transform: var(--mds-font-apps-heading-large-medium-text-case);
57
65
  }
58
66
 
59
- :host([type="heading-large-regular"])::part(text) {
67
+ :host([type="heading-large-regular"]) {
60
68
  font-size: var(--mds-font-apps-heading-large-regular-font-size);
61
69
  font-weight: var(--mds-font-apps-heading-large-regular-font-weight);
62
70
  line-height: var(--mds-font-apps-heading-large-regular-line-height);
@@ -64,7 +72,7 @@ export const fontsStyles = css `
64
72
  text-transform: var(--mds-font-apps-heading-large-regular-text-case);
65
73
  }
66
74
 
67
- :host([type="heading-midsize-bold"])::part(text) {
75
+ :host([type="heading-midsize-bold"]) {
68
76
  font-size: var(--mds-font-apps-heading-midsize-bold-font-size);
69
77
  font-weight: var(--mds-font-apps-heading-midsize-bold-font-weight);
70
78
  line-height: var(--mds-font-apps-heading-midsize-bold-line-height);
@@ -72,7 +80,7 @@ export const fontsStyles = css `
72
80
  text-transform: var(--mds-font-apps-heading-midsize-bold-text-case);
73
81
  }
74
82
 
75
- :host([type="heading-midsize-medium"])::part(text) {
83
+ :host([type="heading-midsize-medium"]) {
76
84
  font-size: var(--mds-font-apps-heading-midsize-medium-font-size);
77
85
  font-weight: var(--mds-font-apps-heading-midsize-medium-font-weight);
78
86
  line-height: var(--mds-font-apps-heading-midsize-medium-line-height);
@@ -80,7 +88,7 @@ export const fontsStyles = css `
80
88
  text-transform: var(--mds-font-apps-heading-midsize-medium-text-case);
81
89
  }
82
90
 
83
- :host([type="heading-midsize-regular"])::part(text) {
91
+ :host([type="heading-midsize-regular"]) {
84
92
  font-size: var(--mds-font-apps-heading-midsize-regular-font-size);
85
93
  font-weight: var(--mds-font-apps-heading-midsize-regular-font-weight);
86
94
  line-height: var(--mds-font-apps-heading-midsize-regular-line-height);
@@ -88,7 +96,7 @@ export const fontsStyles = css `
88
96
  text-transform: var(--mds-font-apps-heading-midsize-regular-text-case);
89
97
  }
90
98
 
91
- :host([type="heading-small-bold"])::part(text) {
99
+ :host([type="heading-small-bold"]) {
92
100
  font-size: var(--mds-font-apps-heading-small-bold-font-size);
93
101
  font-weight: var(--mds-font-apps-heading-small-bold-font-weight);
94
102
  line-height: var(--mds-font-apps-heading-small-bold-line-height);
@@ -96,7 +104,7 @@ export const fontsStyles = css `
96
104
  text-transform: var(--mds-font-apps-heading-small-bold-text-case);
97
105
  }
98
106
 
99
- :host([type="heading-small-medium"])::part(text) {
107
+ :host([type="heading-small-medium"]) {
100
108
  font-size: var(--mds-font-apps-heading-small-medium-font-size);
101
109
  font-weight: var(--mds-font-apps-heading-small-medium-font-weight);
102
110
  line-height: var(--mds-font-apps-heading-small-medium-line-height);
@@ -104,7 +112,7 @@ export const fontsStyles = css `
104
112
  text-transform: var(--mds-font-apps-heading-small-medium-text-case);
105
113
  }
106
114
 
107
- :host([type="heading-small-regular"])::part(text) {
115
+ :host([type="heading-small-regular"]) {
108
116
  font-size: var(--mds-font-apps-heading-small-regular-font-size);
109
117
  font-weight: var(--mds-font-apps-heading-small-regular-font-weight);
110
118
  line-height: var(--mds-font-apps-heading-small-regular-line-height);
@@ -112,7 +120,7 @@ export const fontsStyles = css `
112
120
  text-transform: var(--mds-font-apps-heading-small-regular-text-case);
113
121
  }
114
122
 
115
- :host([type="body-large-bold"])::part(text) {
123
+ :host([type="body-large-bold"]) {
116
124
  font-size: var(--mds-font-apps-body-large-bold-font-size);
117
125
  font-weight: var(--mds-font-apps-body-large-bold-font-weight);
118
126
  line-height: var(--mds-font-apps-body-large-bold-line-height);
@@ -120,7 +128,7 @@ export const fontsStyles = css `
120
128
  text-transform: var(--mds-font-apps-body-large-bold-text-case);
121
129
  }
122
130
 
123
- :host([type="body-large-medium-underline"])::part(text) {
131
+ :host([type="body-large-medium-underline"]) {
124
132
  font-size: var(--mds-font-apps-body-large-medium-underline-font-size);
125
133
  font-weight: var(--mds-font-apps-body-large-medium-underline-font-weight);
126
134
  line-height: var(--mds-font-apps-body-large-medium-underline-line-height);
@@ -128,7 +136,7 @@ export const fontsStyles = css `
128
136
  text-transform: var(--mds-font-apps-body-large-medium-underline-text-case);
129
137
  }
130
138
 
131
- :host([type="body-large-medium"])::part(text) {
139
+ :host([type="body-large-medium"]) {
132
140
  font-size: var(--mds-font-apps-body-large-medium-font-size);
133
141
  font-weight: var(--mds-font-apps-body-large-medium-font-weight);
134
142
  line-height: var(--mds-font-apps-body-large-medium-line-height);
@@ -136,7 +144,7 @@ export const fontsStyles = css `
136
144
  text-transform: var(--mds-font-apps-body-large-medium-text-case);
137
145
  }
138
146
 
139
- :host([type="body-large-regular-underline"])::part(text) {
147
+ :host([type="body-large-regular-underline"]) {
140
148
  font-size: var(--mds-font-apps-body-large-regular-underline-font-size);
141
149
  font-weight: var(--mds-font-apps-body-large-regular-underline-font-weight);
142
150
  line-height: var(--mds-font-apps-body-large-regular-underline-line-height);
@@ -144,7 +152,7 @@ export const fontsStyles = css `
144
152
  text-transform: var(--mds-font-apps-body-large-regular-underline-text-case);
145
153
  }
146
154
 
147
- :host([type="body-large-regular"])::part(text) {
155
+ :host([type="body-large-regular"]) {
148
156
  font-size: var(--mds-font-apps-body-large-regular-font-size);
149
157
  font-weight: var(--mds-font-apps-body-large-regular-font-weight);
150
158
  line-height: var(--mds-font-apps-body-large-regular-line-height);
@@ -152,7 +160,7 @@ export const fontsStyles = css `
152
160
  text-transform: var(--mds-font-apps-body-large-regular-text-case);
153
161
  }
154
162
 
155
- :host([type="body-midsize-bold"])::part(text) {
163
+ :host([type="body-midsize-bold"]) {
156
164
  font-size: var(--mds-font-apps-body-midsize-bold-font-size);
157
165
  font-weight: var(--mds-font-apps-body-midsize-bold-font-weight);
158
166
  line-height: var(--mds-font-apps-body-midsize-bold-line-height);
@@ -160,7 +168,7 @@ export const fontsStyles = css `
160
168
  text-transform: var(--mds-font-apps-body-midsize-bold-text-case);
161
169
  }
162
170
 
163
- :host([type="body-midsize-medium-underline"])::part(text) {
171
+ :host([type="body-midsize-medium-underline"]) {
164
172
  font-size: var(--mds-font-apps-body-midsize-medium-underline-font-size);
165
173
  font-weight: var(--mds-font-apps-body-midsize-medium-underline-font-weight);
166
174
  line-height: var(--mds-font-apps-body-midsize-medium-underline-line-height);
@@ -168,7 +176,7 @@ export const fontsStyles = css `
168
176
  text-transform: var(--mds-font-apps-body-midsize-medium-underline-text-case);
169
177
  }
170
178
 
171
- :host([type="body-midsize-medium"])::part(text) {
179
+ :host([type="body-midsize-medium"]) {
172
180
  font-size: var(--mds-font-apps-body-midsize-medium-font-size);
173
181
  font-weight: var(--mds-font-apps-body-midsize-medium-font-weight);
174
182
  line-height: var(--mds-font-apps-body-midsize-medium-line-height);
@@ -176,7 +184,7 @@ export const fontsStyles = css `
176
184
  text-transform: var(--mds-font-apps-body-midsize-medium-text-case);
177
185
  }
178
186
 
179
- :host([type="body-midsize-regular-underline"])::part(text) {
187
+ :host([type="body-midsize-regular-underline"]) {
180
188
  font-size: var(--mds-font-apps-body-midsize-regular-underline-font-size);
181
189
  font-weight: var(--mds-font-apps-body-midsize-regular-underline-font-weight);
182
190
  line-height: var(--mds-font-apps-body-midsize-regular-underline-line-height);
@@ -184,7 +192,7 @@ export const fontsStyles = css `
184
192
  text-transform: var(--mds-font-apps-body-midsize-regular-underline-text-case);
185
193
  }
186
194
 
187
- :host([type="body-midsize-regular"])::part(text) {
195
+ :host([type="body-midsize-regular"]) {
188
196
  font-size: var(--mds-font-apps-body-midsize-regular-font-size);
189
197
  font-weight: var(--mds-font-apps-body-midsize-regular-font-weight);
190
198
  line-height: var(--mds-font-apps-body-midsize-regular-line-height);
@@ -192,7 +200,7 @@ export const fontsStyles = css `
192
200
  text-transform: var(--mds-font-apps-body-midsize-regular-text-case);
193
201
  }
194
202
 
195
- :host([type="body-small-bold"])::part(text) {
203
+ :host([type="body-small-bold"]) {
196
204
  font-size: var(--mds-font-apps-body-small-bold-font-size);
197
205
  font-weight: var(--mds-font-apps-body-small-bold-font-weight);
198
206
  line-height: var(--mds-font-apps-body-small-bold-line-height);
@@ -200,7 +208,7 @@ export const fontsStyles = css `
200
208
  text-transform: var(--mds-font-apps-body-small-bold-text-case);
201
209
  }
202
210
 
203
- :host([type="body-small-medium-underline"])::part(text) {
211
+ :host([type="body-small-medium-underline"]) {
204
212
  font-size: var(--mds-font-apps-body-small-medium-underline-font-size);
205
213
  font-weight: var(--mds-font-apps-body-small-medium-underline-font-weight);
206
214
  line-height: var(--mds-font-apps-body-small-medium-underline-line-height);
@@ -208,7 +216,7 @@ export const fontsStyles = css `
208
216
  text-transform: var(--mds-font-apps-body-small-medium-underline-text-case);
209
217
  }
210
218
 
211
- :host([type="body-small-medium"])::part(text) {
219
+ :host([type="body-small-medium"]) {
212
220
  font-size: var(--mds-font-apps-body-small-medium-font-size);
213
221
  font-weight: var(--mds-font-apps-body-small-medium-font-weight);
214
222
  line-height: var(--mds-font-apps-body-small-medium-line-height);
@@ -216,7 +224,7 @@ export const fontsStyles = css `
216
224
  text-transform: var(--mds-font-apps-body-small-medium-text-case);
217
225
  }
218
226
 
219
- :host([type="body-small-regular-underline"])::part(text) {
227
+ :host([type="body-small-regular-underline"]) {
220
228
  font-size: var(--mds-font-apps-body-small-regular-underline-font-size);
221
229
  font-weight: var(--mds-font-apps-body-small-regular-underline-font-weight);
222
230
  line-height: var(--mds-font-apps-body-small-regular-underline-line-height);
@@ -224,7 +232,7 @@ export const fontsStyles = css `
224
232
  text-transform: var(--mds-font-apps-body-small-regular-underline-text-case);
225
233
  }
226
234
 
227
- :host([type="body-small-regular"])::part(text) {
235
+ :host([type="body-small-regular"]) {
228
236
  font-size: var(--mds-font-apps-body-small-regular-font-size);
229
237
  font-weight: var(--mds-font-apps-body-small-regular-font-weight);
230
238
  line-height: var(--mds-font-apps-body-small-regular-line-height);
package/package.json CHANGED
@@ -37,5 +37,5 @@
37
37
  "@momentum-design/icons": "*",
38
38
  "@momentum-design/tokens": "*"
39
39
  },
40
- "version": "0.8.0"
40
+ "version": "0.8.1"
41
41
  }