@team-monolith/cds 1.123.0 → 1.123.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.
|
@@ -109,10 +109,7 @@ const Headline = styled.div(({ theme }) => css `
|
|
|
109
109
|
font-weight: 700;
|
|
110
110
|
line-height: 20px; /* 125% */
|
|
111
111
|
`);
|
|
112
|
-
const Content = styled.div(({ theme }) =>
|
|
113
|
-
font-family: ${theme.fontFamily.ui};
|
|
114
|
-
${theme.typography.body2Regular}
|
|
115
|
-
`);
|
|
112
|
+
const Content = styled.div(({ theme }) => theme.typography.body2Regular);
|
|
116
113
|
const TextContainer = styled.div `
|
|
117
114
|
flex: 1;
|
|
118
115
|
|
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
import { css } from "@emotion/react";
|
|
2
|
+
import { FONT } from "./font";
|
|
2
3
|
export const typography = {
|
|
3
4
|
// Heading 1
|
|
4
5
|
heading1Regular: css `
|
|
6
|
+
font-family: ${FONT.pretendard};
|
|
5
7
|
font-size: 40px;
|
|
6
8
|
font-style: normal;
|
|
7
9
|
font-weight: 400;
|
|
8
10
|
line-height: 52px;
|
|
9
11
|
`,
|
|
10
12
|
heading1Bold: css `
|
|
13
|
+
font-family: ${FONT.pretendard};
|
|
11
14
|
font-size: 40px;
|
|
12
15
|
font-style: normal;
|
|
13
16
|
font-weight: 700;
|
|
@@ -15,12 +18,14 @@ export const typography = {
|
|
|
15
18
|
`,
|
|
16
19
|
// Heading 2
|
|
17
20
|
heading2Regular: css `
|
|
21
|
+
font-family: ${FONT.pretendard};
|
|
18
22
|
font-size: 36px;
|
|
19
23
|
font-style: normal;
|
|
20
24
|
font-weight: 400;
|
|
21
25
|
line-height: 44px;
|
|
22
26
|
`,
|
|
23
27
|
heading2Bold: css `
|
|
28
|
+
font-family: ${FONT.pretendard};
|
|
24
29
|
font-size: 36px;
|
|
25
30
|
font-style: normal;
|
|
26
31
|
font-weight: 700;
|
|
@@ -28,12 +33,14 @@ export const typography = {
|
|
|
28
33
|
`,
|
|
29
34
|
// Heading 3
|
|
30
35
|
heading3Regular: css `
|
|
36
|
+
font-family: ${FONT.pretendard};
|
|
31
37
|
font-size: 32px;
|
|
32
38
|
font-style: normal;
|
|
33
39
|
font-weight: 400;
|
|
34
40
|
line-height: 40px;
|
|
35
41
|
`,
|
|
36
42
|
heading3Bold: css `
|
|
43
|
+
font-family: ${FONT.pretendard};
|
|
37
44
|
font-size: 32px;
|
|
38
45
|
font-style: normal;
|
|
39
46
|
font-weight: 700;
|
|
@@ -41,12 +48,14 @@ export const typography = {
|
|
|
41
48
|
`,
|
|
42
49
|
// Heading 4
|
|
43
50
|
heading4Regular: css `
|
|
51
|
+
font-family: ${FONT.pretendard};
|
|
44
52
|
font-size: 28px;
|
|
45
53
|
font-style: normal;
|
|
46
54
|
font-weight: 400;
|
|
47
55
|
line-height: 36px;
|
|
48
56
|
`,
|
|
49
57
|
heading4Bold: css `
|
|
58
|
+
font-family: ${FONT.pretendard};
|
|
50
59
|
font-size: 28px;
|
|
51
60
|
font-style: normal;
|
|
52
61
|
font-weight: 700;
|
|
@@ -54,12 +63,14 @@ export const typography = {
|
|
|
54
63
|
`,
|
|
55
64
|
// Heading 5
|
|
56
65
|
heading5Regular: css `
|
|
66
|
+
font-family: ${FONT.pretendard};
|
|
57
67
|
font-size: 24px;
|
|
58
68
|
font-style: normal;
|
|
59
69
|
font-weight: 400;
|
|
60
70
|
line-height: 32px;
|
|
61
71
|
`,
|
|
62
72
|
heading5Bold: css `
|
|
73
|
+
font-family: ${FONT.pretendard};
|
|
63
74
|
font-size: 24px;
|
|
64
75
|
font-style: normal;
|
|
65
76
|
font-weight: 700;
|
|
@@ -67,12 +78,14 @@ export const typography = {
|
|
|
67
78
|
`,
|
|
68
79
|
// Heading 6
|
|
69
80
|
heading6Regular: css `
|
|
81
|
+
font-family: ${FONT.pretendard};
|
|
70
82
|
font-size: 20px;
|
|
71
83
|
font-style: normal;
|
|
72
84
|
font-weight: 400;
|
|
73
85
|
line-height: 28px;
|
|
74
86
|
`,
|
|
75
87
|
heading6Bold: css `
|
|
88
|
+
font-family: ${FONT.pretendard};
|
|
76
89
|
font-size: 20px;
|
|
77
90
|
font-style: normal;
|
|
78
91
|
font-weight: 700;
|
|
@@ -80,24 +93,28 @@ export const typography = {
|
|
|
80
93
|
`,
|
|
81
94
|
// Body 1
|
|
82
95
|
body1Regular: css `
|
|
96
|
+
font-family: ${FONT.pretendard};
|
|
83
97
|
font-size: 18px;
|
|
84
98
|
font-style: normal;
|
|
85
99
|
font-weight: 400;
|
|
86
100
|
line-height: 28px;
|
|
87
101
|
`,
|
|
88
102
|
body1Medium: css `
|
|
103
|
+
font-family: ${FONT.pretendard};
|
|
89
104
|
font-size: 18px;
|
|
90
105
|
font-style: normal;
|
|
91
106
|
font-weight: 500;
|
|
92
107
|
line-height: 28px;
|
|
93
108
|
`,
|
|
94
109
|
body1SemiBold: css `
|
|
110
|
+
font-family: ${FONT.pretendard};
|
|
95
111
|
font-size: 18px;
|
|
96
112
|
font-style: normal;
|
|
97
113
|
font-weight: 600;
|
|
98
114
|
line-height: 28px;
|
|
99
115
|
`,
|
|
100
116
|
body1Bold: css `
|
|
117
|
+
font-family: ${FONT.pretendard};
|
|
101
118
|
font-size: 18px;
|
|
102
119
|
font-style: normal;
|
|
103
120
|
font-weight: 700;
|
|
@@ -105,24 +122,28 @@ export const typography = {
|
|
|
105
122
|
`,
|
|
106
123
|
// Body 2
|
|
107
124
|
body2Regular: css `
|
|
125
|
+
font-family: ${FONT.pretendard};
|
|
108
126
|
font-size: 16px;
|
|
109
127
|
font-style: normal;
|
|
110
128
|
font-weight: 400;
|
|
111
129
|
line-height: 24px;
|
|
112
130
|
`,
|
|
113
131
|
body2Medium: css `
|
|
132
|
+
font-family: ${FONT.pretendard};
|
|
114
133
|
font-size: 16px;
|
|
115
134
|
font-style: normal;
|
|
116
135
|
font-weight: 500;
|
|
117
136
|
line-height: 24px;
|
|
118
137
|
`,
|
|
119
138
|
body2SemiBold: css `
|
|
139
|
+
font-family: ${FONT.pretendard};
|
|
120
140
|
font-size: 16px;
|
|
121
141
|
font-style: normal;
|
|
122
142
|
font-weight: 600;
|
|
123
143
|
line-height: 24px;
|
|
124
144
|
`,
|
|
125
145
|
body2Bold: css `
|
|
146
|
+
font-family: ${FONT.pretendard};
|
|
126
147
|
font-size: 16px;
|
|
127
148
|
font-style: normal;
|
|
128
149
|
font-weight: 700;
|
|
@@ -130,24 +151,28 @@ export const typography = {
|
|
|
130
151
|
`,
|
|
131
152
|
// Body 3
|
|
132
153
|
body3Regular: css `
|
|
154
|
+
font-family: ${FONT.pretendard};
|
|
133
155
|
font-size: 14px;
|
|
134
156
|
font-style: normal;
|
|
135
157
|
font-weight: 400;
|
|
136
158
|
line-height: 20px;
|
|
137
159
|
`,
|
|
138
160
|
body3Medium: css `
|
|
161
|
+
font-family: ${FONT.pretendard};
|
|
139
162
|
font-size: 14px;
|
|
140
163
|
font-style: normal;
|
|
141
164
|
font-weight: 500;
|
|
142
165
|
line-height: 20px;
|
|
143
166
|
`,
|
|
144
167
|
body3SemiBold: css `
|
|
168
|
+
font-family: ${FONT.pretendard};
|
|
145
169
|
font-size: 14px;
|
|
146
170
|
font-style: normal;
|
|
147
171
|
font-weight: 600;
|
|
148
172
|
line-height: 20px;
|
|
149
173
|
`,
|
|
150
174
|
body3Bold: css `
|
|
175
|
+
font-family: ${FONT.pretendard};
|
|
151
176
|
font-size: 14px;
|
|
152
177
|
font-style: normal;
|
|
153
178
|
font-weight: 700;
|
|
@@ -155,24 +180,28 @@ export const typography = {
|
|
|
155
180
|
`,
|
|
156
181
|
// Caption
|
|
157
182
|
captionRegular: css `
|
|
183
|
+
font-family: ${FONT.pretendard};
|
|
158
184
|
font-size: 12px;
|
|
159
185
|
font-style: normal;
|
|
160
186
|
font-weight: 400;
|
|
161
187
|
line-height: 16px;
|
|
162
188
|
`,
|
|
163
189
|
captionMedium: css `
|
|
190
|
+
font-family: ${FONT.pretendard};
|
|
164
191
|
font-size: 12px;
|
|
165
192
|
font-style: normal;
|
|
166
193
|
font-weight: 500;
|
|
167
194
|
line-height: 16px;
|
|
168
195
|
`,
|
|
169
196
|
captionSemiBold: css `
|
|
197
|
+
font-family: ${FONT.pretendard};
|
|
170
198
|
font-size: 12px;
|
|
171
199
|
font-style: normal;
|
|
172
200
|
font-weight: 600;
|
|
173
201
|
line-height: 16px;
|
|
174
202
|
`,
|
|
175
203
|
captionBold: css `
|
|
204
|
+
font-family: ${FONT.pretendard};
|
|
176
205
|
font-size: 12px;
|
|
177
206
|
font-style: normal;
|
|
178
207
|
font-weight: 700;
|