From eaed72dfac57784062d5f662bebeb3aad8614597 Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Wed, 13 Dec 2023 21:13:30 +0900 Subject: [PATCH 1/4] =?UTF-8?q?refactor:=20=ED=8F=B0=ED=8A=B8=20=EA=B0=9D?= =?UTF-8?q?=EC=B2=B4=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/fonts/src/fonts.ts | 261 ++++++++++++------------------------ 1 file changed, 88 insertions(+), 173 deletions(-) diff --git a/packages/fonts/src/fonts.ts b/packages/fonts/src/fonts.ts index 179276b..767d272 100644 --- a/packages/fonts/src/fonts.ts +++ b/packages/fonts/src/fonts.ts @@ -1,175 +1,90 @@ -export const fontBase = ` - font-family: 'SUIT', sans-serif; - font-style: normal; -`; +interface Font { + weight: number; + size: number; + lineHeight: number; + letterSpacing: number; +} + +function fontStr({ weight, size, lineHeight, letterSpacing }: Font): string { + return ` + font-family: 'SUIT', sans-serif; + font-style: normal; + font-weight : ${weight}; + font-size : ${size}px; + line-height : ${lineHeight}px; + letter-spacing: ${letterSpacing}%; + `; +} + +function fontObj({ weight, size, lineHeight, letterSpacing }: Font): object { + return { + fontFamily: "'SUIT', sans-serif", + fontStyle: 'normal', + fontWeight: `${weight}`, + fontSize: `${size}px`, + lineHeight: `${lineHeight}px`, + letterSpacing: `${letterSpacing}%`, + }; +} export const fonts = { - HEADING_48_B: ` - font-weight: 700; - font-size: 48px; - line-height: 72px; - letter-spacing: -2%; - `, - HEADING_32_B: ` - font-weight: 700; - font-size: 32px; - line-height: 48px; - letter-spacing: -2%; - `, - HEADING_28_B: ` - font-weight: 700; - font-size: 28px; - line-height: 42px; - letter-spacing: -2%; - `, - HEADING_24_B: ` - font-weight: 700; - font-size: 24px; - line-height: 36px; - letter-spacing: -2%; - `, - HEADING_20_B: ` - font-weight: 700; - font-size: 20px; - line-height: 30px; - letter-spacing: -2%; - `, - HEADING_18_B: ` - font-weight: 700; - font-size: 18px; - line-height: 28px; - letter-spacing: -2%; - `, - HEADING_16_B: ` - font-weight: 700; - font-size: 16px; - line-height: 24px; - letter-spacing: -2%; - `, - TITLE_32_SB: ` - font-weight: 600; - font-size: 32px; - line-height: 48px; - letter-spacing: -2%; - `, - TITLE_28_SB: ` - font-weight: 600; - font-size: 28px; - line-height: 42px; - letter-spacing: -2%; - `, - TITLE_24_SB: ` - font-weight: 600; - font-size: 24px; - line-height: 36px; - letter-spacing: -2%; - `, - TITLE_20_SB: ` - font-weight: 600; - font-size: 20px; - line-height: 30px; - letter-spacing: -2%; - `, - TITLE_18_SB: ` - font-weight: 600; - font-size: 18px; - line-height: 28px; - letter-spacing: -2%; - `, - TITLE_16_SB: ` - font-weight: 600; - font-size: 16px; - line-height: 24px; - letter-spacing: -1.5%; - `, - TITLE_14_SB: ` - font-weight: 600; - font-size: 14px; - line-height: 20px; - letter-spacing: -1.5%; - `, - BODY_18_M: ` - font-weight: 500; - font-size: 18px; - line-height: 30px; - letter-spacing: -1.5%; - `, - BODY_16_M: ` - font-weight: 500; - font-size: 16px; - line-height: 26px; - letter-spacing: -1.5%; - `, - BODY_16_R: ` - font-weight: 400; - font-size: 16px; - line-height: 26px; - letter-spacing: -1.5%; - `, - BODY_14_M: ` - font-weight: 500; - font-size: 14px; - line-height: 22px; - letter-spacing: -1.5%; - `, - BODY_14_R: ` - font-weight: 400; - font-size: 14px; - line-height: 22px; - letter-spacing: -1.5%; - `, - BODY_14_L: ` - font-weight: 300; - font-size: 14px; - line-height: 22px; - letter-spacing: -1.5%; - `, - BODY_13_M: ` - font-weight: 500; - font-size: 13px; - line-height: 20px; - letter-spacing: -1.5%; - `, - BODY_13_R: ` - font-weight: 400; - font-size: 13px; - line-height: 20px; - letter-spacing: -1.5%; - `, - BODY_13_L: ` - font-weight: 300; - font-size: 13px; - line-height: 20px; - letter-spacing: -1.5%; - `, - LABEL_18_SB: ` - font-weight: 600; - font-size: 18px; - line-height: 24px; - letter-spacing: -2%; - `, - LABEL_16_SB: ` - font-weight: 600; - font-size: 16px; - line-height: 22px; - letter-spacing: -2%; - `, - LABEL_14_SB: ` - font-weight: 600; - font-size: 14px; - line-height: 18px; - letter-spacing: -2%; - `, - LABEL_12_SB: ` - font-weight: 600; - font-size: 12px; - line-height: 16px; - letter-spacing: -2%; - `, - LABEL_11_SB: ` - font-weight: 600; - font-size: 11px; - line-height: 14px; - letter-spacing: -2%; - `, -} \ No newline at end of file + HEADING_48_B: fontStr({ weight: 700, size: 48, lineHeight: 72, letterSpacing: -2 }), + HEADING_32_B: fontStr({ weight: 700, size: 32, lineHeight: 48, letterSpacing: -2 }), + HEADING_28_B: fontStr({ weight: 700, size: 28, lineHeight: 42, letterSpacing: -2 }), + HEADING_24_B: fontStr({ weight: 700, size: 24, lineHeight: 36, letterSpacing: -2 }), + HEADING_20_B: fontStr({ weight: 700, size: 20, lineHeight: 30, letterSpacing: -2 }), + HEADING_18_B: fontStr({ weight: 700, size: 18, lineHeight: 28, letterSpacing: -2 }), + HEADING_16_B: fontStr({ weight: 700, size: 16, lineHeight: 24, letterSpacing: -2 }), + TITLE_32_SB: fontStr({ weight: 600, size: 32, lineHeight: 48, letterSpacing: -2 }), + TITLE_28_SB: fontStr({ weight: 600, size: 28, lineHeight: 42, letterSpacing: -2 }), + TITLE_24_SB: fontStr({ weight: 600, size: 24, lineHeight: 36, letterSpacing: -2 }), + TITLE_20_SB: fontStr({ weight: 600, size: 20, lineHeight: 30, letterSpacing: -2 }), + TITLE_18_SB: fontStr({ weight: 600, size: 18, lineHeight: 28, letterSpacing: -2 }), + TITLE_16_SB: fontStr({ weight: 600, size: 16, lineHeight: 24, letterSpacing: -1.5 }), + TITLE_14_SB: fontStr({ weight: 600, size: 14, lineHeight: 20, letterSpacing: -1.5 }), + BODY_18_M: fontStr({ weight: 500, size: 18, lineHeight: 30, letterSpacing: -1.5 }), + BODY_16_M: fontStr({ weight: 500, size: 16, lineHeight: 26, letterSpacing: -1.5 }), + BODY_16_R: fontStr({ weight: 400, size: 16, lineHeight: 26, letterSpacing: -1.5 }), + BODY_14_M: fontStr({ weight: 500, size: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_14_R: fontStr({ weight: 400, size: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_14_L: fontStr({ weight: 300, size: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_13_M: fontStr({ weight: 500, size: 13, lineHeight: 20, letterSpacing: -1.5 }), + BODY_13_R: fontStr({ weight: 400, size: 13, lineHeight: 20, letterSpacing: -1.5 }), + BODY_13_L: fontStr({ weight: 300, size: 13, lineHeight: 20, letterSpacing: -1.5 }), + LABEL_18_SB: fontStr({ weight: 600, size: 19, lineHeight: 24, letterSpacing: -2 }), + LABEL_16_SB: fontStr({ weight: 600, size: 16, lineHeight: 22, letterSpacing: -2 }), + LABEL_14_SB: fontStr({ weight: 600, size: 14, lineHeight: 18, letterSpacing: -2 }), + LABEL_12_SB: fontStr({ weight: 600, size: 12, lineHeight: 16, letterSpacing: -2 }), + LABEL_11_SB: fontStr({ weight: 600, size: 11, lineHeight: 14, letterSpacing: -2 }), +}; + +export const fontsObject = { + HEADING_48_B: fontObj({ weight: 700, size: 48, lineHeight: 72, letterSpacing: -2 }), + HEADING_32_B: fontObj({ weight: 700, size: 32, lineHeight: 48, letterSpacing: -2 }), + HEADING_28_B: fontObj({ weight: 700, size: 28, lineHeight: 42, letterSpacing: -2 }), + HEADING_24_B: fontObj({ weight: 700, size: 24, lineHeight: 36, letterSpacing: -2 }), + HEADING_20_B: fontObj({ weight: 700, size: 20, lineHeight: 30, letterSpacing: -2 }), + HEADING_18_B: fontObj({ weight: 700, size: 18, lineHeight: 28, letterSpacing: -2 }), + HEADING_16_B: fontObj({ weight: 700, size: 16, lineHeight: 24, letterSpacing: -2 }), + TITLE_32_SB: fontObj({ weight: 600, size: 32, lineHeight: 48, letterSpacing: -2 }), + TITLE_28_SB: fontObj({ weight: 600, size: 28, lineHeight: 42, letterSpacing: -2 }), + TITLE_24_SB: fontObj({ weight: 600, size: 24, lineHeight: 36, letterSpacing: -2 }), + TITLE_20_SB: fontObj({ weight: 600, size: 20, lineHeight: 30, letterSpacing: -2 }), + TITLE_18_SB: fontObj({ weight: 600, size: 18, lineHeight: 28, letterSpacing: -2 }), + TITLE_16_SB: fontObj({ weight: 600, size: 16, lineHeight: 24, letterSpacing: -1.5 }), + TITLE_14_SB: fontObj({ weight: 600, size: 14, lineHeight: 20, letterSpacing: -1.5 }), + BODY_18_M: fontObj({ weight: 500, size: 18, lineHeight: 30, letterSpacing: -1.5 }), + BODY_16_M: fontObj({ weight: 500, size: 16, lineHeight: 26, letterSpacing: -1.5 }), + BODY_16_R: fontObj({ weight: 400, size: 16, lineHeight: 26, letterSpacing: -1.5 }), + BODY_14_M: fontObj({ weight: 500, size: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_14_R: fontObj({ weight: 400, size: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_14_L: fontObj({ weight: 300, size: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_13_M: fontObj({ weight: 500, size: 13, lineHeight: 20, letterSpacing: -1.5 }), + BODY_13_R: fontObj({ weight: 400, size: 13, lineHeight: 20, letterSpacing: -1.5 }), + BODY_13_L: fontObj({ weight: 300, size: 13, lineHeight: 20, letterSpacing: -1.5 }), + LABEL_18_SB: fontObj({ weight: 600, size: 19, lineHeight: 24, letterSpacing: -2 }), + LABEL_16_SB: fontObj({ weight: 600, size: 16, lineHeight: 22, letterSpacing: -2 }), + LABEL_14_SB: fontObj({ weight: 600, size: 14, lineHeight: 18, letterSpacing: -2 }), + LABEL_12_SB: fontObj({ weight: 600, size: 12, lineHeight: 16, letterSpacing: -2 }), + LABEL_11_SB: fontObj({ weight: 600, size: 11, lineHeight: 14, letterSpacing: -2 }), +}; From 02fa29f2b22b81ed2443d30df80783438d41c9cc Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Thu, 14 Dec 2023 04:11:38 +0900 Subject: [PATCH 2/4] =?UTF-8?q?refactor:=20single=20source=20of=20truth=20?= =?UTF-8?q?=EA=B3=A0=EB=A0=A4=ED=95=98=EC=97=AC=20=ED=8F=B0=ED=8A=B8=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/fonts/src/fonts.ts | 142 ++++++++++++++++++------------------ 1 file changed, 72 insertions(+), 70 deletions(-) diff --git a/packages/fonts/src/fonts.ts b/packages/fonts/src/fonts.ts index 767d272..dff4455 100644 --- a/packages/fonts/src/fonts.ts +++ b/packages/fonts/src/fonts.ts @@ -1,90 +1,92 @@ interface Font { - weight: number; - size: number; - lineHeight: number; - letterSpacing: number; + fontFamily?: string; + fontStyle?: string; + fontWeight: number | string; + fontSize: number | string; + lineHeight: number | string; + letterSpacing: number | string; } -function fontStr({ weight, size, lineHeight, letterSpacing }: Font): string { +function fontStr({ fontWeight, fontSize, lineHeight, letterSpacing }: Font) { return ` font-family: 'SUIT', sans-serif; font-style: normal; - font-weight : ${weight}; - font-size : ${size}px; - line-height : ${lineHeight}px; - letter-spacing: ${letterSpacing}%; + font-weight : ${fontWeight}; + font-size : ${fontSize}; + line-height : ${lineHeight}; + letter-spacing: ${letterSpacing}; `; } -function fontObj({ weight, size, lineHeight, letterSpacing }: Font): object { +function fontObj({ fontWeight, fontSize, lineHeight, letterSpacing }: Font) { return { fontFamily: "'SUIT', sans-serif", fontStyle: 'normal', - fontWeight: `${weight}`, - fontSize: `${size}px`, + fontWeight: `${fontWeight}`, + fontSize: `${fontSize}px`, lineHeight: `${lineHeight}px`, letterSpacing: `${letterSpacing}%`, }; } -export const fonts = { - HEADING_48_B: fontStr({ weight: 700, size: 48, lineHeight: 72, letterSpacing: -2 }), - HEADING_32_B: fontStr({ weight: 700, size: 32, lineHeight: 48, letterSpacing: -2 }), - HEADING_28_B: fontStr({ weight: 700, size: 28, lineHeight: 42, letterSpacing: -2 }), - HEADING_24_B: fontStr({ weight: 700, size: 24, lineHeight: 36, letterSpacing: -2 }), - HEADING_20_B: fontStr({ weight: 700, size: 20, lineHeight: 30, letterSpacing: -2 }), - HEADING_18_B: fontStr({ weight: 700, size: 18, lineHeight: 28, letterSpacing: -2 }), - HEADING_16_B: fontStr({ weight: 700, size: 16, lineHeight: 24, letterSpacing: -2 }), - TITLE_32_SB: fontStr({ weight: 600, size: 32, lineHeight: 48, letterSpacing: -2 }), - TITLE_28_SB: fontStr({ weight: 600, size: 28, lineHeight: 42, letterSpacing: -2 }), - TITLE_24_SB: fontStr({ weight: 600, size: 24, lineHeight: 36, letterSpacing: -2 }), - TITLE_20_SB: fontStr({ weight: 600, size: 20, lineHeight: 30, letterSpacing: -2 }), - TITLE_18_SB: fontStr({ weight: 600, size: 18, lineHeight: 28, letterSpacing: -2 }), - TITLE_16_SB: fontStr({ weight: 600, size: 16, lineHeight: 24, letterSpacing: -1.5 }), - TITLE_14_SB: fontStr({ weight: 600, size: 14, lineHeight: 20, letterSpacing: -1.5 }), - BODY_18_M: fontStr({ weight: 500, size: 18, lineHeight: 30, letterSpacing: -1.5 }), - BODY_16_M: fontStr({ weight: 500, size: 16, lineHeight: 26, letterSpacing: -1.5 }), - BODY_16_R: fontStr({ weight: 400, size: 16, lineHeight: 26, letterSpacing: -1.5 }), - BODY_14_M: fontStr({ weight: 500, size: 14, lineHeight: 22, letterSpacing: -1.5 }), - BODY_14_R: fontStr({ weight: 400, size: 14, lineHeight: 22, letterSpacing: -1.5 }), - BODY_14_L: fontStr({ weight: 300, size: 14, lineHeight: 22, letterSpacing: -1.5 }), - BODY_13_M: fontStr({ weight: 500, size: 13, lineHeight: 20, letterSpacing: -1.5 }), - BODY_13_R: fontStr({ weight: 400, size: 13, lineHeight: 20, letterSpacing: -1.5 }), - BODY_13_L: fontStr({ weight: 300, size: 13, lineHeight: 20, letterSpacing: -1.5 }), - LABEL_18_SB: fontStr({ weight: 600, size: 19, lineHeight: 24, letterSpacing: -2 }), - LABEL_16_SB: fontStr({ weight: 600, size: 16, lineHeight: 22, letterSpacing: -2 }), - LABEL_14_SB: fontStr({ weight: 600, size: 14, lineHeight: 18, letterSpacing: -2 }), - LABEL_12_SB: fontStr({ weight: 600, size: 12, lineHeight: 16, letterSpacing: -2 }), - LABEL_11_SB: fontStr({ weight: 600, size: 11, lineHeight: 14, letterSpacing: -2 }), +export const fontsObject = { + HEADING_48_B: fontObj({ fontWeight: 700, fontSize: 48, lineHeight: 72, letterSpacing: -2 }), + HEADING_32_B: fontObj({ fontWeight: 700, fontSize: 32, lineHeight: 48, letterSpacing: -2 }), + HEADING_28_B: fontObj({ fontWeight: 700, fontSize: 28, lineHeight: 42, letterSpacing: -2 }), + HEADING_24_B: fontObj({ fontWeight: 700, fontSize: 24, lineHeight: 36, letterSpacing: -2 }), + HEADING_20_B: fontObj({ fontWeight: 700, fontSize: 20, lineHeight: 30, letterSpacing: -2 }), + HEADING_18_B: fontObj({ fontWeight: 700, fontSize: 18, lineHeight: 28, letterSpacing: -2 }), + HEADING_16_B: fontObj({ fontWeight: 700, fontSize: 16, lineHeight: 24, letterSpacing: -2 }), + TITLE_32_SB: fontObj({ fontWeight: 600, fontSize: 32, lineHeight: 48, letterSpacing: -2 }), + TITLE_28_SB: fontObj({ fontWeight: 600, fontSize: 28, lineHeight: 42, letterSpacing: -2 }), + TITLE_24_SB: fontObj({ fontWeight: 600, fontSize: 24, lineHeight: 36, letterSpacing: -2 }), + TITLE_20_SB: fontObj({ fontWeight: 600, fontSize: 20, lineHeight: 30, letterSpacing: -2 }), + TITLE_18_SB: fontObj({ fontWeight: 600, fontSize: 18, lineHeight: 28, letterSpacing: -2 }), + TITLE_16_SB: fontObj({ fontWeight: 600, fontSize: 16, lineHeight: 24, letterSpacing: -1.5 }), + TITLE_14_SB: fontObj({ fontWeight: 600, fontSize: 14, lineHeight: 20, letterSpacing: -1.5 }), + BODY_18_M: fontObj({ fontWeight: 500, fontSize: 18, lineHeight: 30, letterSpacing: -1.5 }), + BODY_16_M: fontObj({ fontWeight: 500, fontSize: 16, lineHeight: 26, letterSpacing: -1.5 }), + BODY_16_R: fontObj({ fontWeight: 400, fontSize: 16, lineHeight: 26, letterSpacing: -1.5 }), + BODY_14_M: fontObj({ fontWeight: 500, fontSize: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_14_R: fontObj({ fontWeight: 400, fontSize: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_14_L: fontObj({ fontWeight: 300, fontSize: 14, lineHeight: 22, letterSpacing: -1.5 }), + BODY_13_M: fontObj({ fontWeight: 500, fontSize: 13, lineHeight: 20, letterSpacing: -1.5 }), + BODY_13_R: fontObj({ fontWeight: 400, fontSize: 13, lineHeight: 20, letterSpacing: -1.5 }), + BODY_13_L: fontObj({ fontWeight: 300, fontSize: 13, lineHeight: 20, letterSpacing: -1.5 }), + LABEL_18_SB: fontObj({ fontWeight: 600, fontSize: 19, lineHeight: 24, letterSpacing: -2 }), + LABEL_16_SB: fontObj({ fontWeight: 600, fontSize: 16, lineHeight: 22, letterSpacing: -2 }), + LABEL_14_SB: fontObj({ fontWeight: 600, fontSize: 14, lineHeight: 18, letterSpacing: -2 }), + LABEL_12_SB: fontObj({ fontWeight: 600, fontSize: 12, lineHeight: 16, letterSpacing: -2 }), + LABEL_11_SB: fontObj({ fontWeight: 600, fontSize: 11, lineHeight: 14, letterSpacing: -2 }), }; -export const fontsObject = { - HEADING_48_B: fontObj({ weight: 700, size: 48, lineHeight: 72, letterSpacing: -2 }), - HEADING_32_B: fontObj({ weight: 700, size: 32, lineHeight: 48, letterSpacing: -2 }), - HEADING_28_B: fontObj({ weight: 700, size: 28, lineHeight: 42, letterSpacing: -2 }), - HEADING_24_B: fontObj({ weight: 700, size: 24, lineHeight: 36, letterSpacing: -2 }), - HEADING_20_B: fontObj({ weight: 700, size: 20, lineHeight: 30, letterSpacing: -2 }), - HEADING_18_B: fontObj({ weight: 700, size: 18, lineHeight: 28, letterSpacing: -2 }), - HEADING_16_B: fontObj({ weight: 700, size: 16, lineHeight: 24, letterSpacing: -2 }), - TITLE_32_SB: fontObj({ weight: 600, size: 32, lineHeight: 48, letterSpacing: -2 }), - TITLE_28_SB: fontObj({ weight: 600, size: 28, lineHeight: 42, letterSpacing: -2 }), - TITLE_24_SB: fontObj({ weight: 600, size: 24, lineHeight: 36, letterSpacing: -2 }), - TITLE_20_SB: fontObj({ weight: 600, size: 20, lineHeight: 30, letterSpacing: -2 }), - TITLE_18_SB: fontObj({ weight: 600, size: 18, lineHeight: 28, letterSpacing: -2 }), - TITLE_16_SB: fontObj({ weight: 600, size: 16, lineHeight: 24, letterSpacing: -1.5 }), - TITLE_14_SB: fontObj({ weight: 600, size: 14, lineHeight: 20, letterSpacing: -1.5 }), - BODY_18_M: fontObj({ weight: 500, size: 18, lineHeight: 30, letterSpacing: -1.5 }), - BODY_16_M: fontObj({ weight: 500, size: 16, lineHeight: 26, letterSpacing: -1.5 }), - BODY_16_R: fontObj({ weight: 400, size: 16, lineHeight: 26, letterSpacing: -1.5 }), - BODY_14_M: fontObj({ weight: 500, size: 14, lineHeight: 22, letterSpacing: -1.5 }), - BODY_14_R: fontObj({ weight: 400, size: 14, lineHeight: 22, letterSpacing: -1.5 }), - BODY_14_L: fontObj({ weight: 300, size: 14, lineHeight: 22, letterSpacing: -1.5 }), - BODY_13_M: fontObj({ weight: 500, size: 13, lineHeight: 20, letterSpacing: -1.5 }), - BODY_13_R: fontObj({ weight: 400, size: 13, lineHeight: 20, letterSpacing: -1.5 }), - BODY_13_L: fontObj({ weight: 300, size: 13, lineHeight: 20, letterSpacing: -1.5 }), - LABEL_18_SB: fontObj({ weight: 600, size: 19, lineHeight: 24, letterSpacing: -2 }), - LABEL_16_SB: fontObj({ weight: 600, size: 16, lineHeight: 22, letterSpacing: -2 }), - LABEL_14_SB: fontObj({ weight: 600, size: 14, lineHeight: 18, letterSpacing: -2 }), - LABEL_12_SB: fontObj({ weight: 600, size: 12, lineHeight: 16, letterSpacing: -2 }), - LABEL_11_SB: fontObj({ weight: 600, size: 11, lineHeight: 14, letterSpacing: -2 }), +export const fonts = { + HEADING_48_B: fontStr(fontsObject.HEADING_48_B), + HEADING_32_B: fontStr(fontsObject.HEADING_32_B), + HEADING_28_B: fontStr(fontsObject.HEADING_28_B), + HEADING_24_B: fontStr(fontsObject.HEADING_24_B), + HEADING_20_B: fontStr(fontsObject.HEADING_20_B), + HEADING_18_B: fontStr(fontsObject.HEADING_18_B), + HEADING_16_B: fontStr(fontsObject.HEADING_16_B), + TITLE_32_SB: fontStr(fontsObject.TITLE_32_SB), + TITLE_28_SB: fontStr(fontsObject.TITLE_28_SB), + TITLE_24_SB: fontStr(fontsObject.TITLE_24_SB), + TITLE_20_SB: fontStr(fontsObject.TITLE_20_SB), + TITLE_18_SB: fontStr(fontsObject.TITLE_18_SB), + TITLE_16_SB: fontStr(fontsObject.TITLE_16_SB), + TITLE_14_SB: fontStr(fontsObject.TITLE_14_SB), + BODY_18_M: fontStr(fontsObject.BODY_18_M), + BODY_16_M: fontStr(fontsObject.BODY_16_M), + BODY_16_R: fontStr(fontsObject.BODY_16_R), + BODY_14_M: fontStr(fontsObject.BODY_14_M), + BODY_14_R: fontStr(fontsObject.BODY_14_R), + BODY_14_L: fontStr(fontsObject.BODY_14_L), + BODY_13_M: fontStr(fontsObject.BODY_13_M), + BODY_13_R: fontStr(fontsObject.BODY_13_R), + BODY_13_L: fontStr(fontsObject.BODY_13_L), + LABEL_18_SB: fontStr(fontsObject.LABEL_18_SB), + LABEL_16_SB: fontStr(fontsObject.LABEL_16_SB), + LABEL_14_SB: fontStr(fontsObject.LABEL_14_SB), + LABEL_12_SB: fontStr(fontsObject.LABEL_12_SB), + LABEL_11_SB: fontStr(fontsObject.LABEL_11_SB), }; From 2de2ee255ac6cbf8d838e970ee4d6db33ee8158a Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Wed, 20 Dec 2023 06:20:58 +0900 Subject: [PATCH 3/4] =?UTF-8?q?refactor:=20=ED=8F=B0=ED=8A=B8=20string=20?= =?UTF-8?q?=ED=98=95=ED=83=9C=20=EB=A6=AC=ED=8C=A9=ED=86=A0=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/fonts/src/fonts.ts | 35 ++++------------------------------- packages/ui/theme.css.ts | 8 ++++---- 2 files changed, 8 insertions(+), 35 deletions(-) diff --git a/packages/fonts/src/fonts.ts b/packages/fonts/src/fonts.ts index dff4455..245951f 100644 --- a/packages/fonts/src/fonts.ts +++ b/packages/fonts/src/fonts.ts @@ -58,35 +58,8 @@ export const fontsObject = { LABEL_14_SB: fontObj({ fontWeight: 600, fontSize: 14, lineHeight: 18, letterSpacing: -2 }), LABEL_12_SB: fontObj({ fontWeight: 600, fontSize: 12, lineHeight: 16, letterSpacing: -2 }), LABEL_11_SB: fontObj({ fontWeight: 600, fontSize: 11, lineHeight: 14, letterSpacing: -2 }), -}; +} satisfies Record; -export const fonts = { - HEADING_48_B: fontStr(fontsObject.HEADING_48_B), - HEADING_32_B: fontStr(fontsObject.HEADING_32_B), - HEADING_28_B: fontStr(fontsObject.HEADING_28_B), - HEADING_24_B: fontStr(fontsObject.HEADING_24_B), - HEADING_20_B: fontStr(fontsObject.HEADING_20_B), - HEADING_18_B: fontStr(fontsObject.HEADING_18_B), - HEADING_16_B: fontStr(fontsObject.HEADING_16_B), - TITLE_32_SB: fontStr(fontsObject.TITLE_32_SB), - TITLE_28_SB: fontStr(fontsObject.TITLE_28_SB), - TITLE_24_SB: fontStr(fontsObject.TITLE_24_SB), - TITLE_20_SB: fontStr(fontsObject.TITLE_20_SB), - TITLE_18_SB: fontStr(fontsObject.TITLE_18_SB), - TITLE_16_SB: fontStr(fontsObject.TITLE_16_SB), - TITLE_14_SB: fontStr(fontsObject.TITLE_14_SB), - BODY_18_M: fontStr(fontsObject.BODY_18_M), - BODY_16_M: fontStr(fontsObject.BODY_16_M), - BODY_16_R: fontStr(fontsObject.BODY_16_R), - BODY_14_M: fontStr(fontsObject.BODY_14_M), - BODY_14_R: fontStr(fontsObject.BODY_14_R), - BODY_14_L: fontStr(fontsObject.BODY_14_L), - BODY_13_M: fontStr(fontsObject.BODY_13_M), - BODY_13_R: fontStr(fontsObject.BODY_13_R), - BODY_13_L: fontStr(fontsObject.BODY_13_L), - LABEL_18_SB: fontStr(fontsObject.LABEL_18_SB), - LABEL_16_SB: fontStr(fontsObject.LABEL_16_SB), - LABEL_14_SB: fontStr(fontsObject.LABEL_14_SB), - LABEL_12_SB: fontStr(fontsObject.LABEL_12_SB), - LABEL_11_SB: fontStr(fontsObject.LABEL_11_SB), -}; +export const fontsString = Object.fromEntries( + Object.entries(fontsObject).map(([key, value]) => [key, fontStr(value)]) +); diff --git a/packages/ui/theme.css.ts b/packages/ui/theme.css.ts index 47fc0fa..7148da7 100644 --- a/packages/ui/theme.css.ts +++ b/packages/ui/theme.css.ts @@ -1,10 +1,10 @@ import { createGlobalTheme } from '@vanilla-extract/css'; import { colors } from '../colors/src'; -import { fonts } from '../fonts/src'; +import { fontsObject } from '../fonts/src/fonts'; -export const theme = createGlobalTheme("body", { +export const theme = createGlobalTheme('body', { colors, - fonts + fontsObject, }); -export default theme; \ No newline at end of file +export default theme; From e4b0cc6c31fc116b9436b7712e6e4117ac17777e Mon Sep 17 00:00:00 2001 From: Seojisoo20191941 Date: Sun, 31 Dec 2023 07:03:36 +0900 Subject: [PATCH 4/4] =?UTF-8?q?fix:=20fontsString=20=ED=83=80=EC=9E=85=20?= =?UTF-8?q?=EC=A2=81=ED=9E=88=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/fonts/src/fonts.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/fonts/src/fonts.ts b/packages/fonts/src/fonts.ts index 245951f..ecae629 100644 --- a/packages/fonts/src/fonts.ts +++ b/packages/fonts/src/fonts.ts @@ -62,4 +62,4 @@ export const fontsObject = { export const fontsString = Object.fromEntries( Object.entries(fontsObject).map(([key, value]) => [key, fontStr(value)]) -); +) as Record;