@remember-web/mixin 0.2.5 → 0.3.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/dist/src/colors/theme.cjs.js +2 -0
- package/dist/src/colors/theme.cjs.js.map +1 -1
- package/dist/src/colors/theme.d.ts.map +1 -1
- package/dist/src/colors/theme.esm.js +2 -0
- package/dist/src/colors/theme.esm.js.map +1 -1
- package/dist/src/colors/utils.cjs.js.map +1 -1
- package/dist/src/colors/utils.esm.js.map +1 -1
- package/dist/src/colors/variables.cjs.js +2 -0
- package/dist/src/colors/variables.cjs.js.map +1 -1
- package/dist/src/colors/variables.d.ts +1 -0
- package/dist/src/colors/variables.d.ts.map +1 -1
- package/dist/src/colors/variables.esm.js +2 -1
- package/dist/src/colors/variables.esm.js.map +1 -1
- package/dist/src/index.cjs.js +1 -0
- package/dist/src/index.cjs.js.map +1 -1
- package/dist/src/index.esm.js +1 -1
- package/dist/src/mediaQuery/const.cjs.js.map +1 -1
- package/dist/src/mediaQuery/const.esm.js.map +1 -1
- package/dist/src/mediaQuery/index.cjs.js.map +1 -1
- package/dist/src/mediaQuery/index.esm.js.map +1 -1
- package/dist/src/provider/index.esm.js +1 -1
- package/dist/src/provider/styles.cjs.js +1 -1
- package/dist/src/provider/styles.esm.js +1 -1
- package/dist/src/typography/const.cjs.js +40 -0
- package/dist/src/typography/const.cjs.js.map +1 -1
- package/dist/src/typography/const.d.ts +40 -0
- package/dist/src/typography/const.d.ts.map +1 -1
- package/dist/src/typography/const.esm.js +40 -0
- package/dist/src/typography/const.esm.js.map +1 -1
- package/package.json +4 -4
- package/src/colors/color.stories.tsx +1 -1
- package/src/colors/theme.ts +2 -0
- package/src/colors/variables.ts +1 -0
- package/src/typography/const.ts +40 -0
|
@@ -34,6 +34,7 @@ var RUI_COLOR_THEME = {
|
|
|
34
34
|
'--rui-bg-role-blue': '#EDF4FF',
|
|
35
35
|
'--rui-bg-role-green': '#D9FCF2',
|
|
36
36
|
'--rui-divider': '#D4D4D4',
|
|
37
|
+
'--rui-divider-lite': '#EBEBEB',
|
|
37
38
|
'--rui-fixed-white': '#FFFFFF',
|
|
38
39
|
'--rui-fixed-black': '#000000',
|
|
39
40
|
'--rui-fixed-bg-white': '#FFFFFF'
|
|
@@ -68,6 +69,7 @@ var RUI_COLOR_THEME = {
|
|
|
68
69
|
'--rui-bg-role-blue': '#002861',
|
|
69
70
|
'--rui-bg-role-green': '#15382E',
|
|
70
71
|
'--rui-divider': '#424242',
|
|
72
|
+
'--rui-divider-lite': '#2E2E2E',
|
|
71
73
|
'--rui-fixed-white': '#FFFFFF',
|
|
72
74
|
'--rui-fixed-black': '#000000',
|
|
73
75
|
'--rui-fixed-bg-white': '#FFFFFF'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.cjs.js","sources":["../../../src/colors/theme.ts"],"sourcesContent":["import type { RUIColorThemeType } from './types';\n\n/**\n * {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}\n */\nexport const RUI_COLOR_THEME: RUIColorThemeType = {\n light: {\n '--rui-primary100': '#000000',\n '--rui-primary200': '#FFFFFF',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#000000',\n '--rui-contents100': '#424242',\n '--rui-contents150': '#808080',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#D4D4D4',\n '--rui-contents999': '#FFFFFF',\n '--rui-disabled': '#D4D4D4',\n '--rui-disabled-role-red': '#F7ABAB',\n '--rui-disabled-secondary': '#FFE3D1',\n '--rui-role-red': '#ED4E4E',\n '--rui-role-yellow': '#EDC84E',\n '--rui-role-blue': '#2679ED',\n '--rui-role-green': '#21C798',\n '--rui-bg100': '#FFFFFF',\n '--rui-bg200': '#FAFAFA',\n '--rui-bg300': '#F2F2F2',\n '--rui-bg-modal100': '#FFFFFF',\n '--rui-bg-modal200': '#FAFAFA',\n '--rui-bg-role-red': '#FFF5F5',\n '--rui-bg-secondary100': '#FFF4ED',\n '--rui-bg-highlight': '#FCF5DC',\n '--rui-bg-tiny-highlight': '#FAEDC3',\n '--rui-bg-role-yellow': '#FFFDF5',\n '--rui-bg-role-blue': '#EDF4FF',\n '--rui-bg-role-green': '#D9FCF2',\n '--rui-divider': '#D4D4D4',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n dark: {\n '--rui-primary100': '#FFFFFF',\n '--rui-primary200': '#000000',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#FFFFFF',\n '--rui-contents100': '#EBEBEB',\n '--rui-contents150': '#D4D4D4',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#808080',\n '--rui-contents999': '#000000',\n '--rui-disabled': '#808080',\n '--rui-disabled-role-red': '#6B2424',\n '--rui-disabled-secondary': '#4D2A14',\n '--rui-role-red': '#D13636',\n '--rui-role-yellow': '#D1AD36',\n '--rui-role-blue': '#085DD4',\n '--rui-role-green': '#22B28A',\n '--rui-bg100': '#1A1A1A',\n '--rui-bg200': '#000000',\n '--rui-bg300': '#000000',\n '--rui-bg-modal100': '#2E2E2E',\n '--rui-bg-modal200': '#424242',\n '--rui-bg-role-red': '#381515',\n '--rui-bg-secondary100': '#331D0F',\n '--rui-bg-highlight': '#383015',\n '--rui-bg-tiny-highlight': '#52451D',\n '--rui-bg-role-yellow': '#383015',\n '--rui-bg-role-blue': '#002861',\n '--rui-bg-role-green': '#15382E',\n '--rui-divider': '#424242',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n};\n"],"names":["RUI_COLOR_THEME","light","dark"],"mappings":";;AAEA;AACA;AACA;AACO,IAAMA,eAAkC,GAAG;AAChDC,EAAAA,KAAK,EAAE;AACL,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,0BAA0B,EAAE,SAAS;AACrC,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,iBAAiB,EAAE,SAAS;AAC5B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,uBAAuB,EAAE,SAAS;AAClC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,sBAAsB,EAAE,SAAS;AACjC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,qBAAqB,EAAE,SAAS;AAChC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,sBAAsB,EAAE
|
|
1
|
+
{"version":3,"file":"theme.cjs.js","sources":["../../../src/colors/theme.ts"],"sourcesContent":["import type { RUIColorThemeType } from './types';\n\n/**\n * {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}\n */\nexport const RUI_COLOR_THEME: RUIColorThemeType = {\n light: {\n '--rui-primary100': '#000000',\n '--rui-primary200': '#FFFFFF',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#000000',\n '--rui-contents100': '#424242',\n '--rui-contents150': '#808080',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#D4D4D4',\n '--rui-contents999': '#FFFFFF',\n '--rui-disabled': '#D4D4D4',\n '--rui-disabled-role-red': '#F7ABAB',\n '--rui-disabled-secondary': '#FFE3D1',\n '--rui-role-red': '#ED4E4E',\n '--rui-role-yellow': '#EDC84E',\n '--rui-role-blue': '#2679ED',\n '--rui-role-green': '#21C798',\n '--rui-bg100': '#FFFFFF',\n '--rui-bg200': '#FAFAFA',\n '--rui-bg300': '#F2F2F2',\n '--rui-bg-modal100': '#FFFFFF',\n '--rui-bg-modal200': '#FAFAFA',\n '--rui-bg-role-red': '#FFF5F5',\n '--rui-bg-secondary100': '#FFF4ED',\n '--rui-bg-highlight': '#FCF5DC',\n '--rui-bg-tiny-highlight': '#FAEDC3',\n '--rui-bg-role-yellow': '#FFFDF5',\n '--rui-bg-role-blue': '#EDF4FF',\n '--rui-bg-role-green': '#D9FCF2',\n '--rui-divider': '#D4D4D4',\n '--rui-divider-lite': '#EBEBEB',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n dark: {\n '--rui-primary100': '#FFFFFF',\n '--rui-primary200': '#000000',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#FFFFFF',\n '--rui-contents100': '#EBEBEB',\n '--rui-contents150': '#D4D4D4',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#808080',\n '--rui-contents999': '#000000',\n '--rui-disabled': '#808080',\n '--rui-disabled-role-red': '#6B2424',\n '--rui-disabled-secondary': '#4D2A14',\n '--rui-role-red': '#D13636',\n '--rui-role-yellow': '#D1AD36',\n '--rui-role-blue': '#085DD4',\n '--rui-role-green': '#22B28A',\n '--rui-bg100': '#1A1A1A',\n '--rui-bg200': '#000000',\n '--rui-bg300': '#000000',\n '--rui-bg-modal100': '#2E2E2E',\n '--rui-bg-modal200': '#424242',\n '--rui-bg-role-red': '#381515',\n '--rui-bg-secondary100': '#331D0F',\n '--rui-bg-highlight': '#383015',\n '--rui-bg-tiny-highlight': '#52451D',\n '--rui-bg-role-yellow': '#383015',\n '--rui-bg-role-blue': '#002861',\n '--rui-bg-role-green': '#15382E',\n '--rui-divider': '#424242',\n '--rui-divider-lite': '#2E2E2E',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n};\n"],"names":["RUI_COLOR_THEME","light","dark"],"mappings":";;AAEA;AACA;AACA;AACO,IAAMA,eAAkC,GAAG;AAChDC,EAAAA,KAAK,EAAE;AACL,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,0BAA0B,EAAE,SAAS;AACrC,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,iBAAiB,EAAE,SAAS;AAC5B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,uBAAuB,EAAE,SAAS;AAClC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,sBAAsB,EAAE,SAAS;AACjC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,qBAAqB,EAAE,SAAS;AAChC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,sBAAsB,EAAE;GACzB;AACDC,EAAAA,IAAI,EAAE;AACJ,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,0BAA0B,EAAE,SAAS;AACrC,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,iBAAiB,EAAE,SAAS;AAC5B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,uBAAuB,EAAE,SAAS;AAClC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,sBAAsB,EAAE,SAAS;AACjC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,qBAAqB,EAAE,SAAS;AAChC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,sBAAsB,EAAE;AAC1B;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/colors/theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/colors/theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,iBAuE7B,CAAC"}
|
|
@@ -32,6 +32,7 @@ var RUI_COLOR_THEME = {
|
|
|
32
32
|
'--rui-bg-role-blue': '#EDF4FF',
|
|
33
33
|
'--rui-bg-role-green': '#D9FCF2',
|
|
34
34
|
'--rui-divider': '#D4D4D4',
|
|
35
|
+
'--rui-divider-lite': '#EBEBEB',
|
|
35
36
|
'--rui-fixed-white': '#FFFFFF',
|
|
36
37
|
'--rui-fixed-black': '#000000',
|
|
37
38
|
'--rui-fixed-bg-white': '#FFFFFF'
|
|
@@ -66,6 +67,7 @@ var RUI_COLOR_THEME = {
|
|
|
66
67
|
'--rui-bg-role-blue': '#002861',
|
|
67
68
|
'--rui-bg-role-green': '#15382E',
|
|
68
69
|
'--rui-divider': '#424242',
|
|
70
|
+
'--rui-divider-lite': '#2E2E2E',
|
|
69
71
|
'--rui-fixed-white': '#FFFFFF',
|
|
70
72
|
'--rui-fixed-black': '#000000',
|
|
71
73
|
'--rui-fixed-bg-white': '#FFFFFF'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.esm.js","sources":["../../../src/colors/theme.ts"],"sourcesContent":["import type { RUIColorThemeType } from './types';\n\n/**\n * {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}\n */\nexport const RUI_COLOR_THEME: RUIColorThemeType = {\n light: {\n '--rui-primary100': '#000000',\n '--rui-primary200': '#FFFFFF',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#000000',\n '--rui-contents100': '#424242',\n '--rui-contents150': '#808080',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#D4D4D4',\n '--rui-contents999': '#FFFFFF',\n '--rui-disabled': '#D4D4D4',\n '--rui-disabled-role-red': '#F7ABAB',\n '--rui-disabled-secondary': '#FFE3D1',\n '--rui-role-red': '#ED4E4E',\n '--rui-role-yellow': '#EDC84E',\n '--rui-role-blue': '#2679ED',\n '--rui-role-green': '#21C798',\n '--rui-bg100': '#FFFFFF',\n '--rui-bg200': '#FAFAFA',\n '--rui-bg300': '#F2F2F2',\n '--rui-bg-modal100': '#FFFFFF',\n '--rui-bg-modal200': '#FAFAFA',\n '--rui-bg-role-red': '#FFF5F5',\n '--rui-bg-secondary100': '#FFF4ED',\n '--rui-bg-highlight': '#FCF5DC',\n '--rui-bg-tiny-highlight': '#FAEDC3',\n '--rui-bg-role-yellow': '#FFFDF5',\n '--rui-bg-role-blue': '#EDF4FF',\n '--rui-bg-role-green': '#D9FCF2',\n '--rui-divider': '#D4D4D4',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n dark: {\n '--rui-primary100': '#FFFFFF',\n '--rui-primary200': '#000000',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#FFFFFF',\n '--rui-contents100': '#EBEBEB',\n '--rui-contents150': '#D4D4D4',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#808080',\n '--rui-contents999': '#000000',\n '--rui-disabled': '#808080',\n '--rui-disabled-role-red': '#6B2424',\n '--rui-disabled-secondary': '#4D2A14',\n '--rui-role-red': '#D13636',\n '--rui-role-yellow': '#D1AD36',\n '--rui-role-blue': '#085DD4',\n '--rui-role-green': '#22B28A',\n '--rui-bg100': '#1A1A1A',\n '--rui-bg200': '#000000',\n '--rui-bg300': '#000000',\n '--rui-bg-modal100': '#2E2E2E',\n '--rui-bg-modal200': '#424242',\n '--rui-bg-role-red': '#381515',\n '--rui-bg-secondary100': '#331D0F',\n '--rui-bg-highlight': '#383015',\n '--rui-bg-tiny-highlight': '#52451D',\n '--rui-bg-role-yellow': '#383015',\n '--rui-bg-role-blue': '#002861',\n '--rui-bg-role-green': '#15382E',\n '--rui-divider': '#424242',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n};\n"],"names":["RUI_COLOR_THEME","light","dark"],"mappings":"AAEA;AACA;AACA;AACO,IAAMA,eAAkC,GAAG;AAChDC,EAAAA,KAAK,EAAE;AACL,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,0BAA0B,EAAE,SAAS;AACrC,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,iBAAiB,EAAE,SAAS;AAC5B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,uBAAuB,EAAE,SAAS;AAClC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,sBAAsB,EAAE,SAAS;AACjC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,qBAAqB,EAAE,SAAS;AAChC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,sBAAsB,EAAE
|
|
1
|
+
{"version":3,"file":"theme.esm.js","sources":["../../../src/colors/theme.ts"],"sourcesContent":["import type { RUIColorThemeType } from './types';\n\n/**\n * {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}\n */\nexport const RUI_COLOR_THEME: RUIColorThemeType = {\n light: {\n '--rui-primary100': '#000000',\n '--rui-primary200': '#FFFFFF',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#000000',\n '--rui-contents100': '#424242',\n '--rui-contents150': '#808080',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#D4D4D4',\n '--rui-contents999': '#FFFFFF',\n '--rui-disabled': '#D4D4D4',\n '--rui-disabled-role-red': '#F7ABAB',\n '--rui-disabled-secondary': '#FFE3D1',\n '--rui-role-red': '#ED4E4E',\n '--rui-role-yellow': '#EDC84E',\n '--rui-role-blue': '#2679ED',\n '--rui-role-green': '#21C798',\n '--rui-bg100': '#FFFFFF',\n '--rui-bg200': '#FAFAFA',\n '--rui-bg300': '#F2F2F2',\n '--rui-bg-modal100': '#FFFFFF',\n '--rui-bg-modal200': '#FAFAFA',\n '--rui-bg-role-red': '#FFF5F5',\n '--rui-bg-secondary100': '#FFF4ED',\n '--rui-bg-highlight': '#FCF5DC',\n '--rui-bg-tiny-highlight': '#FAEDC3',\n '--rui-bg-role-yellow': '#FFFDF5',\n '--rui-bg-role-blue': '#EDF4FF',\n '--rui-bg-role-green': '#D9FCF2',\n '--rui-divider': '#D4D4D4',\n '--rui-divider-lite': '#EBEBEB',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n dark: {\n '--rui-primary100': '#FFFFFF',\n '--rui-primary200': '#000000',\n '--rui-secondary100': '#FF6A0D',\n '--rui-contents000': '#FFFFFF',\n '--rui-contents100': '#EBEBEB',\n '--rui-contents150': '#D4D4D4',\n '--rui-contents200': '#BDBDBD',\n '--rui-contents300': '#808080',\n '--rui-contents999': '#000000',\n '--rui-disabled': '#808080',\n '--rui-disabled-role-red': '#6B2424',\n '--rui-disabled-secondary': '#4D2A14',\n '--rui-role-red': '#D13636',\n '--rui-role-yellow': '#D1AD36',\n '--rui-role-blue': '#085DD4',\n '--rui-role-green': '#22B28A',\n '--rui-bg100': '#1A1A1A',\n '--rui-bg200': '#000000',\n '--rui-bg300': '#000000',\n '--rui-bg-modal100': '#2E2E2E',\n '--rui-bg-modal200': '#424242',\n '--rui-bg-role-red': '#381515',\n '--rui-bg-secondary100': '#331D0F',\n '--rui-bg-highlight': '#383015',\n '--rui-bg-tiny-highlight': '#52451D',\n '--rui-bg-role-yellow': '#383015',\n '--rui-bg-role-blue': '#002861',\n '--rui-bg-role-green': '#15382E',\n '--rui-divider': '#424242',\n '--rui-divider-lite': '#2E2E2E',\n '--rui-fixed-white': '#FFFFFF',\n '--rui-fixed-black': '#000000',\n '--rui-fixed-bg-white': '#FFFFFF',\n },\n};\n"],"names":["RUI_COLOR_THEME","light","dark"],"mappings":"AAEA;AACA;AACA;AACO,IAAMA,eAAkC,GAAG;AAChDC,EAAAA,KAAK,EAAE;AACL,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,0BAA0B,EAAE,SAAS;AACrC,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,iBAAiB,EAAE,SAAS;AAC5B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,uBAAuB,EAAE,SAAS;AAClC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,sBAAsB,EAAE,SAAS;AACjC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,qBAAqB,EAAE,SAAS;AAChC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,sBAAsB,EAAE;GACzB;AACDC,EAAAA,IAAI,EAAE;AACJ,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,0BAA0B,EAAE,SAAS;AACrC,IAAA,gBAAgB,EAAE,SAAS;AAC3B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,iBAAiB,EAAE,SAAS;AAC5B,IAAA,kBAAkB,EAAE,SAAS;AAC7B,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,aAAa,EAAE,SAAS;AACxB,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,uBAAuB,EAAE,SAAS;AAClC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,yBAAyB,EAAE,SAAS;AACpC,IAAA,sBAAsB,EAAE,SAAS;AACjC,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,qBAAqB,EAAE,SAAS;AAChC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,oBAAoB,EAAE,SAAS;AAC/B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,mBAAmB,EAAE,SAAS;AAC9B,IAAA,sBAAsB,EAAE;AAC1B;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.cjs.js","sources":["../../../src/colors/utils.ts"],"sourcesContent":["import { isSSR } from '@remember-web/shared';\n\nimport { RUI_COLOR_THEME } from './theme';\nimport type {\n ColorVariable,\n ColorVariableName,\n RUIColorVariable,\n ThemeType,\n} from './types';\n\n/** var(color)로 된 string을 color로 변경해줄 때 사용 */\nexport function getColorVariableName<V extends string = string>(\n color: ColorVariable<V>\n) {\n return color.slice(4, -1) as ColorVariableName<V>;\n}\n\n/** RDS컬러의 rgb값이 필요할 때 사용ValidityState\n * @example css`color: rgba(${getRgb(contents000)},0.5)`\n */\nexport function getRgb(color: ColorVariable) {\n return `var(${getColorVariableName(color)}__rgb)`;\n}\n\n/** RDS컬러를 통해서 css의 rgba함수를 사용\n * @example css`color: ${getRgb(contents000, 0.5)}`\n * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`\n */\nexport function getRgba(color: ColorVariable, opacity: number | `${number}%`) {\n return `rgba(${getRgb(color)},${opacity})`;\n}\n\n/** hex로 된 컬러값을 rgb값으로 변경해줌 */\nexport function hexToRgb(colorHex: string) {\n let hexWithoutHash = colorHex.replace('#', '');\n\n if (hexWithoutHash.length !== 3 && hexWithoutHash.length !== 6) {\n throw new Error('Invalid hex color');\n }\n\n if (hexWithoutHash.length === 3) {\n hexWithoutHash = [...hexWithoutHash].map((hex) => hex.repeat(2)).join();\n }\n\n const [, r, g, b] = hexWithoutHash\n .split(/(..)(..)(..)/)\n .map((hex) => Number.parseInt(hex, 16));\n\n return `${r},${g},${b}`;\n}\n\nexport function getBrowserTheme(): ThemeType {\n if (!isSSR() && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n return 'dark';\n }\n return 'light';\n}\n\n/** css variable을 hex로 반환 */\nexport function getHexFromRuiCssVariable({\n colorVariable,\n theme,\n}: {\n theme: ThemeType;\n colorVariable: RUIColorVariable;\n}) {\n return RUI_COLOR_THEME[theme][getColorVariableName(colorVariable)];\n}\n"],"names":["getColorVariableName","color","slice","getRgb","concat","getRgba","opacity","hexToRgb","colorHex","hexWithoutHash","replace","length","Error","_toConsumableArray","map","hex","repeat","join","_hexWithoutHash$split","split","Number","parseInt","_hexWithoutHash$split2","_slicedToArray","r","g","b","getBrowserTheme","isSSR","window","matchMedia","matches","getHexFromRuiCssVariable","_ref","colorVariable","theme","RUI_COLOR_THEME"],"mappings":";;;;;;;;;;;;AAUA;AACO,SAASA,oBAAoBA,CAClCC,KAAuB,EACvB;EACA,OAAOA,KAAK,CAACC,KAAK,CAAC,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"utils.cjs.js","sources":["../../../src/colors/utils.ts"],"sourcesContent":["import { isSSR } from '@remember-web/shared';\n\nimport { RUI_COLOR_THEME } from './theme';\nimport type {\n ColorVariable,\n ColorVariableName,\n RUIColorVariable,\n ThemeType,\n} from './types';\n\n/** var(color)로 된 string을 color로 변경해줄 때 사용 */\nexport function getColorVariableName<V extends string = string>(\n color: ColorVariable<V>\n) {\n return color.slice(4, -1) as ColorVariableName<V>;\n}\n\n/** RDS컬러의 rgb값이 필요할 때 사용ValidityState\n * @example css`color: rgba(${getRgb(contents000)},0.5)`\n */\nexport function getRgb(color: ColorVariable) {\n return `var(${getColorVariableName(color)}__rgb)`;\n}\n\n/** RDS컬러를 통해서 css의 rgba함수를 사용\n * @example css`color: ${getRgb(contents000, 0.5)}`\n * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`\n */\nexport function getRgba(color: ColorVariable, opacity: number | `${number}%`) {\n return `rgba(${getRgb(color)},${opacity})`;\n}\n\n/** hex로 된 컬러값을 rgb값으로 변경해줌 */\nexport function hexToRgb(colorHex: string) {\n let hexWithoutHash = colorHex.replace('#', '');\n\n if (hexWithoutHash.length !== 3 && hexWithoutHash.length !== 6) {\n throw new Error('Invalid hex color');\n }\n\n if (hexWithoutHash.length === 3) {\n hexWithoutHash = [...hexWithoutHash].map((hex) => hex.repeat(2)).join();\n }\n\n const [, r, g, b] = hexWithoutHash\n .split(/(..)(..)(..)/)\n .map((hex) => Number.parseInt(hex, 16));\n\n return `${r},${g},${b}`;\n}\n\nexport function getBrowserTheme(): ThemeType {\n if (!isSSR() && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n return 'dark';\n }\n return 'light';\n}\n\n/** css variable을 hex로 반환 */\nexport function getHexFromRuiCssVariable({\n colorVariable,\n theme,\n}: {\n theme: ThemeType;\n colorVariable: RUIColorVariable;\n}) {\n return RUI_COLOR_THEME[theme][getColorVariableName(colorVariable)];\n}\n"],"names":["getColorVariableName","color","slice","getRgb","concat","getRgba","opacity","hexToRgb","colorHex","hexWithoutHash","replace","length","Error","_toConsumableArray","map","hex","repeat","join","_hexWithoutHash$split","split","Number","parseInt","_hexWithoutHash$split2","_slicedToArray","r","g","b","getBrowserTheme","isSSR","window","matchMedia","matches","getHexFromRuiCssVariable","_ref","colorVariable","theme","RUI_COLOR_THEME"],"mappings":";;;;;;;;;;;;AAUA;AACO,SAASA,oBAAoBA,CAClCC,KAAuB,EACvB;EACA,OAAOA,KAAK,CAACC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC;AAC3B;;AAEA;AACA;AACA;AACO,SAASC,MAAMA,CAACF,KAAoB,EAAE;AAC3C,EAAA,OAAA,MAAA,CAAAG,MAAA,CAAcJ,oBAAoB,CAACC,KAAK,CAAC,EAAA,QAAA,CAAA;AAC3C;;AAEA;AACA;AACA;AACA;AACO,SAASI,OAAOA,CAACJ,KAAoB,EAAEK,OAA8B,EAAE;EAC5E,OAAA,OAAA,CAAAF,MAAA,CAAeD,MAAM,CAACF,KAAK,CAAC,EAAA,GAAA,CAAA,CAAAG,MAAA,CAAIE,OAAO,EAAA,GAAA,CAAA;AACzC;;AAEA;AACO,SAASC,QAAQA,CAACC,QAAgB,EAAE;EACzC,IAAIC,cAAc,GAAGD,QAAQ,CAACE,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;EAE9C,IAAID,cAAc,CAACE,MAAM,KAAK,CAAC,IAAIF,cAAc,CAACE,MAAM,KAAK,CAAC,EAAE;AAC9D,IAAA,MAAM,IAAIC,KAAK,CAAC,mBAAmB,CAAC;AACtC;AAEA,EAAA,IAAIH,cAAc,CAACE,MAAM,KAAK,CAAC,EAAE;IAC/BF,cAAc,GAAGI,mCAAA,CAAIJ,cAAc,EAAEK,GAAG,CAAC,UAACC,GAAG,EAAA;AAAA,MAAA,OAAKA,GAAG,CAACC,MAAM,CAAC,CAAC,CAAC;KAAA,CAAC,CAACC,IAAI,EAAE;AACzE;AAEA,EAAA,IAAAC,qBAAA,GAAoBT,cAAc,CAC/BU,KAAK,CAAC,cAAc,CAAC,CACrBL,GAAG,CAAC,UAACC,GAAG,EAAA;AAAA,MAAA,OAAKK,MAAM,CAACC,QAAQ,CAACN,GAAG,EAAE,EAAE,CAAC;KAAA,CAAC;IAAAO,sBAAA,GAAAC,+BAAA,CAAAL,qBAAA,EAAA,CAAA,CAAA;AAFhCM,IAAAA,CAAC,GAAAF,sBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,CAAC,GAAAH,sBAAA,CAAA,CAAA,CAAA;AAAEI,IAAAA,CAAC,GAAAJ,sBAAA,CAAA,CAAA,CAAA;EAIhB,OAAA,EAAA,CAAAlB,MAAA,CAAUoB,CAAC,EAAA,GAAA,CAAA,CAAApB,MAAA,CAAIqB,CAAC,EAAA,GAAA,CAAA,CAAArB,MAAA,CAAIsB,CAAC,CAAA;AACvB;AAEO,SAASC,eAAeA,GAAc;AAC3C,EAAA,IAAI,CAACC,YAAK,EAAE,IAAIC,MAAM,CAACC,UAAU,CAAC,8BAA8B,CAAC,CAACC,OAAO,EAAE;AACzE,IAAA,OAAO,MAAM;AACf;AACA,EAAA,OAAO,OAAO;AAChB;;AAEA;AACO,SAASC,wBAAwBA,CAAAC,IAAA,EAMrC;AAAA,EAAA,IALDC,aAAa,GAAAD,IAAA,CAAbC,aAAa;IACbC,OAAK,GAAAF,IAAA,CAALE,KAAK;EAKL,OAAOC,qBAAe,CAACD,OAAK,CAAC,CAACnC,oBAAoB,CAACkC,aAAa,CAAC,CAAC;AACpE;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.esm.js","sources":["../../../src/colors/utils.ts"],"sourcesContent":["import { isSSR } from '@remember-web/shared';\n\nimport { RUI_COLOR_THEME } from './theme';\nimport type {\n ColorVariable,\n ColorVariableName,\n RUIColorVariable,\n ThemeType,\n} from './types';\n\n/** var(color)로 된 string을 color로 변경해줄 때 사용 */\nexport function getColorVariableName<V extends string = string>(\n color: ColorVariable<V>\n) {\n return color.slice(4, -1) as ColorVariableName<V>;\n}\n\n/** RDS컬러의 rgb값이 필요할 때 사용ValidityState\n * @example css`color: rgba(${getRgb(contents000)},0.5)`\n */\nexport function getRgb(color: ColorVariable) {\n return `var(${getColorVariableName(color)}__rgb)`;\n}\n\n/** RDS컬러를 통해서 css의 rgba함수를 사용\n * @example css`color: ${getRgb(contents000, 0.5)}`\n * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`\n */\nexport function getRgba(color: ColorVariable, opacity: number | `${number}%`) {\n return `rgba(${getRgb(color)},${opacity})`;\n}\n\n/** hex로 된 컬러값을 rgb값으로 변경해줌 */\nexport function hexToRgb(colorHex: string) {\n let hexWithoutHash = colorHex.replace('#', '');\n\n if (hexWithoutHash.length !== 3 && hexWithoutHash.length !== 6) {\n throw new Error('Invalid hex color');\n }\n\n if (hexWithoutHash.length === 3) {\n hexWithoutHash = [...hexWithoutHash].map((hex) => hex.repeat(2)).join();\n }\n\n const [, r, g, b] = hexWithoutHash\n .split(/(..)(..)(..)/)\n .map((hex) => Number.parseInt(hex, 16));\n\n return `${r},${g},${b}`;\n}\n\nexport function getBrowserTheme(): ThemeType {\n if (!isSSR() && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n return 'dark';\n }\n return 'light';\n}\n\n/** css variable을 hex로 반환 */\nexport function getHexFromRuiCssVariable({\n colorVariable,\n theme,\n}: {\n theme: ThemeType;\n colorVariable: RUIColorVariable;\n}) {\n return RUI_COLOR_THEME[theme][getColorVariableName(colorVariable)];\n}\n"],"names":["getColorVariableName","color","slice","getRgb","concat","getRgba","opacity","hexToRgb","colorHex","hexWithoutHash","replace","length","Error","_toConsumableArray","map","hex","repeat","join","_hexWithoutHash$split","split","Number","parseInt","_hexWithoutHash$split2","_slicedToArray","r","g","b","getBrowserTheme","isSSR","window","matchMedia","matches","getHexFromRuiCssVariable","_ref","colorVariable","theme","RUI_COLOR_THEME"],"mappings":";;;;;AAUA;AACO,SAASA,oBAAoBA,CAClCC,KAAuB,EACvB;EACA,OAAOA,KAAK,CAACC,KAAK,CAAC,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"utils.esm.js","sources":["../../../src/colors/utils.ts"],"sourcesContent":["import { isSSR } from '@remember-web/shared';\n\nimport { RUI_COLOR_THEME } from './theme';\nimport type {\n ColorVariable,\n ColorVariableName,\n RUIColorVariable,\n ThemeType,\n} from './types';\n\n/** var(color)로 된 string을 color로 변경해줄 때 사용 */\nexport function getColorVariableName<V extends string = string>(\n color: ColorVariable<V>\n) {\n return color.slice(4, -1) as ColorVariableName<V>;\n}\n\n/** RDS컬러의 rgb값이 필요할 때 사용ValidityState\n * @example css`color: rgba(${getRgb(contents000)},0.5)`\n */\nexport function getRgb(color: ColorVariable) {\n return `var(${getColorVariableName(color)}__rgb)`;\n}\n\n/** RDS컬러를 통해서 css의 rgba함수를 사용\n * @example css`color: ${getRgb(contents000, 0.5)}`\n * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`\n */\nexport function getRgba(color: ColorVariable, opacity: number | `${number}%`) {\n return `rgba(${getRgb(color)},${opacity})`;\n}\n\n/** hex로 된 컬러값을 rgb값으로 변경해줌 */\nexport function hexToRgb(colorHex: string) {\n let hexWithoutHash = colorHex.replace('#', '');\n\n if (hexWithoutHash.length !== 3 && hexWithoutHash.length !== 6) {\n throw new Error('Invalid hex color');\n }\n\n if (hexWithoutHash.length === 3) {\n hexWithoutHash = [...hexWithoutHash].map((hex) => hex.repeat(2)).join();\n }\n\n const [, r, g, b] = hexWithoutHash\n .split(/(..)(..)(..)/)\n .map((hex) => Number.parseInt(hex, 16));\n\n return `${r},${g},${b}`;\n}\n\nexport function getBrowserTheme(): ThemeType {\n if (!isSSR() && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n return 'dark';\n }\n return 'light';\n}\n\n/** css variable을 hex로 반환 */\nexport function getHexFromRuiCssVariable({\n colorVariable,\n theme,\n}: {\n theme: ThemeType;\n colorVariable: RUIColorVariable;\n}) {\n return RUI_COLOR_THEME[theme][getColorVariableName(colorVariable)];\n}\n"],"names":["getColorVariableName","color","slice","getRgb","concat","getRgba","opacity","hexToRgb","colorHex","hexWithoutHash","replace","length","Error","_toConsumableArray","map","hex","repeat","join","_hexWithoutHash$split","split","Number","parseInt","_hexWithoutHash$split2","_slicedToArray","r","g","b","getBrowserTheme","isSSR","window","matchMedia","matches","getHexFromRuiCssVariable","_ref","colorVariable","theme","RUI_COLOR_THEME"],"mappings":";;;;;AAUA;AACO,SAASA,oBAAoBA,CAClCC,KAAuB,EACvB;EACA,OAAOA,KAAK,CAACC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC;AAC3B;;AAEA;AACA;AACA;AACO,SAASC,MAAMA,CAACF,KAAoB,EAAE;AAC3C,EAAA,OAAA,MAAA,CAAAG,MAAA,CAAcJ,oBAAoB,CAACC,KAAK,CAAC,EAAA,QAAA,CAAA;AAC3C;;AAEA;AACA;AACA;AACA;AACO,SAASI,OAAOA,CAACJ,KAAoB,EAAEK,OAA8B,EAAE;EAC5E,OAAA,OAAA,CAAAF,MAAA,CAAeD,MAAM,CAACF,KAAK,CAAC,EAAA,GAAA,CAAA,CAAAG,MAAA,CAAIE,OAAO,EAAA,GAAA,CAAA;AACzC;;AAEA;AACO,SAASC,QAAQA,CAACC,QAAgB,EAAE;EACzC,IAAIC,cAAc,GAAGD,QAAQ,CAACE,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;EAE9C,IAAID,cAAc,CAACE,MAAM,KAAK,CAAC,IAAIF,cAAc,CAACE,MAAM,KAAK,CAAC,EAAE;AAC9D,IAAA,MAAM,IAAIC,KAAK,CAAC,mBAAmB,CAAC;AACtC;AAEA,EAAA,IAAIH,cAAc,CAACE,MAAM,KAAK,CAAC,EAAE;IAC/BF,cAAc,GAAGI,kBAAA,CAAIJ,cAAc,EAAEK,GAAG,CAAC,UAACC,GAAG,EAAA;AAAA,MAAA,OAAKA,GAAG,CAACC,MAAM,CAAC,CAAC,CAAC;KAAA,CAAC,CAACC,IAAI,EAAE;AACzE;AAEA,EAAA,IAAAC,qBAAA,GAAoBT,cAAc,CAC/BU,KAAK,CAAC,cAAc,CAAC,CACrBL,GAAG,CAAC,UAACC,GAAG,EAAA;AAAA,MAAA,OAAKK,MAAM,CAACC,QAAQ,CAACN,GAAG,EAAE,EAAE,CAAC;KAAA,CAAC;IAAAO,sBAAA,GAAAC,cAAA,CAAAL,qBAAA,EAAA,CAAA,CAAA;AAFhCM,IAAAA,CAAC,GAAAF,sBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,CAAC,GAAAH,sBAAA,CAAA,CAAA,CAAA;AAAEI,IAAAA,CAAC,GAAAJ,sBAAA,CAAA,CAAA,CAAA;EAIhB,OAAA,EAAA,CAAAlB,MAAA,CAAUoB,CAAC,EAAA,GAAA,CAAA,CAAApB,MAAA,CAAIqB,CAAC,EAAA,GAAA,CAAA,CAAArB,MAAA,CAAIsB,CAAC,CAAA;AACvB;AAEO,SAASC,eAAeA,GAAc;AAC3C,EAAA,IAAI,CAACC,KAAK,EAAE,IAAIC,MAAM,CAACC,UAAU,CAAC,8BAA8B,CAAC,CAACC,OAAO,EAAE;AACzE,IAAA,OAAO,MAAM;AACf;AACA,EAAA,OAAO,OAAO;AAChB;;AAEA;AACO,SAASC,wBAAwBA,CAAAC,IAAA,EAMrC;AAAA,EAAA,IALDC,aAAa,GAAAD,IAAA,CAAbC,aAAa;IACbC,KAAK,GAAAF,IAAA,CAALE,KAAK;EAKL,OAAOC,eAAe,CAACD,KAAK,CAAC,CAACnC,oBAAoB,CAACkC,aAAa,CAAC,CAAC;AACpE;;;;"}
|
|
@@ -39,6 +39,7 @@ var bgRoleGreen = 'var(--rui-bg-role-green)';
|
|
|
39
39
|
|
|
40
40
|
// Divider
|
|
41
41
|
var divider = 'var(--rui-divider)';
|
|
42
|
+
var dividerLite = 'var(--rui-divider-lite)';
|
|
42
43
|
|
|
43
44
|
// Fixed
|
|
44
45
|
var fixedWhite = 'var(--rui-fixed-white)';
|
|
@@ -67,6 +68,7 @@ exports.disabled = disabled;
|
|
|
67
68
|
exports.disabledRoleRed = disabledRoleRed;
|
|
68
69
|
exports.disabledSecondary = disabledSecondary;
|
|
69
70
|
exports.divider = divider;
|
|
71
|
+
exports.dividerLite = dividerLite;
|
|
70
72
|
exports.fixedBgWhite = fixedBgWhite;
|
|
71
73
|
exports.fixedBlack = fixedBlack;
|
|
72
74
|
exports.fixedWhite = fixedWhite;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"variables.cjs.js","sources":["../../../src/colors/variables.ts"],"sourcesContent":["export const primary100 = 'var(--rui-primary100)';\nexport const primary200 = 'var(--rui-primary200)';\nexport const secondary100 = 'var(--rui-secondary100)';\n\n// Contents txt/ label/ border/ divider\nexport const contents000 = 'var(--rui-contents000)';\nexport const contents100 = 'var(--rui-contents100)';\nexport const contents150 = 'var(--rui-contents150)';\nexport const contents200 = 'var(--rui-contents200)';\nexport const contents300 = 'var(--rui-contents300)';\nexport const contents999 = 'var(--rui-contents999)';\n\n// Disable disabled CTA\nexport const disabled = 'var(--rui-disabled)';\nexport const disabledRoleRed = 'var(--rui-disabled-role-red)';\nexport const disabledSecondary = 'var(--rui-disabled-secondary)';\n\n// Accent Error/ Link/\nexport const roleRed = 'var(--rui-role-red)';\nexport const roleYellow = 'var(--rui-role-yellow)';\nexport const roleBlue = 'var(--rui-role-blue)';\nexport const roleGreen = 'var(--rui-role-green)';\n\n// Background\nexport const bg100 = 'var(--rui-bg100)';\nexport const bg200 = 'var(--rui-bg200)';\nexport const bg300 = 'var(--rui-bg300)';\nexport const bgModal100 = 'var(--rui-bg-modal100)';\nexport const bgModal200 = 'var(--rui-bg-modal200)';\nexport const bgRoleRed = 'var(--rui-bg-role-red)';\nexport const bgSecondary100 = 'var(--rui-bg-secondary100)';\nexport const bgHighlight = 'var(--rui-bg-highlight)';\nexport const bgTinyHighlight = 'var(--rui-bg-tiny-highlight)';\nexport const bgRoleYellow = 'var(--rui-bg-role-yellow)';\nexport const bgRoleBlue = 'var(--rui-bg-role-blue)';\nexport const bgRoleGreen = 'var(--rui-bg-role-green)';\n\n// Divider\nexport const divider = 'var(--rui-divider)';\n\n// Fixed\nexport const fixedWhite = 'var(--rui-fixed-white)';\nexport const fixedBgWhite = 'var(--rui-fixed-bg-white)';\nexport const fixedBlack = 'var(--rui-fixed-black)';\n"],"names":["primary100","primary200","secondary100","contents000","contents100","contents150","contents200","contents300","contents999","disabled","disabledRoleRed","disabledSecondary","roleRed","roleYellow","roleBlue","roleGreen","bg100","bg200","bg300","bgModal100","bgModal200","bgRoleRed","bgSecondary100","bgHighlight","bgTinyHighlight","bgRoleYellow","bgRoleBlue","bgRoleGreen","divider","fixedWhite","fixedBgWhite","fixedBlack"],"mappings":";;AAAO,IAAMA,UAAU,GAAG
|
|
1
|
+
{"version":3,"file":"variables.cjs.js","sources":["../../../src/colors/variables.ts"],"sourcesContent":["export const primary100 = 'var(--rui-primary100)';\nexport const primary200 = 'var(--rui-primary200)';\nexport const secondary100 = 'var(--rui-secondary100)';\n\n// Contents txt/ label/ border/ divider\nexport const contents000 = 'var(--rui-contents000)';\nexport const contents100 = 'var(--rui-contents100)';\nexport const contents150 = 'var(--rui-contents150)';\nexport const contents200 = 'var(--rui-contents200)';\nexport const contents300 = 'var(--rui-contents300)';\nexport const contents999 = 'var(--rui-contents999)';\n\n// Disable disabled CTA\nexport const disabled = 'var(--rui-disabled)';\nexport const disabledRoleRed = 'var(--rui-disabled-role-red)';\nexport const disabledSecondary = 'var(--rui-disabled-secondary)';\n\n// Accent Error/ Link/\nexport const roleRed = 'var(--rui-role-red)';\nexport const roleYellow = 'var(--rui-role-yellow)';\nexport const roleBlue = 'var(--rui-role-blue)';\nexport const roleGreen = 'var(--rui-role-green)';\n\n// Background\nexport const bg100 = 'var(--rui-bg100)';\nexport const bg200 = 'var(--rui-bg200)';\nexport const bg300 = 'var(--rui-bg300)';\nexport const bgModal100 = 'var(--rui-bg-modal100)';\nexport const bgModal200 = 'var(--rui-bg-modal200)';\nexport const bgRoleRed = 'var(--rui-bg-role-red)';\nexport const bgSecondary100 = 'var(--rui-bg-secondary100)';\nexport const bgHighlight = 'var(--rui-bg-highlight)';\nexport const bgTinyHighlight = 'var(--rui-bg-tiny-highlight)';\nexport const bgRoleYellow = 'var(--rui-bg-role-yellow)';\nexport const bgRoleBlue = 'var(--rui-bg-role-blue)';\nexport const bgRoleGreen = 'var(--rui-bg-role-green)';\n\n// Divider\nexport const divider = 'var(--rui-divider)';\nexport const dividerLite = 'var(--rui-divider-lite)';\n\n// Fixed\nexport const fixedWhite = 'var(--rui-fixed-white)';\nexport const fixedBgWhite = 'var(--rui-fixed-bg-white)';\nexport const fixedBlack = 'var(--rui-fixed-black)';\n"],"names":["primary100","primary200","secondary100","contents000","contents100","contents150","contents200","contents300","contents999","disabled","disabledRoleRed","disabledSecondary","roleRed","roleYellow","roleBlue","roleGreen","bg100","bg200","bg300","bgModal100","bgModal200","bgRoleRed","bgSecondary100","bgHighlight","bgTinyHighlight","bgRoleYellow","bgRoleBlue","bgRoleGreen","divider","dividerLite","fixedWhite","fixedBgWhite","fixedBlack"],"mappings":";;AAAO,IAAMA,UAAU,GAAG;AACnB,IAAMC,UAAU,GAAG;AACnB,IAAMC,YAAY,GAAG;;AAE5B;AACO,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;;AAE3B;AACO,IAAMC,QAAQ,GAAG;AACjB,IAAMC,eAAe,GAAG;AACxB,IAAMC,iBAAiB,GAAG;;AAEjC;AACO,IAAMC,OAAO,GAAG;AAChB,IAAMC,UAAU,GAAG;AACnB,IAAMC,QAAQ,GAAG;AACjB,IAAMC,SAAS,GAAG;;AAEzB;AACO,IAAMC,KAAK,GAAG;AACd,IAAMC,KAAK,GAAG;AACd,IAAMC,KAAK,GAAG;AACd,IAAMC,UAAU,GAAG;AACnB,IAAMC,UAAU,GAAG;AACnB,IAAMC,SAAS,GAAG;AAClB,IAAMC,cAAc,GAAG;AACvB,IAAMC,WAAW,GAAG;AACpB,IAAMC,eAAe,GAAG;AACxB,IAAMC,YAAY,GAAG;AACrB,IAAMC,UAAU,GAAG;AACnB,IAAMC,WAAW,GAAG;;AAE3B;AACO,IAAMC,OAAO,GAAG;AAChB,IAAMC,WAAW,GAAG;;AAE3B;AACO,IAAMC,UAAU,GAAG;AACnB,IAAMC,YAAY,GAAG;AACrB,IAAMC,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -27,6 +27,7 @@ export declare const bgRoleYellow = "var(--rui-bg-role-yellow)";
|
|
|
27
27
|
export declare const bgRoleBlue = "var(--rui-bg-role-blue)";
|
|
28
28
|
export declare const bgRoleGreen = "var(--rui-bg-role-green)";
|
|
29
29
|
export declare const divider = "var(--rui-divider)";
|
|
30
|
+
export declare const dividerLite = "var(--rui-divider-lite)";
|
|
30
31
|
export declare const fixedWhite = "var(--rui-fixed-white)";
|
|
31
32
|
export declare const fixedBgWhite = "var(--rui-fixed-bg-white)";
|
|
32
33
|
export declare const fixedBlack = "var(--rui-fixed-black)";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"variables.d.ts","sourceRoot":"","sources":["../../../src/colors/variables.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,0BAA0B,CAAC;AAClD,eAAO,MAAM,UAAU,0BAA0B,CAAC;AAClD,eAAO,MAAM,YAAY,4BAA4B,CAAC;AAGtD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AAGpD,eAAO,MAAM,QAAQ,wBAAwB,CAAC;AAC9C,eAAO,MAAM,eAAe,iCAAiC,CAAC;AAC9D,eAAO,MAAM,iBAAiB,kCAAkC,CAAC;AAGjE,eAAO,MAAM,OAAO,wBAAwB,CAAC;AAC7C,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,QAAQ,yBAAyB,CAAC;AAC/C,eAAO,MAAM,SAAS,0BAA0B,CAAC;AAGjD,eAAO,MAAM,KAAK,qBAAqB,CAAC;AACxC,eAAO,MAAM,KAAK,qBAAqB,CAAC;AACxC,eAAO,MAAM,KAAK,qBAAqB,CAAC;AACxC,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,SAAS,2BAA2B,CAAC;AAClD,eAAO,MAAM,cAAc,+BAA+B,CAAC;AAC3D,eAAO,MAAM,WAAW,4BAA4B,CAAC;AACrD,eAAO,MAAM,eAAe,iCAAiC,CAAC;AAC9D,eAAO,MAAM,YAAY,8BAA8B,CAAC;AACxD,eAAO,MAAM,UAAU,4BAA4B,CAAC;AACpD,eAAO,MAAM,WAAW,6BAA6B,CAAC;AAGtD,eAAO,MAAM,OAAO,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"variables.d.ts","sourceRoot":"","sources":["../../../src/colors/variables.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,0BAA0B,CAAC;AAClD,eAAO,MAAM,UAAU,0BAA0B,CAAC;AAClD,eAAO,MAAM,YAAY,4BAA4B,CAAC;AAGtD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AACpD,eAAO,MAAM,WAAW,2BAA2B,CAAC;AAGpD,eAAO,MAAM,QAAQ,wBAAwB,CAAC;AAC9C,eAAO,MAAM,eAAe,iCAAiC,CAAC;AAC9D,eAAO,MAAM,iBAAiB,kCAAkC,CAAC;AAGjE,eAAO,MAAM,OAAO,wBAAwB,CAAC;AAC7C,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,QAAQ,yBAAyB,CAAC;AAC/C,eAAO,MAAM,SAAS,0BAA0B,CAAC;AAGjD,eAAO,MAAM,KAAK,qBAAqB,CAAC;AACxC,eAAO,MAAM,KAAK,qBAAqB,CAAC;AACxC,eAAO,MAAM,KAAK,qBAAqB,CAAC;AACxC,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,SAAS,2BAA2B,CAAC;AAClD,eAAO,MAAM,cAAc,+BAA+B,CAAC;AAC3D,eAAO,MAAM,WAAW,4BAA4B,CAAC;AACrD,eAAO,MAAM,eAAe,iCAAiC,CAAC;AAC9D,eAAO,MAAM,YAAY,8BAA8B,CAAC;AACxD,eAAO,MAAM,UAAU,4BAA4B,CAAC;AACpD,eAAO,MAAM,WAAW,6BAA6B,CAAC;AAGtD,eAAO,MAAM,OAAO,uBAAuB,CAAC;AAC5C,eAAO,MAAM,WAAW,4BAA4B,CAAC;AAGrD,eAAO,MAAM,UAAU,2BAA2B,CAAC;AACnD,eAAO,MAAM,YAAY,8BAA8B,CAAC;AACxD,eAAO,MAAM,UAAU,2BAA2B,CAAC"}
|
|
@@ -37,11 +37,12 @@ var bgRoleGreen = 'var(--rui-bg-role-green)';
|
|
|
37
37
|
|
|
38
38
|
// Divider
|
|
39
39
|
var divider = 'var(--rui-divider)';
|
|
40
|
+
var dividerLite = 'var(--rui-divider-lite)';
|
|
40
41
|
|
|
41
42
|
// Fixed
|
|
42
43
|
var fixedWhite = 'var(--rui-fixed-white)';
|
|
43
44
|
var fixedBgWhite = 'var(--rui-fixed-bg-white)';
|
|
44
45
|
var fixedBlack = 'var(--rui-fixed-black)';
|
|
45
46
|
|
|
46
|
-
export { bg100, bg200, bg300, bgHighlight, bgModal100, bgModal200, bgRoleBlue, bgRoleGreen, bgRoleRed, bgRoleYellow, bgSecondary100, bgTinyHighlight, contents000, contents100, contents150, contents200, contents300, contents999, disabled, disabledRoleRed, disabledSecondary, divider, fixedBgWhite, fixedBlack, fixedWhite, primary100, primary200, roleBlue, roleGreen, roleRed, roleYellow, secondary100 };
|
|
47
|
+
export { bg100, bg200, bg300, bgHighlight, bgModal100, bgModal200, bgRoleBlue, bgRoleGreen, bgRoleRed, bgRoleYellow, bgSecondary100, bgTinyHighlight, contents000, contents100, contents150, contents200, contents300, contents999, disabled, disabledRoleRed, disabledSecondary, divider, dividerLite, fixedBgWhite, fixedBlack, fixedWhite, primary100, primary200, roleBlue, roleGreen, roleRed, roleYellow, secondary100 };
|
|
47
48
|
//# sourceMappingURL=variables.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"variables.esm.js","sources":["../../../src/colors/variables.ts"],"sourcesContent":["export const primary100 = 'var(--rui-primary100)';\nexport const primary200 = 'var(--rui-primary200)';\nexport const secondary100 = 'var(--rui-secondary100)';\n\n// Contents txt/ label/ border/ divider\nexport const contents000 = 'var(--rui-contents000)';\nexport const contents100 = 'var(--rui-contents100)';\nexport const contents150 = 'var(--rui-contents150)';\nexport const contents200 = 'var(--rui-contents200)';\nexport const contents300 = 'var(--rui-contents300)';\nexport const contents999 = 'var(--rui-contents999)';\n\n// Disable disabled CTA\nexport const disabled = 'var(--rui-disabled)';\nexport const disabledRoleRed = 'var(--rui-disabled-role-red)';\nexport const disabledSecondary = 'var(--rui-disabled-secondary)';\n\n// Accent Error/ Link/\nexport const roleRed = 'var(--rui-role-red)';\nexport const roleYellow = 'var(--rui-role-yellow)';\nexport const roleBlue = 'var(--rui-role-blue)';\nexport const roleGreen = 'var(--rui-role-green)';\n\n// Background\nexport const bg100 = 'var(--rui-bg100)';\nexport const bg200 = 'var(--rui-bg200)';\nexport const bg300 = 'var(--rui-bg300)';\nexport const bgModal100 = 'var(--rui-bg-modal100)';\nexport const bgModal200 = 'var(--rui-bg-modal200)';\nexport const bgRoleRed = 'var(--rui-bg-role-red)';\nexport const bgSecondary100 = 'var(--rui-bg-secondary100)';\nexport const bgHighlight = 'var(--rui-bg-highlight)';\nexport const bgTinyHighlight = 'var(--rui-bg-tiny-highlight)';\nexport const bgRoleYellow = 'var(--rui-bg-role-yellow)';\nexport const bgRoleBlue = 'var(--rui-bg-role-blue)';\nexport const bgRoleGreen = 'var(--rui-bg-role-green)';\n\n// Divider\nexport const divider = 'var(--rui-divider)';\n\n// Fixed\nexport const fixedWhite = 'var(--rui-fixed-white)';\nexport const fixedBgWhite = 'var(--rui-fixed-bg-white)';\nexport const fixedBlack = 'var(--rui-fixed-black)';\n"],"names":["primary100","primary200","secondary100","contents000","contents100","contents150","contents200","contents300","contents999","disabled","disabledRoleRed","disabledSecondary","roleRed","roleYellow","roleBlue","roleGreen","bg100","bg200","bg300","bgModal100","bgModal200","bgRoleRed","bgSecondary100","bgHighlight","bgTinyHighlight","bgRoleYellow","bgRoleBlue","bgRoleGreen","divider","fixedWhite","fixedBgWhite","fixedBlack"],"mappings":"AAAO,IAAMA,UAAU,GAAG
|
|
1
|
+
{"version":3,"file":"variables.esm.js","sources":["../../../src/colors/variables.ts"],"sourcesContent":["export const primary100 = 'var(--rui-primary100)';\nexport const primary200 = 'var(--rui-primary200)';\nexport const secondary100 = 'var(--rui-secondary100)';\n\n// Contents txt/ label/ border/ divider\nexport const contents000 = 'var(--rui-contents000)';\nexport const contents100 = 'var(--rui-contents100)';\nexport const contents150 = 'var(--rui-contents150)';\nexport const contents200 = 'var(--rui-contents200)';\nexport const contents300 = 'var(--rui-contents300)';\nexport const contents999 = 'var(--rui-contents999)';\n\n// Disable disabled CTA\nexport const disabled = 'var(--rui-disabled)';\nexport const disabledRoleRed = 'var(--rui-disabled-role-red)';\nexport const disabledSecondary = 'var(--rui-disabled-secondary)';\n\n// Accent Error/ Link/\nexport const roleRed = 'var(--rui-role-red)';\nexport const roleYellow = 'var(--rui-role-yellow)';\nexport const roleBlue = 'var(--rui-role-blue)';\nexport const roleGreen = 'var(--rui-role-green)';\n\n// Background\nexport const bg100 = 'var(--rui-bg100)';\nexport const bg200 = 'var(--rui-bg200)';\nexport const bg300 = 'var(--rui-bg300)';\nexport const bgModal100 = 'var(--rui-bg-modal100)';\nexport const bgModal200 = 'var(--rui-bg-modal200)';\nexport const bgRoleRed = 'var(--rui-bg-role-red)';\nexport const bgSecondary100 = 'var(--rui-bg-secondary100)';\nexport const bgHighlight = 'var(--rui-bg-highlight)';\nexport const bgTinyHighlight = 'var(--rui-bg-tiny-highlight)';\nexport const bgRoleYellow = 'var(--rui-bg-role-yellow)';\nexport const bgRoleBlue = 'var(--rui-bg-role-blue)';\nexport const bgRoleGreen = 'var(--rui-bg-role-green)';\n\n// Divider\nexport const divider = 'var(--rui-divider)';\nexport const dividerLite = 'var(--rui-divider-lite)';\n\n// Fixed\nexport const fixedWhite = 'var(--rui-fixed-white)';\nexport const fixedBgWhite = 'var(--rui-fixed-bg-white)';\nexport const fixedBlack = 'var(--rui-fixed-black)';\n"],"names":["primary100","primary200","secondary100","contents000","contents100","contents150","contents200","contents300","contents999","disabled","disabledRoleRed","disabledSecondary","roleRed","roleYellow","roleBlue","roleGreen","bg100","bg200","bg300","bgModal100","bgModal200","bgRoleRed","bgSecondary100","bgHighlight","bgTinyHighlight","bgRoleYellow","bgRoleBlue","bgRoleGreen","divider","dividerLite","fixedWhite","fixedBgWhite","fixedBlack"],"mappings":"AAAO,IAAMA,UAAU,GAAG;AACnB,IAAMC,UAAU,GAAG;AACnB,IAAMC,YAAY,GAAG;;AAE5B;AACO,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;AACpB,IAAMC,WAAW,GAAG;;AAE3B;AACO,IAAMC,QAAQ,GAAG;AACjB,IAAMC,eAAe,GAAG;AACxB,IAAMC,iBAAiB,GAAG;;AAEjC;AACO,IAAMC,OAAO,GAAG;AAChB,IAAMC,UAAU,GAAG;AACnB,IAAMC,QAAQ,GAAG;AACjB,IAAMC,SAAS,GAAG;;AAEzB;AACO,IAAMC,KAAK,GAAG;AACd,IAAMC,KAAK,GAAG;AACd,IAAMC,KAAK,GAAG;AACd,IAAMC,UAAU,GAAG;AACnB,IAAMC,UAAU,GAAG;AACnB,IAAMC,SAAS,GAAG;AAClB,IAAMC,cAAc,GAAG;AACvB,IAAMC,WAAW,GAAG;AACpB,IAAMC,eAAe,GAAG;AACxB,IAAMC,YAAY,GAAG;AACrB,IAAMC,UAAU,GAAG;AACnB,IAAMC,WAAW,GAAG;;AAE3B;AACO,IAAMC,OAAO,GAAG;AAChB,IAAMC,WAAW,GAAG;;AAE3B;AACO,IAAMC,UAAU,GAAG;AACnB,IAAMC,YAAY,GAAG;AACrB,IAAMC,UAAU,GAAG;;;;"}
|
package/dist/src/index.cjs.js
CHANGED
|
@@ -32,6 +32,7 @@ exports.disabled = variables.disabled;
|
|
|
32
32
|
exports.disabledRoleRed = variables.disabledRoleRed;
|
|
33
33
|
exports.disabledSecondary = variables.disabledSecondary;
|
|
34
34
|
exports.divider = variables.divider;
|
|
35
|
+
exports.dividerLite = variables.dividerLite;
|
|
35
36
|
exports.fixedBgWhite = variables.fixedBgWhite;
|
|
36
37
|
exports.fixedBlack = variables.fixedBlack;
|
|
37
38
|
exports.fixedWhite = variables.fixedWhite;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/src/index.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { bg100, bg200, bg300, bgHighlight, bgModal100, bgModal200, bgRoleBlue, bgRoleGreen, bgRoleRed, bgRoleYellow, bgSecondary100, bgTinyHighlight, contents000, contents100, contents150, contents200, contents300, contents999, disabled, disabledRoleRed, disabledSecondary, divider, fixedBgWhite, fixedBlack, fixedWhite, primary100, primary200, roleBlue, roleGreen, roleRed, roleYellow, secondary100 } from './colors/variables.esm.js';
|
|
1
|
+
export { bg100, bg200, bg300, bgHighlight, bgModal100, bgModal200, bgRoleBlue, bgRoleGreen, bgRoleRed, bgRoleYellow, bgSecondary100, bgTinyHighlight, contents000, contents100, contents150, contents200, contents300, contents999, disabled, disabledRoleRed, disabledSecondary, divider, dividerLite, fixedBgWhite, fixedBlack, fixedWhite, primary100, primary200, roleBlue, roleGreen, roleRed, roleYellow, secondary100 } from './colors/variables.esm.js';
|
|
2
2
|
export { getBrowserTheme, getColorVariableName, getHexFromRuiCssVariable, getRgb, getRgba, hexToRgb } from './colors/utils.esm.js';
|
|
3
3
|
export { desktopOnly, getDeviceWidthMediaQuery, mobileOnly, phoneOnly } from './mediaQuery/index.esm.js';
|
|
4
4
|
export { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES } from './typography/const.esm.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.cjs.js","sources":["../../../src/mediaQuery/const.ts"],"sourcesContent":["export const DESKTOP_WIDTH = 768;\nexport const PHONE_WIDTH = 430;\n"],"names":["DESKTOP_WIDTH","PHONE_WIDTH"],"mappings":";;AAAO,IAAMA,aAAa,GAAG
|
|
1
|
+
{"version":3,"file":"const.cjs.js","sources":["../../../src/mediaQuery/const.ts"],"sourcesContent":["export const DESKTOP_WIDTH = 768;\nexport const PHONE_WIDTH = 430;\n"],"names":["DESKTOP_WIDTH","PHONE_WIDTH"],"mappings":";;AAAO,IAAMA,aAAa,GAAG;AACtB,IAAMC,WAAW,GAAG;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.esm.js","sources":["../../../src/mediaQuery/const.ts"],"sourcesContent":["export const DESKTOP_WIDTH = 768;\nexport const PHONE_WIDTH = 430;\n"],"names":["DESKTOP_WIDTH","PHONE_WIDTH"],"mappings":"AAAO,IAAMA,aAAa,GAAG
|
|
1
|
+
{"version":3,"file":"const.esm.js","sources":["../../../src/mediaQuery/const.ts"],"sourcesContent":["export const DESKTOP_WIDTH = 768;\nexport const PHONE_WIDTH = 430;\n"],"names":["DESKTOP_WIDTH","PHONE_WIDTH"],"mappings":"AAAO,IAAMA,aAAa,GAAG;AACtB,IAAMC,WAAW,GAAG;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../../src/mediaQuery/index.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\nimport type { CSSProp } from 'styled-components';\n\nimport { DESKTOP_WIDTH, PHONE_WIDTH } from './const';\n\nexport * from './const';\n\nexport function getDeviceWidthMediaQuery({\n maxWidth,\n minWidth,\n}: {\n maxWidth?: number | string;\n minWidth?: number | string;\n}) {\n const mediaQueries: string[] = [];\n\n if (maxWidth) {\n mediaQueries.push(\n `(max-width: ${\n typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`\n })`\n );\n }\n\n if (minWidth) {\n mediaQueries.push(\n `(min-width: ${\n typeof minWidth === 'string' ? minWidth : `${minWidth}px`\n })`\n );\n }\n\n return (cssInterpolation: CSSProp) => css`\n @media ${mediaQueries.join(' and ')} {\n ${cssInterpolation}\n }\n `;\n}\n\nexport const mobileOnly = getDeviceWidthMediaQuery({\n maxWidth: DESKTOP_WIDTH - 1,\n});\nexport const desktopOnly = getDeviceWidthMediaQuery({\n minWidth: DESKTOP_WIDTH,\n});\nexport const phoneOnly = getDeviceWidthMediaQuery({\n maxWidth: PHONE_WIDTH,\n});\n"],"names":["mediaQueries","
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../../src/mediaQuery/index.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\nimport type { CSSProp } from 'styled-components';\n\nimport { DESKTOP_WIDTH, PHONE_WIDTH } from './const';\n\nexport * from './const';\n\nexport function getDeviceWidthMediaQuery({\n maxWidth,\n minWidth,\n}: {\n maxWidth?: number | string;\n minWidth?: number | string;\n}) {\n const mediaQueries: string[] = [];\n\n if (maxWidth) {\n mediaQueries.push(\n `(max-width: ${\n typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`\n })`\n );\n }\n\n if (minWidth) {\n mediaQueries.push(\n `(min-width: ${\n typeof minWidth === 'string' ? minWidth : `${minWidth}px`\n })`\n );\n }\n\n return (cssInterpolation: CSSProp) => css`\n @media ${mediaQueries.join(' and ')} {\n ${cssInterpolation}\n }\n `;\n}\n\nexport const mobileOnly = getDeviceWidthMediaQuery({\n maxWidth: DESKTOP_WIDTH - 1,\n});\nexport const desktopOnly = getDeviceWidthMediaQuery({\n minWidth: DESKTOP_WIDTH,\n});\nexport const phoneOnly = getDeviceWidthMediaQuery({\n maxWidth: PHONE_WIDTH,\n});\n"],"names":["mediaQueries","minWidth","maxWidth"],"mappings":";;;;;;;;;;;AAAa;AASN;AAMJ;;;AAGD;AACEA;AAKF;AAEA;AACEA;AAKF;AAEA;AAAiC;;AAKnC;AAEO;;AAEP;AACO;AACLC;AACF;AACO;AACLC;AACF;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../../../src/mediaQuery/index.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\nimport type { CSSProp } from 'styled-components';\n\nimport { DESKTOP_WIDTH, PHONE_WIDTH } from './const';\n\nexport * from './const';\n\nexport function getDeviceWidthMediaQuery({\n maxWidth,\n minWidth,\n}: {\n maxWidth?: number | string;\n minWidth?: number | string;\n}) {\n const mediaQueries: string[] = [];\n\n if (maxWidth) {\n mediaQueries.push(\n `(max-width: ${\n typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`\n })`\n );\n }\n\n if (minWidth) {\n mediaQueries.push(\n `(min-width: ${\n typeof minWidth === 'string' ? minWidth : `${minWidth}px`\n })`\n );\n }\n\n return (cssInterpolation: CSSProp) => css`\n @media ${mediaQueries.join(' and ')} {\n ${cssInterpolation}\n }\n `;\n}\n\nexport const mobileOnly = getDeviceWidthMediaQuery({\n maxWidth: DESKTOP_WIDTH - 1,\n});\nexport const desktopOnly = getDeviceWidthMediaQuery({\n minWidth: DESKTOP_WIDTH,\n});\nexport const phoneOnly = getDeviceWidthMediaQuery({\n maxWidth: PHONE_WIDTH,\n});\n"],"names":["mediaQueries","
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../../../src/mediaQuery/index.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\nimport type { CSSProp } from 'styled-components';\n\nimport { DESKTOP_WIDTH, PHONE_WIDTH } from './const';\n\nexport * from './const';\n\nexport function getDeviceWidthMediaQuery({\n maxWidth,\n minWidth,\n}: {\n maxWidth?: number | string;\n minWidth?: number | string;\n}) {\n const mediaQueries: string[] = [];\n\n if (maxWidth) {\n mediaQueries.push(\n `(max-width: ${\n typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`\n })`\n );\n }\n\n if (minWidth) {\n mediaQueries.push(\n `(min-width: ${\n typeof minWidth === 'string' ? minWidth : `${minWidth}px`\n })`\n );\n }\n\n return (cssInterpolation: CSSProp) => css`\n @media ${mediaQueries.join(' and ')} {\n ${cssInterpolation}\n }\n `;\n}\n\nexport const mobileOnly = getDeviceWidthMediaQuery({\n maxWidth: DESKTOP_WIDTH - 1,\n});\nexport const desktopOnly = getDeviceWidthMediaQuery({\n minWidth: DESKTOP_WIDTH,\n});\nexport const phoneOnly = getDeviceWidthMediaQuery({\n maxWidth: PHONE_WIDTH,\n});\n"],"names":["mediaQueries","minWidth","maxWidth"],"mappings":";;;;;AAAa;AASN;AAMJ;;;AAGD;AACEA;AAKF;AAEA;AACEA;AAKF;AAEA;AAAiC;;AAKnC;AAEO;;AAEP;AACO;AACLC;AACF;AACO;AACLC;AACF;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { useMemo,
|
|
2
|
+
import { useMemo, createContext, useContext } from 'react';
|
|
3
3
|
import { getBrowserTheme } from '../colors/utils.esm.js';
|
|
4
4
|
import { RUIGlobalStyle } from './styles.esm.js';
|
|
5
5
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
@@ -16,7 +16,7 @@ var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTempla
|
|
|
16
16
|
|
|
17
17
|
var _templateObject;
|
|
18
18
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
19
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t),
|
|
19
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
20
20
|
var RUIGlobalStyle = styledComponents.createGlobalStyle(function (_ref) {
|
|
21
21
|
var customMixins = _ref.customMixins,
|
|
22
22
|
forceTheme = _ref.forceTheme;
|
|
@@ -8,7 +8,7 @@ import { RUI_COLOR_THEME } from '../colors/theme.esm.js';
|
|
|
8
8
|
|
|
9
9
|
var _templateObject;
|
|
10
10
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
11
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t),
|
|
11
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
12
12
|
var RUIGlobalStyle = createGlobalStyle(function (_ref) {
|
|
13
13
|
var customMixins = _ref.customMixins,
|
|
14
14
|
forceTheme = _ref.forceTheme;
|
|
@@ -53,40 +53,80 @@ var TYPOGRAPHY_STYLES = {
|
|
|
53
53
|
lineHeight: 1.45,
|
|
54
54
|
fontWeight: 400
|
|
55
55
|
},
|
|
56
|
+
UIBody1_B: {
|
|
57
|
+
fontSize: 18,
|
|
58
|
+
lineHeight: 1.45,
|
|
59
|
+
fontWeight: 600
|
|
60
|
+
},
|
|
56
61
|
UIBody2: {
|
|
57
62
|
fontSize: 16,
|
|
58
63
|
lineHeight: 1.45,
|
|
59
64
|
fontWeight: 400
|
|
60
65
|
},
|
|
66
|
+
UIBody2_B: {
|
|
67
|
+
fontSize: 16,
|
|
68
|
+
lineHeight: 1.45,
|
|
69
|
+
fontWeight: 600
|
|
70
|
+
},
|
|
61
71
|
UIBody3: {
|
|
62
72
|
fontSize: 14,
|
|
63
73
|
lineHeight: 1.45,
|
|
64
74
|
fontWeight: 400
|
|
65
75
|
},
|
|
76
|
+
UIBody3_B: {
|
|
77
|
+
fontSize: 14,
|
|
78
|
+
lineHeight: 1.45,
|
|
79
|
+
fontWeight: 600
|
|
80
|
+
},
|
|
66
81
|
ArticleBody1: {
|
|
67
82
|
fontSize: 18,
|
|
68
83
|
lineHeight: 1.55,
|
|
69
84
|
fontWeight: 400
|
|
70
85
|
},
|
|
86
|
+
ArticleBody1_B: {
|
|
87
|
+
fontSize: 18,
|
|
88
|
+
lineHeight: 1.55,
|
|
89
|
+
fontWeight: 600
|
|
90
|
+
},
|
|
71
91
|
ArticleBody2: {
|
|
72
92
|
fontSize: 16,
|
|
73
93
|
lineHeight: 1.6,
|
|
74
94
|
fontWeight: 400
|
|
75
95
|
},
|
|
96
|
+
ArticleBody2_B: {
|
|
97
|
+
fontSize: 16,
|
|
98
|
+
lineHeight: 1.6,
|
|
99
|
+
fontWeight: 600
|
|
100
|
+
},
|
|
76
101
|
ArticleBody3: {
|
|
77
102
|
fontSize: 14,
|
|
78
103
|
lineHeight: 1.6,
|
|
79
104
|
fontWeight: 400
|
|
80
105
|
},
|
|
106
|
+
ArticleBody3_B: {
|
|
107
|
+
fontSize: 14,
|
|
108
|
+
lineHeight: 1.6,
|
|
109
|
+
fontWeight: 600
|
|
110
|
+
},
|
|
81
111
|
Caption1: {
|
|
82
112
|
fontSize: 12,
|
|
83
113
|
lineHeight: 1.35,
|
|
84
114
|
fontWeight: 500
|
|
85
115
|
},
|
|
116
|
+
Caption1_B: {
|
|
117
|
+
fontSize: 12,
|
|
118
|
+
lineHeight: 1.35,
|
|
119
|
+
fontWeight: 600
|
|
120
|
+
},
|
|
86
121
|
Caption2: {
|
|
87
122
|
fontSize: 10,
|
|
88
123
|
lineHeight: 1.35,
|
|
89
124
|
fontWeight: 500
|
|
125
|
+
},
|
|
126
|
+
Caption2_B: {
|
|
127
|
+
fontSize: 10,
|
|
128
|
+
lineHeight: 1.35,
|
|
129
|
+
fontWeight: 600
|
|
90
130
|
}
|
|
91
131
|
};
|
|
92
132
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.cjs.js","sources":["../../../src/typography/const.ts"],"sourcesContent":["export const TYPOGRAPHY_STYLES = {\n // Title Style\n DisplayTitle1: {\n fontSize: 48,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle2: {\n fontSize: 40,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle3: {\n fontSize: 32,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n Headline: {\n fontSize: 24,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title1: {\n fontSize: 20,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title2: {\n fontSize: 18,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle1: {\n fontSize: 16,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle2: {\n fontSize: 14,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n DisplayBody: {\n fontSize: 20,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n // Body Style\n UIBody1: {\n fontSize: 18,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody2: {\n fontSize: 16,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody3: {\n fontSize: 14,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n ArticleBody1: {\n fontSize: 18,\n lineHeight: 1.55,\n fontWeight: 400,\n },\n ArticleBody2: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n ArticleBody3: {\n fontSize: 14,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n Caption1: {\n fontSize: 12,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n Caption2: {\n fontSize: 10,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":["TYPOGRAPHY_STYLES","DisplayTitle1","fontSize","lineHeight","fontWeight","DisplayTitle2","DisplayTitle3","Headline","Title1","Title2","SubTitle1","SubTitle2","DisplayBody","UIBody1","UIBody2","UIBody3","ArticleBody1","ArticleBody2","ArticleBody3","Caption1","Caption2","PRETENDARD_FONT_FAMILY"],"mappings":";;AAAO,IAAMA,iBAAiB,GAAG;AAC/B;AACAC,EAAAA,aAAa,EAAE;AACbC,IAAAA,QAAQ,EAAE,EAAE;AACZC,IAAAA,UAAU,EAAE,GAAG;AACfC,IAAAA,UAAU,EAAE
|
|
1
|
+
{"version":3,"file":"const.cjs.js","sources":["../../../src/typography/const.ts"],"sourcesContent":["export const TYPOGRAPHY_STYLES = {\n // Title Style\n DisplayTitle1: {\n fontSize: 48,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle2: {\n fontSize: 40,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle3: {\n fontSize: 32,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n Headline: {\n fontSize: 24,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title1: {\n fontSize: 20,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title2: {\n fontSize: 18,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle1: {\n fontSize: 16,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle2: {\n fontSize: 14,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n DisplayBody: {\n fontSize: 20,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n // Body Style\n UIBody1: {\n fontSize: 18,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody1_B: {\n fontSize: 18,\n lineHeight: 1.45,\n fontWeight: 600,\n },\n UIBody2: {\n fontSize: 16,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody2_B: {\n fontSize: 16,\n lineHeight: 1.45,\n fontWeight: 600,\n },\n UIBody3: {\n fontSize: 14,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody3_B: {\n fontSize: 14,\n lineHeight: 1.45,\n fontWeight: 600,\n },\n ArticleBody1: {\n fontSize: 18,\n lineHeight: 1.55,\n fontWeight: 400,\n },\n ArticleBody1_B: {\n fontSize: 18,\n lineHeight: 1.55,\n fontWeight: 600,\n },\n ArticleBody2: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n ArticleBody2_B: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 600,\n },\n ArticleBody3: {\n fontSize: 14,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n ArticleBody3_B: {\n fontSize: 14,\n lineHeight: 1.6,\n fontWeight: 600,\n },\n Caption1: {\n fontSize: 12,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n Caption1_B: {\n fontSize: 12,\n lineHeight: 1.35,\n fontWeight: 600,\n },\n Caption2: {\n fontSize: 10,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n Caption2_B: {\n fontSize: 10,\n lineHeight: 1.35,\n fontWeight: 600,\n },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":["TYPOGRAPHY_STYLES","DisplayTitle1","fontSize","lineHeight","fontWeight","DisplayTitle2","DisplayTitle3","Headline","Title1","Title2","SubTitle1","SubTitle2","DisplayBody","UIBody1","UIBody1_B","UIBody2","UIBody2_B","UIBody3","UIBody3_B","ArticleBody1","ArticleBody1_B","ArticleBody2","ArticleBody2_B","ArticleBody3","ArticleBody3_B","Caption1","Caption1_B","Caption2","Caption2_B","PRETENDARD_FONT_FAMILY"],"mappings":"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"}
|
|
@@ -49,41 +49,81 @@ export declare const TYPOGRAPHY_STYLES: {
|
|
|
49
49
|
readonly lineHeight: 1.45;
|
|
50
50
|
readonly fontWeight: 400;
|
|
51
51
|
};
|
|
52
|
+
readonly UIBody1_B: {
|
|
53
|
+
readonly fontSize: 18;
|
|
54
|
+
readonly lineHeight: 1.45;
|
|
55
|
+
readonly fontWeight: 600;
|
|
56
|
+
};
|
|
52
57
|
readonly UIBody2: {
|
|
53
58
|
readonly fontSize: 16;
|
|
54
59
|
readonly lineHeight: 1.45;
|
|
55
60
|
readonly fontWeight: 400;
|
|
56
61
|
};
|
|
62
|
+
readonly UIBody2_B: {
|
|
63
|
+
readonly fontSize: 16;
|
|
64
|
+
readonly lineHeight: 1.45;
|
|
65
|
+
readonly fontWeight: 600;
|
|
66
|
+
};
|
|
57
67
|
readonly UIBody3: {
|
|
58
68
|
readonly fontSize: 14;
|
|
59
69
|
readonly lineHeight: 1.45;
|
|
60
70
|
readonly fontWeight: 400;
|
|
61
71
|
};
|
|
72
|
+
readonly UIBody3_B: {
|
|
73
|
+
readonly fontSize: 14;
|
|
74
|
+
readonly lineHeight: 1.45;
|
|
75
|
+
readonly fontWeight: 600;
|
|
76
|
+
};
|
|
62
77
|
readonly ArticleBody1: {
|
|
63
78
|
readonly fontSize: 18;
|
|
64
79
|
readonly lineHeight: 1.55;
|
|
65
80
|
readonly fontWeight: 400;
|
|
66
81
|
};
|
|
82
|
+
readonly ArticleBody1_B: {
|
|
83
|
+
readonly fontSize: 18;
|
|
84
|
+
readonly lineHeight: 1.55;
|
|
85
|
+
readonly fontWeight: 600;
|
|
86
|
+
};
|
|
67
87
|
readonly ArticleBody2: {
|
|
68
88
|
readonly fontSize: 16;
|
|
69
89
|
readonly lineHeight: 1.6;
|
|
70
90
|
readonly fontWeight: 400;
|
|
71
91
|
};
|
|
92
|
+
readonly ArticleBody2_B: {
|
|
93
|
+
readonly fontSize: 16;
|
|
94
|
+
readonly lineHeight: 1.6;
|
|
95
|
+
readonly fontWeight: 600;
|
|
96
|
+
};
|
|
72
97
|
readonly ArticleBody3: {
|
|
73
98
|
readonly fontSize: 14;
|
|
74
99
|
readonly lineHeight: 1.6;
|
|
75
100
|
readonly fontWeight: 400;
|
|
76
101
|
};
|
|
102
|
+
readonly ArticleBody3_B: {
|
|
103
|
+
readonly fontSize: 14;
|
|
104
|
+
readonly lineHeight: 1.6;
|
|
105
|
+
readonly fontWeight: 600;
|
|
106
|
+
};
|
|
77
107
|
readonly Caption1: {
|
|
78
108
|
readonly fontSize: 12;
|
|
79
109
|
readonly lineHeight: 1.35;
|
|
80
110
|
readonly fontWeight: 500;
|
|
81
111
|
};
|
|
112
|
+
readonly Caption1_B: {
|
|
113
|
+
readonly fontSize: 12;
|
|
114
|
+
readonly lineHeight: 1.35;
|
|
115
|
+
readonly fontWeight: 600;
|
|
116
|
+
};
|
|
82
117
|
readonly Caption2: {
|
|
83
118
|
readonly fontSize: 10;
|
|
84
119
|
readonly lineHeight: 1.35;
|
|
85
120
|
readonly fontWeight: 500;
|
|
86
121
|
};
|
|
122
|
+
readonly Caption2_B: {
|
|
123
|
+
readonly fontSize: 10;
|
|
124
|
+
readonly lineHeight: 1.35;
|
|
125
|
+
readonly fontWeight: 600;
|
|
126
|
+
};
|
|
87
127
|
};
|
|
88
128
|
/**
|
|
89
129
|
* {@link https://github.com/orioncactus/pretendard#html-1}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../src/typography/const.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB
|
|
1
|
+
{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../src/typography/const.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgIpB,CAAC;AAEX;;GAEG;AACH,eAAO,MAAM,sBAAsB,iOAC6L,CAAC"}
|
|
@@ -51,40 +51,80 @@ var TYPOGRAPHY_STYLES = {
|
|
|
51
51
|
lineHeight: 1.45,
|
|
52
52
|
fontWeight: 400
|
|
53
53
|
},
|
|
54
|
+
UIBody1_B: {
|
|
55
|
+
fontSize: 18,
|
|
56
|
+
lineHeight: 1.45,
|
|
57
|
+
fontWeight: 600
|
|
58
|
+
},
|
|
54
59
|
UIBody2: {
|
|
55
60
|
fontSize: 16,
|
|
56
61
|
lineHeight: 1.45,
|
|
57
62
|
fontWeight: 400
|
|
58
63
|
},
|
|
64
|
+
UIBody2_B: {
|
|
65
|
+
fontSize: 16,
|
|
66
|
+
lineHeight: 1.45,
|
|
67
|
+
fontWeight: 600
|
|
68
|
+
},
|
|
59
69
|
UIBody3: {
|
|
60
70
|
fontSize: 14,
|
|
61
71
|
lineHeight: 1.45,
|
|
62
72
|
fontWeight: 400
|
|
63
73
|
},
|
|
74
|
+
UIBody3_B: {
|
|
75
|
+
fontSize: 14,
|
|
76
|
+
lineHeight: 1.45,
|
|
77
|
+
fontWeight: 600
|
|
78
|
+
},
|
|
64
79
|
ArticleBody1: {
|
|
65
80
|
fontSize: 18,
|
|
66
81
|
lineHeight: 1.55,
|
|
67
82
|
fontWeight: 400
|
|
68
83
|
},
|
|
84
|
+
ArticleBody1_B: {
|
|
85
|
+
fontSize: 18,
|
|
86
|
+
lineHeight: 1.55,
|
|
87
|
+
fontWeight: 600
|
|
88
|
+
},
|
|
69
89
|
ArticleBody2: {
|
|
70
90
|
fontSize: 16,
|
|
71
91
|
lineHeight: 1.6,
|
|
72
92
|
fontWeight: 400
|
|
73
93
|
},
|
|
94
|
+
ArticleBody2_B: {
|
|
95
|
+
fontSize: 16,
|
|
96
|
+
lineHeight: 1.6,
|
|
97
|
+
fontWeight: 600
|
|
98
|
+
},
|
|
74
99
|
ArticleBody3: {
|
|
75
100
|
fontSize: 14,
|
|
76
101
|
lineHeight: 1.6,
|
|
77
102
|
fontWeight: 400
|
|
78
103
|
},
|
|
104
|
+
ArticleBody3_B: {
|
|
105
|
+
fontSize: 14,
|
|
106
|
+
lineHeight: 1.6,
|
|
107
|
+
fontWeight: 600
|
|
108
|
+
},
|
|
79
109
|
Caption1: {
|
|
80
110
|
fontSize: 12,
|
|
81
111
|
lineHeight: 1.35,
|
|
82
112
|
fontWeight: 500
|
|
83
113
|
},
|
|
114
|
+
Caption1_B: {
|
|
115
|
+
fontSize: 12,
|
|
116
|
+
lineHeight: 1.35,
|
|
117
|
+
fontWeight: 600
|
|
118
|
+
},
|
|
84
119
|
Caption2: {
|
|
85
120
|
fontSize: 10,
|
|
86
121
|
lineHeight: 1.35,
|
|
87
122
|
fontWeight: 500
|
|
123
|
+
},
|
|
124
|
+
Caption2_B: {
|
|
125
|
+
fontSize: 10,
|
|
126
|
+
lineHeight: 1.35,
|
|
127
|
+
fontWeight: 600
|
|
88
128
|
}
|
|
89
129
|
};
|
|
90
130
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.esm.js","sources":["../../../src/typography/const.ts"],"sourcesContent":["export const TYPOGRAPHY_STYLES = {\n // Title Style\n DisplayTitle1: {\n fontSize: 48,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle2: {\n fontSize: 40,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle3: {\n fontSize: 32,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n Headline: {\n fontSize: 24,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title1: {\n fontSize: 20,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title2: {\n fontSize: 18,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle1: {\n fontSize: 16,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle2: {\n fontSize: 14,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n DisplayBody: {\n fontSize: 20,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n // Body Style\n UIBody1: {\n fontSize: 18,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody2: {\n fontSize: 16,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody3: {\n fontSize: 14,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n ArticleBody1: {\n fontSize: 18,\n lineHeight: 1.55,\n fontWeight: 400,\n },\n ArticleBody2: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n ArticleBody3: {\n fontSize: 14,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n Caption1: {\n fontSize: 12,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n Caption2: {\n fontSize: 10,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":["TYPOGRAPHY_STYLES","DisplayTitle1","fontSize","lineHeight","fontWeight","DisplayTitle2","DisplayTitle3","Headline","Title1","Title2","SubTitle1","SubTitle2","DisplayBody","UIBody1","UIBody2","UIBody3","ArticleBody1","ArticleBody2","ArticleBody3","Caption1","Caption2","PRETENDARD_FONT_FAMILY"],"mappings":"AAAO,IAAMA,iBAAiB,GAAG;AAC/B;AACAC,EAAAA,aAAa,EAAE;AACbC,IAAAA,QAAQ,EAAE,EAAE;AACZC,IAAAA,UAAU,EAAE,GAAG;AACfC,IAAAA,UAAU,EAAE
|
|
1
|
+
{"version":3,"file":"const.esm.js","sources":["../../../src/typography/const.ts"],"sourcesContent":["export const TYPOGRAPHY_STYLES = {\n // Title Style\n DisplayTitle1: {\n fontSize: 48,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle2: {\n fontSize: 40,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n DisplayTitle3: {\n fontSize: 32,\n lineHeight: 1.3,\n fontWeight: 700,\n },\n Headline: {\n fontSize: 24,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title1: {\n fontSize: 20,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n Title2: {\n fontSize: 18,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle1: {\n fontSize: 16,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n SubTitle2: {\n fontSize: 14,\n lineHeight: 1.3,\n fontWeight: 600,\n },\n DisplayBody: {\n fontSize: 20,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n // Body Style\n UIBody1: {\n fontSize: 18,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody1_B: {\n fontSize: 18,\n lineHeight: 1.45,\n fontWeight: 600,\n },\n UIBody2: {\n fontSize: 16,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody2_B: {\n fontSize: 16,\n lineHeight: 1.45,\n fontWeight: 600,\n },\n UIBody3: {\n fontSize: 14,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n UIBody3_B: {\n fontSize: 14,\n lineHeight: 1.45,\n fontWeight: 600,\n },\n ArticleBody1: {\n fontSize: 18,\n lineHeight: 1.55,\n fontWeight: 400,\n },\n ArticleBody1_B: {\n fontSize: 18,\n lineHeight: 1.55,\n fontWeight: 600,\n },\n ArticleBody2: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n ArticleBody2_B: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 600,\n },\n ArticleBody3: {\n fontSize: 14,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n ArticleBody3_B: {\n fontSize: 14,\n lineHeight: 1.6,\n fontWeight: 600,\n },\n Caption1: {\n fontSize: 12,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n Caption1_B: {\n fontSize: 12,\n lineHeight: 1.35,\n fontWeight: 600,\n },\n Caption2: {\n fontSize: 10,\n lineHeight: 1.35,\n fontWeight: 500,\n },\n Caption2_B: {\n fontSize: 10,\n lineHeight: 1.35,\n fontWeight: 600,\n },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":["TYPOGRAPHY_STYLES","DisplayTitle1","fontSize","lineHeight","fontWeight","DisplayTitle2","DisplayTitle3","Headline","Title1","Title2","SubTitle1","SubTitle2","DisplayBody","UIBody1","UIBody1_B","UIBody2","UIBody2_B","UIBody3","UIBody3_B","ArticleBody1","ArticleBody1_B","ArticleBody2","ArticleBody2_B","ArticleBody3","ArticleBody3_B","Caption1","Caption1_B","Caption2","Caption2_B","PRETENDARD_FONT_FAMILY"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remember-web/mixin",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Remember Web Mixins",
|
|
5
5
|
"homepage": "https://dramancompany.github.io/remember-web-packages/",
|
|
6
6
|
"author": "Remember",
|
|
@@ -44,10 +44,10 @@
|
|
|
44
44
|
"@babel/preset-react": "^7.24.1",
|
|
45
45
|
"@babel/preset-typescript": "^7.24.1",
|
|
46
46
|
"@rollup/plugin-babel": "^6.0.4",
|
|
47
|
-
"@rollup/plugin-commonjs": "^
|
|
48
|
-
"@rollup/plugin-node-resolve": "^
|
|
47
|
+
"@rollup/plugin-commonjs": "^28.0.6",
|
|
48
|
+
"@rollup/plugin-node-resolve": "^16.0.1",
|
|
49
49
|
"react": "^18.2.0",
|
|
50
|
-
"rollup": "^4.
|
|
50
|
+
"rollup": "^4.44.1",
|
|
51
51
|
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
52
52
|
"rollup-plugin-preserve-directives": "^0.4.0",
|
|
53
53
|
"rollup-plugin-typescript2": "^0.36.0",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useRUI } from '@remember-web/mixin';
|
|
2
2
|
import { Grid, Typography } from '@remember-web/primitive';
|
|
3
|
-
import type { Meta } from '@storybook/react';
|
|
3
|
+
import type { Meta } from '@storybook/react-vite';
|
|
4
4
|
|
|
5
5
|
import type { RUIColorVariable, ThemeType } from './types';
|
|
6
6
|
import { getHexFromRuiCssVariable, getRgba } from './utils';
|
package/src/colors/theme.ts
CHANGED
|
@@ -34,6 +34,7 @@ export const RUI_COLOR_THEME: RUIColorThemeType = {
|
|
|
34
34
|
'--rui-bg-role-blue': '#EDF4FF',
|
|
35
35
|
'--rui-bg-role-green': '#D9FCF2',
|
|
36
36
|
'--rui-divider': '#D4D4D4',
|
|
37
|
+
'--rui-divider-lite': '#EBEBEB',
|
|
37
38
|
'--rui-fixed-white': '#FFFFFF',
|
|
38
39
|
'--rui-fixed-black': '#000000',
|
|
39
40
|
'--rui-fixed-bg-white': '#FFFFFF',
|
|
@@ -68,6 +69,7 @@ export const RUI_COLOR_THEME: RUIColorThemeType = {
|
|
|
68
69
|
'--rui-bg-role-blue': '#002861',
|
|
69
70
|
'--rui-bg-role-green': '#15382E',
|
|
70
71
|
'--rui-divider': '#424242',
|
|
72
|
+
'--rui-divider-lite': '#2E2E2E',
|
|
71
73
|
'--rui-fixed-white': '#FFFFFF',
|
|
72
74
|
'--rui-fixed-black': '#000000',
|
|
73
75
|
'--rui-fixed-bg-white': '#FFFFFF',
|
package/src/colors/variables.ts
CHANGED
package/src/typography/const.ts
CHANGED
|
@@ -51,41 +51,81 @@ export const TYPOGRAPHY_STYLES = {
|
|
|
51
51
|
lineHeight: 1.45,
|
|
52
52
|
fontWeight: 400,
|
|
53
53
|
},
|
|
54
|
+
UIBody1_B: {
|
|
55
|
+
fontSize: 18,
|
|
56
|
+
lineHeight: 1.45,
|
|
57
|
+
fontWeight: 600,
|
|
58
|
+
},
|
|
54
59
|
UIBody2: {
|
|
55
60
|
fontSize: 16,
|
|
56
61
|
lineHeight: 1.45,
|
|
57
62
|
fontWeight: 400,
|
|
58
63
|
},
|
|
64
|
+
UIBody2_B: {
|
|
65
|
+
fontSize: 16,
|
|
66
|
+
lineHeight: 1.45,
|
|
67
|
+
fontWeight: 600,
|
|
68
|
+
},
|
|
59
69
|
UIBody3: {
|
|
60
70
|
fontSize: 14,
|
|
61
71
|
lineHeight: 1.45,
|
|
62
72
|
fontWeight: 400,
|
|
63
73
|
},
|
|
74
|
+
UIBody3_B: {
|
|
75
|
+
fontSize: 14,
|
|
76
|
+
lineHeight: 1.45,
|
|
77
|
+
fontWeight: 600,
|
|
78
|
+
},
|
|
64
79
|
ArticleBody1: {
|
|
65
80
|
fontSize: 18,
|
|
66
81
|
lineHeight: 1.55,
|
|
67
82
|
fontWeight: 400,
|
|
68
83
|
},
|
|
84
|
+
ArticleBody1_B: {
|
|
85
|
+
fontSize: 18,
|
|
86
|
+
lineHeight: 1.55,
|
|
87
|
+
fontWeight: 600,
|
|
88
|
+
},
|
|
69
89
|
ArticleBody2: {
|
|
70
90
|
fontSize: 16,
|
|
71
91
|
lineHeight: 1.6,
|
|
72
92
|
fontWeight: 400,
|
|
73
93
|
},
|
|
94
|
+
ArticleBody2_B: {
|
|
95
|
+
fontSize: 16,
|
|
96
|
+
lineHeight: 1.6,
|
|
97
|
+
fontWeight: 600,
|
|
98
|
+
},
|
|
74
99
|
ArticleBody3: {
|
|
75
100
|
fontSize: 14,
|
|
76
101
|
lineHeight: 1.6,
|
|
77
102
|
fontWeight: 400,
|
|
78
103
|
},
|
|
104
|
+
ArticleBody3_B: {
|
|
105
|
+
fontSize: 14,
|
|
106
|
+
lineHeight: 1.6,
|
|
107
|
+
fontWeight: 600,
|
|
108
|
+
},
|
|
79
109
|
Caption1: {
|
|
80
110
|
fontSize: 12,
|
|
81
111
|
lineHeight: 1.35,
|
|
82
112
|
fontWeight: 500,
|
|
83
113
|
},
|
|
114
|
+
Caption1_B: {
|
|
115
|
+
fontSize: 12,
|
|
116
|
+
lineHeight: 1.35,
|
|
117
|
+
fontWeight: 600,
|
|
118
|
+
},
|
|
84
119
|
Caption2: {
|
|
85
120
|
fontSize: 10,
|
|
86
121
|
lineHeight: 1.35,
|
|
87
122
|
fontWeight: 500,
|
|
88
123
|
},
|
|
124
|
+
Caption2_B: {
|
|
125
|
+
fontSize: 10,
|
|
126
|
+
lineHeight: 1.35,
|
|
127
|
+
fontWeight: 600,
|
|
128
|
+
},
|
|
89
129
|
} as const;
|
|
90
130
|
|
|
91
131
|
/**
|