Merge branch 'front-global-style'

# Conflicts:
#	.pnp.cjs
#	package.json
#	pages/index.tsx
#	pages/verification/index.tsx
#	yarn.lock
This commit is contained in:
HeesungB 2022-12-07 18:27:51 +09:00
commit bc9535d638
62 changed files with 1804 additions and 202 deletions

414
.pnp.cjs generated
View File

@ -33,6 +33,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
["@types/node", "npm:18.11.9"],\
["@types/react", "npm:18.0.25"],\
["@types/react-dom", "npm:18.0.9"],\
["@types/styled-components", "npm:5.1.26"],\
["@typescript-eslint/eslint-plugin", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.45.0"],\
["@typescript-eslint/parser", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.45.0"],\
["crypto", "npm:1.0.1"],\
@ -51,6 +52,8 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
["prettier", "npm:2.8.0"],\
["react", "npm:18.2.0"],\
["react-dom", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:18.2.0"],\
["react-is", "npm:18.2.0"],\
["styled-components", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.3.6"],\
["typescript", "patch:typescript@npm%3A4.9.3#~builtin<compat/typescript>::version=4.9.3&hash=d73830"]\
],\
"linkType": "SOFT"\
@ -66,6 +69,87 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["@babel/generator", [\
["npm:7.20.5", {\
"packageLocation": "./.yarn/cache/@babel-generator-npm-7.20.5-d08ff0a892-31c10d1e12.zip/node_modules/@babel/generator/",\
"packageDependencies": [\
["@babel/generator", "npm:7.20.5"],\
["@babel/types", "npm:7.20.5"],\
["@jridgewell/gen-mapping", "npm:0.3.2"],\
["jsesc", "npm:2.5.2"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-annotate-as-pure", [\
["npm:7.18.6", {\
"packageLocation": "./.yarn/cache/@babel-helper-annotate-as-pure-npm-7.18.6-36e25293d8-88ccd15ced.zip/node_modules/@babel/helper-annotate-as-pure/",\
"packageDependencies": [\
["@babel/helper-annotate-as-pure", "npm:7.18.6"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-environment-visitor", [\
["npm:7.18.9", {\
"packageLocation": "./.yarn/cache/@babel-helper-environment-visitor-npm-7.18.9-9f5b3635a1-b25101f616.zip/node_modules/@babel/helper-environment-visitor/",\
"packageDependencies": [\
["@babel/helper-environment-visitor", "npm:7.18.9"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-function-name", [\
["npm:7.19.0", {\
"packageLocation": "./.yarn/cache/@babel-helper-function-name-npm-7.19.0-5bcf55236f-eac1f5db42.zip/node_modules/@babel/helper-function-name/",\
"packageDependencies": [\
["@babel/helper-function-name", "npm:7.19.0"],\
["@babel/template", "npm:7.18.10"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-hoist-variables", [\
["npm:7.18.6", {\
"packageLocation": "./.yarn/cache/@babel-helper-hoist-variables-npm-7.18.6-6eb061f405-fd9c35bb43.zip/node_modules/@babel/helper-hoist-variables/",\
"packageDependencies": [\
["@babel/helper-hoist-variables", "npm:7.18.6"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-module-imports", [\
["npm:7.18.6", {\
"packageLocation": "./.yarn/cache/@babel-helper-module-imports-npm-7.18.6-1031faa864-f393f8a3b3.zip/node_modules/@babel/helper-module-imports/",\
"packageDependencies": [\
["@babel/helper-module-imports", "npm:7.18.6"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-split-export-declaration", [\
["npm:7.18.6", {\
"packageLocation": "./.yarn/cache/@babel-helper-split-export-declaration-npm-7.18.6-53ebf8ad4c-c6d3dede53.zip/node_modules/@babel/helper-split-export-declaration/",\
"packageDependencies": [\
["@babel/helper-split-export-declaration", "npm:7.18.6"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-string-parser", [\
["npm:7.19.4", {\
"packageLocation": "./.yarn/cache/@babel-helper-string-parser-npm-7.19.4-0db110dc3a-b2f8a3920b.zip/node_modules/@babel/helper-string-parser/",\
"packageDependencies": [\
["@babel/helper-string-parser", "npm:7.19.4"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/helper-validator-identifier", [\
["npm:7.19.1", {\
"packageLocation": "./.yarn/cache/@babel-helper-validator-identifier-npm-7.19.1-d84f19e1dc-0eca5e86a7.zip/node_modules/@babel/helper-validator-identifier/",\
@ -87,6 +171,16 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["@babel/parser", [\
["npm:7.20.5", {\
"packageLocation": "./.yarn/cache/@babel-parser-npm-7.20.5-2b25154357-e8d514ce0a.zip/node_modules/@babel/parser/",\
"packageDependencies": [\
["@babel/parser", "npm:7.20.5"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/runtime", [\
["npm:7.20.6", {\
"packageLocation": "./.yarn/cache/@babel-runtime-npm-7.20.6-ef7cda3b78-42a8504db2.zip/node_modules/@babel/runtime/",\
@ -108,6 +202,86 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["@babel/template", [\
["npm:7.18.10", {\
"packageLocation": "./.yarn/cache/@babel-template-npm-7.18.10-b6d6fdbaf8-93a6aa094a.zip/node_modules/@babel/template/",\
"packageDependencies": [\
["@babel/template", "npm:7.18.10"],\
["@babel/code-frame", "npm:7.18.6"],\
["@babel/parser", "npm:7.20.5"],\
["@babel/types", "npm:7.20.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/traverse", [\
["npm:7.20.5", {\
"packageLocation": "./.yarn/cache/@babel-traverse-npm-7.20.5-dc0e9498d7-c7fed46861.zip/node_modules/@babel/traverse/",\
"packageDependencies": [\
["@babel/traverse", "npm:7.20.5"],\
["@babel/code-frame", "npm:7.18.6"],\
["@babel/generator", "npm:7.20.5"],\
["@babel/helper-environment-visitor", "npm:7.18.9"],\
["@babel/helper-function-name", "npm:7.19.0"],\
["@babel/helper-hoist-variables", "npm:7.18.6"],\
["@babel/helper-split-export-declaration", "npm:7.18.6"],\
["@babel/parser", "npm:7.20.5"],\
["@babel/types", "npm:7.20.5"],\
["debug", "virtual:9e3a462140b35a19ddb3d48ebde58d66740d97f4c0386bc195c327fc2c44fa59f43cbcb382dd9f194b16d0dd6c0a138aadd4a9de84088f88e25946598f97cb88#npm:4.3.4"],\
["globals", "npm:11.12.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["@babel/types", [\
["npm:7.20.5", {\
"packageLocation": "./.yarn/cache/@babel-types-npm-7.20.5-3ee242b980-773f0a1ad9.zip/node_modules/@babel/types/",\
"packageDependencies": [\
["@babel/types", "npm:7.20.5"],\
["@babel/helper-string-parser", "npm:7.19.4"],\
["@babel/helper-validator-identifier", "npm:7.19.1"],\
["to-fast-properties", "npm:2.0.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["@emotion/is-prop-valid", [\
["npm:1.2.0", {\
"packageLocation": "./.yarn/cache/@emotion-is-prop-valid-npm-1.2.0-332d343e3d-cc7a19850a.zip/node_modules/@emotion/is-prop-valid/",\
"packageDependencies": [\
["@emotion/is-prop-valid", "npm:1.2.0"],\
["@emotion/memoize", "npm:0.8.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["@emotion/memoize", [\
["npm:0.8.0", {\
"packageLocation": "./.yarn/cache/@emotion-memoize-npm-0.8.0-c5dd451828-c87bb110b8.zip/node_modules/@emotion/memoize/",\
"packageDependencies": [\
["@emotion/memoize", "npm:0.8.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["@emotion/stylis", [\
["npm:0.8.5", {\
"packageLocation": "./.yarn/cache/@emotion-stylis-npm-0.8.5-3e9db8959f-67ff595844.zip/node_modules/@emotion/stylis/",\
"packageDependencies": [\
["@emotion/stylis", "npm:0.8.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@emotion/unitless", [\
["npm:0.7.5", {\
"packageLocation": "./.yarn/cache/@emotion-unitless-npm-0.7.5-14e1171640-f976e5345b.zip/node_modules/@emotion/unitless/",\
"packageDependencies": [\
["@emotion/unitless", "npm:0.7.5"]\
],\
"linkType": "HARD"\
}]\
]],\
["@eslint-community/eslint-utils", [\
["npm:4.1.2", {\
"packageLocation": "./.yarn/cache/@eslint-community-eslint-utils-npm-4.1.2-c61919fe72-de817fbb30.zip/node_modules/@eslint-community/eslint-utils/",\
@ -179,6 +353,56 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["@jridgewell/gen-mapping", [\
["npm:0.3.2", {\
"packageLocation": "./.yarn/cache/@jridgewell-gen-mapping-npm-0.3.2-c64eeb4a4e-1832707a1c.zip/node_modules/@jridgewell/gen-mapping/",\
"packageDependencies": [\
["@jridgewell/gen-mapping", "npm:0.3.2"],\
["@jridgewell/set-array", "npm:1.1.2"],\
["@jridgewell/sourcemap-codec", "npm:1.4.14"],\
["@jridgewell/trace-mapping", "npm:0.3.17"]\
],\
"linkType": "HARD"\
}]\
]],\
["@jridgewell/resolve-uri", [\
["npm:3.1.0", {\
"packageLocation": "./.yarn/cache/@jridgewell-resolve-uri-npm-3.1.0-6ff2351e61-b5ceaaf9a1.zip/node_modules/@jridgewell/resolve-uri/",\
"packageDependencies": [\
["@jridgewell/resolve-uri", "npm:3.1.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["@jridgewell/set-array", [\
["npm:1.1.2", {\
"packageLocation": "./.yarn/cache/@jridgewell-set-array-npm-1.1.2-45b82d7fb6-69a84d5980.zip/node_modules/@jridgewell/set-array/",\
"packageDependencies": [\
["@jridgewell/set-array", "npm:1.1.2"]\
],\
"linkType": "HARD"\
}]\
]],\
["@jridgewell/sourcemap-codec", [\
["npm:1.4.14", {\
"packageLocation": "./.yarn/cache/@jridgewell-sourcemap-codec-npm-1.4.14-f5f0630788-61100637b6.zip/node_modules/@jridgewell/sourcemap-codec/",\
"packageDependencies": [\
["@jridgewell/sourcemap-codec", "npm:1.4.14"]\
],\
"linkType": "HARD"\
}]\
]],\
["@jridgewell/trace-mapping", [\
["npm:0.3.17", {\
"packageLocation": "./.yarn/cache/@jridgewell-trace-mapping-npm-0.3.17-57578fd48c-9d703b859c.zip/node_modules/@jridgewell/trace-mapping/",\
"packageDependencies": [\
["@jridgewell/trace-mapping", "npm:0.3.17"],\
["@jridgewell/resolve-uri", "npm:3.1.0"],\
["@jridgewell/sourcemap-codec", "npm:1.4.14"]\
],\
"linkType": "HARD"\
}]\
]],\
["@next/env", [\
["npm:13.0.5", {\
"packageLocation": "./.yarn/cache/@next-env-npm-13.0.5-14b8560c78-cd005b171d.zip/node_modules/@next/env/",\
@ -534,6 +758,17 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["@types/hoist-non-react-statics", [\
["npm:3.3.1", {\
"packageLocation": "./.yarn/cache/@types-hoist-non-react-statics-npm-3.3.1-c0081332b2-2c0778570d.zip/node_modules/@types/hoist-non-react-statics/",\
"packageDependencies": [\
["@types/hoist-non-react-statics", "npm:3.3.1"],\
["@types/react", "npm:18.0.25"],\
["hoist-non-react-statics", "npm:3.3.2"]\
],\
"linkType": "HARD"\
}]\
]],\
["@types/http-assert", [\
["npm:1.5.3", {\
"packageLocation": "./.yarn/cache/@types-http-assert-npm-1.5.3-d45bf58309-9553e5a0b8.zip/node_modules/@types/http-assert/",\
@ -727,6 +962,18 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["@types/styled-components", [\
["npm:5.1.26", {\
"packageLocation": "./.yarn/cache/@types-styled-components-npm-5.1.26-aabda06611-84f53b3101.zip/node_modules/@types/styled-components/",\
"packageDependencies": [\
["@types/styled-components", "npm:5.1.26"],\
["@types/hoist-non-react-statics", "npm:3.3.1"],\
["@types/react", "npm:18.0.25"],\
["csstype", "npm:3.1.1"]\
],\
"linkType": "HARD"\
}]\
]],\
["@typescript-eslint/eslint-plugin", [\
["npm:5.45.0", {\
"packageLocation": "./.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.45.0-af83fa2940-7cff671a9b.zip/node_modules/@typescript-eslint/eslint-plugin/",\
@ -1129,6 +1376,42 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["babel-plugin-styled-components", [\
["npm:2.0.7", {\
"packageLocation": "./.yarn/cache/babel-plugin-styled-components-npm-2.0.7-543710bd48-80b06b10db.zip/node_modules/babel-plugin-styled-components/",\
"packageDependencies": [\
["babel-plugin-styled-components", "npm:2.0.7"]\
],\
"linkType": "SOFT"\
}],\
["virtual:dbf927b4029739772892cc406ac355bda5c8889561173a36c3439102b500f2922c13575cac3aa3f592bb4996c6bbc9c8d25bb77e1c160ef8eb0fba440569339b#npm:2.0.7", {\
"packageLocation": "./.yarn/__virtual__/babel-plugin-styled-components-virtual-7e29990af2/0/cache/babel-plugin-styled-components-npm-2.0.7-543710bd48-80b06b10db.zip/node_modules/babel-plugin-styled-components/",\
"packageDependencies": [\
["babel-plugin-styled-components", "virtual:dbf927b4029739772892cc406ac355bda5c8889561173a36c3439102b500f2922c13575cac3aa3f592bb4996c6bbc9c8d25bb77e1c160ef8eb0fba440569339b#npm:2.0.7"],\
["@babel/helper-annotate-as-pure", "npm:7.18.6"],\
["@babel/helper-module-imports", "npm:7.18.6"],\
["@types/styled-components", null],\
["babel-plugin-syntax-jsx", "npm:6.18.0"],\
["lodash", "npm:4.17.21"],\
["picomatch", "npm:2.3.1"],\
["styled-components", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.3.6"]\
],\
"packagePeers": [\
"@types/styled-components",\
"styled-components"\
],\
"linkType": "HARD"\
}]\
]],\
["babel-plugin-syntax-jsx", [\
["npm:6.18.0", {\
"packageLocation": "./.yarn/cache/babel-plugin-syntax-jsx-npm-6.18.0-fcf0a98a71-0c7ce5b81d.zip/node_modules/babel-plugin-syntax-jsx/",\
"packageDependencies": [\
["babel-plugin-syntax-jsx", "npm:6.18.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["balanced-match", [\
["npm:1.0.2", {\
"packageLocation": "./.yarn/cache/balanced-match-npm-1.0.2-a53c126459-9706c088a2.zip/node_modules/balanced-match/",\
@ -1208,6 +1491,15 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["camelize", [\
["npm:1.0.1", {\
"packageLocation": "./.yarn/cache/camelize-npm-1.0.1-d86ebe085a-91d8611d09.zip/node_modules/camelize/",\
"packageDependencies": [\
["camelize", "npm:1.0.1"]\
],\
"linkType": "HARD"\
}]\
]],\
["caniuse-lite", [\
["npm:1.0.30001435", {\
"packageLocation": "./.yarn/cache/caniuse-lite-npm-1.0.30001435-7cebb35f0a-ec88b9c37f.zip/node_modules/caniuse-lite/",\
@ -1357,6 +1649,27 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["css-color-keywords", [\
["npm:1.0.0", {\
"packageLocation": "./.yarn/cache/css-color-keywords-npm-1.0.0-fc176df58b-8f125e3ad4.zip/node_modules/css-color-keywords/",\
"packageDependencies": [\
["css-color-keywords", "npm:1.0.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["css-to-react-native", [\
["npm:3.0.0", {\
"packageLocation": "./.yarn/cache/css-to-react-native-npm-3.0.0-ab07d67d74-98a2e9d4fb.zip/node_modules/css-to-react-native/",\
"packageDependencies": [\
["css-to-react-native", "npm:3.0.0"],\
["camelize", "npm:1.0.1"],\
["css-color-keywords", "npm:1.0.0"],\
["postcss-value-parser", "npm:4.2.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["csstype", [\
["npm:3.1.1", {\
"packageLocation": "./.yarn/cache/csstype-npm-3.1.1-3857baf48b-1f7b4f5fdd.zip/node_modules/csstype/",\
@ -2423,6 +2736,13 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
}]\
]],\
["globals", [\
["npm:11.12.0", {\
"packageLocation": "./.yarn/cache/globals-npm-11.12.0-1fa7f41a6c-67051a45ec.zip/node_modules/globals/",\
"packageDependencies": [\
["globals", "npm:11.12.0"]\
],\
"linkType": "HARD"\
}],\
["npm:13.18.0", {\
"packageLocation": "./.yarn/cache/globals-npm-13.18.0-0272e9ed61-9fdaa74cfd.zip/node_modules/globals/",\
"packageDependencies": [\
@ -2574,6 +2894,16 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["hoist-non-react-statics", [\
["npm:3.3.2", {\
"packageLocation": "./.yarn/cache/hoist-non-react-statics-npm-3.3.2-e7b709e6c1-b153827042.zip/node_modules/hoist-non-react-statics/",\
"packageDependencies": [\
["hoist-non-react-statics", "npm:3.3.2"],\
["react-is", "npm:16.13.1"]\
],\
"linkType": "HARD"\
}]\
]],\
["hosted-git-info", [\
["npm:2.8.9", {\
"packageLocation": "./.yarn/cache/hosted-git-info-npm-2.8.9-62c44fa93f-c955394bda.zip/node_modules/hosted-git-info/",\
@ -2593,6 +2923,7 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
["@types/node", "npm:18.11.9"],\
["@types/react", "npm:18.0.25"],\
["@types/react-dom", "npm:18.0.9"],\
["@types/styled-components", "npm:5.1.26"],\
["@typescript-eslint/eslint-plugin", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.45.0"],\
["@typescript-eslint/parser", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.45.0"],\
["crypto", "npm:1.0.1"],\
@ -2611,6 +2942,8 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
["prettier", "npm:2.8.0"],\
["react", "npm:18.2.0"],\
["react-dom", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:18.2.0"],\
["react-is", "npm:18.2.0"],\
["styled-components", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.3.6"],\
["typescript", "patch:typescript@npm%3A4.9.3#~builtin<compat/typescript>::version=4.9.3&hash=d73830"]\
],\
"linkType": "SOFT"\
@ -3006,6 +3339,13 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
],\
"linkType": "HARD"\
}],\
["npm:2.5.2", {\
"packageLocation": "./.yarn/cache/jsesc-npm-2.5.2-c5acb78804-4dc1907711.zip/node_modules/jsesc/",\
"packageDependencies": [\
["jsesc", "npm:2.5.2"]\
],\
"linkType": "HARD"\
}],\
["npm:3.0.2", {\
"packageLocation": "./.yarn/cache/jsesc-npm-3.0.2-3b3b74ec0d-a36d3ca405.zip/node_modules/jsesc/",\
"packageDependencies": [\
@ -3632,6 +3972,15 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["postcss-value-parser", [\
["npm:4.2.0", {\
"packageLocation": "./.yarn/cache/postcss-value-parser-npm-4.2.0-3cef602a6a-819ffab0c9.zip/node_modules/postcss-value-parser/",\
"packageDependencies": [\
["postcss-value-parser", "npm:4.2.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["prelude-ls", [\
["npm:1.2.1", {\
"packageLocation": "./.yarn/cache/prelude-ls-npm-1.2.1-3e4d272a55-cd192ec0d0.zip/node_modules/prelude-ls/",\
@ -3750,6 +4099,13 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
["react-is", "npm:16.13.1"]\
],\
"linkType": "HARD"\
}],\
["npm:18.2.0", {\
"packageLocation": "./.yarn/cache/react-is-npm-18.2.0-0cc5edb910-e72d0ba81b.zip/node_modules/react-is/",\
"packageDependencies": [\
["react-is", "npm:18.2.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["read-pkg", [\
@ -3942,6 +4298,15 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["shallowequal", [\
["npm:1.1.0", {\
"packageLocation": "./.yarn/cache/shallowequal-npm-1.1.0-6688d419cb-f4c1de0837.zip/node_modules/shallowequal/",\
"packageDependencies": [\
["shallowequal", "npm:1.1.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["shebang-command", [\
["npm:2.0.0", {\
"packageLocation": "./.yarn/cache/shebang-command-npm-2.0.0-eb2b01921d-6b52fe8727.zip/node_modules/shebang-command/",\
@ -4141,6 +4506,46 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["styled-components", [\
["npm:5.3.6", {\
"packageLocation": "./.yarn/unplugged/styled-components-virtual-dbf927b402/node_modules/styled-components/",\
"packageDependencies": [\
["styled-components", "npm:5.3.6"]\
],\
"linkType": "SOFT"\
}],\
["virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.3.6", {\
"packageLocation": "./.yarn/unplugged/styled-components-virtual-dbf927b402/node_modules/styled-components/",\
"packageDependencies": [\
["styled-components", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:5.3.6"],\
["@babel/helper-module-imports", "npm:7.18.6"],\
["@babel/traverse", "npm:7.20.5"],\
["@emotion/is-prop-valid", "npm:1.2.0"],\
["@emotion/stylis", "npm:0.8.5"],\
["@emotion/unitless", "npm:0.7.5"],\
["@types/react", "npm:18.0.25"],\
["@types/react-dom", "npm:18.0.9"],\
["@types/react-is", null],\
["babel-plugin-styled-components", "virtual:dbf927b4029739772892cc406ac355bda5c8889561173a36c3439102b500f2922c13575cac3aa3f592bb4996c6bbc9c8d25bb77e1c160ef8eb0fba440569339b#npm:2.0.7"],\
["css-to-react-native", "npm:3.0.0"],\
["hoist-non-react-statics", "npm:3.3.2"],\
["react", "npm:18.2.0"],\
["react-dom", "virtual:4b77e00d446246df1ed27001550885fbf1b51be18c660c1b5c357d3d763078ecef2a676194291a120f149b87573081e5af0621dc83cf1f83383639f39ac133c7#npm:18.2.0"],\
["react-is", "npm:18.2.0"],\
["shallowequal", "npm:1.1.0"],\
["supports-color", "npm:5.5.0"]\
],\
"packagePeers": [\
"@types/react-dom",\
"@types/react-is",\
"@types/react",\
"react-dom",\
"react-is",\
"react"\
],\
"linkType": "HARD"\
}]\
]],\
["styled-jsx", [\
["npm:5.1.0", {\
"packageLocation": "./.yarn/cache/styled-jsx-npm-5.1.0-53270b9f38-e5b70476fd.zip/node_modules/styled-jsx/",\
@ -4239,6 +4644,15 @@ function $$SETUP_STATE(hydrateRuntimeState, basePath) {
"linkType": "HARD"\
}]\
]],\
["to-fast-properties", [\
["npm:2.0.0", {\
"packageLocation": "./.yarn/cache/to-fast-properties-npm-2.0.0-0dc60cc481-be2de62fe5.zip/node_modules/to-fast-properties/",\
"packageDependencies": [\
["to-fast-properties", "npm:2.0.0"]\
],\
"linkType": "HARD"\
}]\
]],\
["to-regex-range", [\
["npm:5.0.1", {\
"packageLocation": "./.yarn/cache/to-regex-range-npm-5.0.1-f1e8263b00-f76fa01b3d.zip/node_modules/to-regex-range/",\

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

20
components/logo/index.tsx Normal file
View File

@ -0,0 +1,20 @@
// NextJs
import Image from "next/image";
import Link from "next/link";
// Image Assets
import LogoIcon from "../../public/images/svg/logo.svg";
// Styles
import { LogoContainer } from "./styled";
import { FunctionComponent } from "react";
export const Logo: FunctionComponent = () => {
return (
<Link href="/">
<LogoContainer>
<Image src={LogoIcon} fill={true} alt="Home Logo" />
</LogoContainer>
</Link>
);
};

16
components/logo/styled.ts Normal file
View File

@ -0,0 +1,16 @@
// Styles
import styled from "styled-components";
export const LogoContainer = styled.div`
display: flex;
align-items: center;
justify-content: center;
position: absolute;
width: 160px;
height: 80px;
margin-top: 80px;
margin-left: 80px;
`;

View File

@ -0,0 +1,20 @@
import styled from "styled-components";
import color from "../../styles/color";
export const PrimaryButton = styled.button`
width: 100%;
height: 100%;
border: none;
background-color: ${color.primary};
padding: 11px 30px;
font-family: "Inter", serif;
font-style: normal;
font-weight: 600;
font-size: 1.5rem;
line-height: 20px;
color: ${color.orange};
`;

View File

@ -0,0 +1,3 @@
export * from "./skeleton-animation";
export * from "./skeleton-circle";
export * from "./skeleton-text";

View File

@ -0,0 +1,29 @@
import styled from "styled-components";
import color from "../../styles/color";
export const SkeletonAnimation = styled.div`
opacity: 0.35 !important;
background-image: linear-gradient(
0.25turn,
transparent,
${color.grey["400"]},
transparent
),
linear-gradient(${color.grey["500"]}, ${color.grey["500"]}),
radial-gradient(
38px circle at 19px 19px,
${color.grey["500"]} 50%,
transparent 51%
),
linear-gradient(${color.grey["500"]}, ${color.grey["500"]});
background-repeat: no-repeat;
background-size: 315px 250px, 315px 180px, 100px 100px, 225px 30px;
background-position: -315px 0, 0 0, 0px 190px, 50px 195px;
animation: loading 2s infinite;
@keyframes loading {
to {
background-position: 315px 0, 0 0, 0 190px, 50px 195px;
}
}
`;

View File

@ -0,0 +1,17 @@
// Styles
import color from "../../styles/color";
import styled from "styled-components";
// Components
import { SkeletonAnimation } from "./skeleton-animation";
// Types
import { WidthHeightProps } from "../../types";
export const SkeletonCircle = styled(SkeletonAnimation)<WidthHeightProps>`
width: ${(props) => props.width};
height: ${(props) => props.height};
background-color: ${color.grey["500"]};
border-radius: 50%;
`;

View File

@ -0,0 +1,13 @@
// Styles
import styled from "styled-components";
// Components
import { SkeletonAnimation } from "./skeleton-animation";
// Types
import { WidthHeightProps } from "../../types";
export const SkeletonText = styled(SkeletonAnimation)<WidthHeightProps>`
width: ${(props) => props.width};
height: ${(props) => props.height};
`;

View File

@ -2,6 +2,21 @@
const nextConfig = {
reactStrictMode: false,
swcMinify: true,
compiler: {
styledComponents: true,
},
images: {
remotePatterns: [
{
protocol: "https",
hostname: "pbs.twimg.com",
},
{
protocol: "https",
hostname: "raw.githubusercontent.com",
},
],
},
};
module.exports = nextConfig;

View File

@ -14,7 +14,9 @@
"iron-session": "^6.3.1",
"next": "13.0.5",
"react": "18.2.0",
"react-dom": "18.2.0"
"react-dom": "18.2.0",
"react-is": "^18.2.0",
"styled-components": "^5.3.6"
},
"devDependencies": {
"@next/eslint-plugin-next": "^13.0.5",
@ -22,6 +24,7 @@
"@types/node": "18.11.9",
"@types/react": "18.0.25",
"@types/react-dom": "18.0.9",
"@types/styled-components": "^5",
"@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0",
"eslint": "8.28.0",

View File

@ -1,6 +1,13 @@
import "../styles/globals.css";
import type { AppProps } from "next/app";
import React from "react";
import { GlobalStyle } from "../styles/global";
export default function App({ Component, pageProps }: AppProps) {
return <Component {...pageProps} />;
return (
<React.Fragment>
<GlobalStyle />
<Component {...pageProps} />
</React.Fragment>
);
}

52
pages/_document.tsx Normal file
View File

@ -0,0 +1,52 @@
import Document, {
DocumentContext,
Html,
Head,
Main,
NextScript,
} from "next/document";
class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext) {
const originalRenderPage = ctx.renderPage;
// Run the React rendering logic synchronously
ctx.renderPage = () =>
originalRenderPage({
// Useful for wrapping the whole react tree
enhanceApp: (App) => App,
// Useful for wrapping in a per-page basis
enhanceComponent: (Component) => Component,
});
// Run the parent `getInitialProps`, it now includes the custom `renderPage`
const initialProps = await Document.getInitialProps(ctx);
return initialProps;
}
render() {
return (
<Html>
<Head>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link
rel="preconnect"
href="https://fonts.gstatic.com"
crossOrigin="use-credentials"
/>
<link
href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
rel="stylesheet"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;

View File

@ -1,6 +1,23 @@
import styles from "../styles/Home.module.css";
// NextJs
import Image from "next/image";
import Link from "next/link";
// Types
import { TwitterAuthUrlResponse } from "../types/api-response";
// Styles
import styled, { useTheme } from "styled-components";
import color from "../styles/color";
// Components
import { PrimaryButton } from "../components/primary-button";
// Image Assets
import MainTitle from "../public/images/svg/main-title.svg";
import MainLogo from "../public/images/svg/main-logo.svg";
import CheckIcon from "../public/images/svg/check-icon.svg";
import { Logo } from "../components/logo";
export default function Home() {
const handleSignInWithTwitter = async () => {
const { authUrl }: TwitterAuthUrlResponse = await (
@ -11,10 +28,150 @@ export default function Home() {
};
return (
<div className={styles.container}>
<div>
<button onClick={handleSignInWithTwitter}>Sign in with Twitter</button>
</div>
</div>
<Container>
<Logo />
<MainContainer>
<MainTitleContainer>
<MainTitleImageBackground>
<MainTitleImageContainer>
<Image src={MainTitle} fill={true} alt="Main Title" />
</MainTitleImageContainer>
</MainTitleImageBackground>
<ConnectButtonContainer>
<Link href="/verification">
<PrimaryButton>Connect Wallet</PrimaryButton>
</Link>
</ConnectButtonContainer>
<SubContainer>
<CheckContainer>
<CheckIconContainer>
<Image src={CheckIcon} fill={true} alt="Check Icon" />
</CheckIconContainer>
You are a <CheckBoldText>&nbsp;keplr&nbsp;</CheckBoldText> user.
if not, you can install here
</CheckContainer>
<CheckContainer>
<CheckIconContainer>
<Image src={CheckIcon} fill={true} alt="Check Icon" />
</CheckIconContainer>
<CheckBoldText>Osmo&nbsp;</CheckBoldText> is required for this
transaction
</CheckContainer>
</SubContainer>
</MainTitleContainer>
<MainLogoContainer>
<Image src={MainLogo} layout="fixed" fill={true} alt="Main Logo" />
</MainLogoContainer>
</MainContainer>
</Container>
);
}
const Container = styled.div`
display: flex;
flex-direction: column;
width: 100vw;
height: 100vh;
`;
const MainContainer = styled.div`
display: flex;
flex-direction: row;
margin-top: 15rem;
margin-left: 10rem;
`;
const MainTitleContainer = styled.div`
display: flex;
flex-direction: column;
position: relative;
padding: 0.1rem;
`;
const MainTitleImageBackground = styled.div`
display: flex;
justify-content: center;
width: 70rem;
height: 19.9rem;
background-color: ${color.black};
`;
const MainTitleImageContainer = styled.div`
display: flex;
justify-content: center;
align-items: center;
position: relative;
width: 60rem;
height: 19.9rem;
`;
const MainLogoContainer = styled.div`
position: relative;
right: 2.5rem;
min-width: 25rem;
height: 25rem;
`;
const ConnectButtonContainer = styled.div`
width: 19.9rem;
height: 5rem;
margin-left: 5rem;
`;
const SubContainer = styled.div`
display: flex;
flex-direction: column;
justify-content: center;
gap: 0.5rem;
width: 29.9rem;
height: 4.9rem;
margin-top: 5.1rem;
margin-left: 5rem;
background-color: ${color.black};
`;
const CheckContainer = styled.div`
display: flex;
flex-direction: row;
align-items: center;
font-family: "Inter", serif;
font-style: normal;
font-weight: 500;
font-size: 0.8rem;
line-height: 16px;
text-transform: uppercase;
color: ${color.grey["300"]};
`;
const CheckBoldText = styled.span`
font-size: 0.8rem;
color: ${color.grey["100"]};
`;
const CheckIconContainer = styled.div`
position: relative;
width: 1.6rem;
height: 1.5rem;
`;

View File

@ -1,4 +1,10 @@
// React
import { useEffect, useState } from "react";
// NextJs
import Image from "next/image";
// Types
import {
IcnsVerificationResponse,
TwitterAuthInfoResponse,
@ -6,52 +12,358 @@ import {
import { VerifierMsg } from "../../types/msg";
import { request } from "../../utils/url";
// Styles
import color from "../../styles/color";
// Components
import { Logo } from "../../components/logo";
import { SkeletonCircle, SkeletonText } from "../../components/skeleton";
import {
Container,
MainContainer,
ContentContainer,
ProfileContainer,
ProfileFollowContainer,
ProfileContentContainer,
ProfileImageContainer,
ProfileNameContainer,
ProfileFollowerContainer,
ProfileFollowBold,
ProfileUserNameContainer,
ProfileDescriptionContainer,
ChainListTitle,
SearchContainer,
ChainContainer,
ChainItemContainer,
ChainImageContainer,
ChainInfoContainer,
ChainListTitleContainer,
ChainName,
WalletAddress,
Flex1,
ChainCheckBox,
ButtonContainer,
SkeletonDivider,
SkeletonButton,
} from "./styled";
import { PrimaryButton } from "../../components/primary-button";
export default function VerificationPage() {
const [twitterAuthInfo, setTwitterAuthInfo] =
useState<TwitterAuthInfoResponse | null>();
const [isLoading, setIsLoading] = useState(true);
useEffect(() => {
setTimeout(() => setIsLoading(false), 1500);
}, []);
useEffect(() => {
const handleVerification = async () => {
const [, state, code] =
window.location.search.match(
/^(?=.*state=([^&]+)|)(?=.*code=([^&]+)|).+$/,
) || [];
const newTwitterAuthInfo = await request<TwitterAuthInfoResponse>(
`/api/twitter-auth-info?state=${state}&code=${code}`,
);
if (window.location.search) {
const [, state, code] =
window.location.search.match(
/^(?=.*state=([^&]+)|)(?=.*code=([^&]+)|).+$/,
) || [];
console.log(newTwitterAuthInfo);
const newTwitterAuthInfo = await request<TwitterAuthInfoResponse>(
`/api/twitter-auth-info?state=${state}&code=${code}`,
);
setTwitterAuthInfo(newTwitterAuthInfo);
const verifierMsg: VerifierMsg = {
unique_twitter_id: newTwitterAuthInfo.id,
name: newTwitterAuthInfo.username,
claimer: "osmo1y5mm5nj5m8ttddt5ccspek6xgyyavehrkak7gq",
contract_address: "osmo1y5mm5nj5m8ttddt5ccspek6xgyyavehrkak7gq",
chain_id: "osmosis-1",
};
const icnsVerification = await request<IcnsVerificationResponse>(
"/api/icns-verification",
{
method: "post",
headers: {
"Content-Type": "application/json",
console.log(newTwitterAuthInfo);
setTwitterAuthInfo(newTwitterAuthInfo);
const verifierMsg: VerifierMsg = {
unique_twitter_id: newTwitterAuthInfo.id,
name: newTwitterAuthInfo.username,
claimer: "osmo1y5mm5nj5m8ttddt5ccspek6xgyyavehrkak7gq",
contract_address: "osmo1y5mm5nj5m8ttddt5ccspek6xgyyavehrkak7gq",
chain_id: "osmosis-1",
};
const icnsVerification = await request<IcnsVerificationResponse>(
"/api/icns-verification",
{
method: "post",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
msg: JSON.stringify(verifierMsg),
authToken: newTwitterAuthInfo.accessToken,
}),
},
body: JSON.stringify({
msg: JSON.stringify(verifierMsg),
authToken: newTwitterAuthInfo.accessToken,
}),
},
);
console.log(icnsVerification);
);
console.log(icnsVerification);
}
};
handleVerification();
}, []);
return (
<div>
<div>{twitterAuthInfo?.username}</div>
</div>
<Container>
<Logo />
<MainContainer>
{isLoading ? (
<ContentContainer>
<ProfileContainer color={color.grey["700"]}>
<SkeletonCircle width="5.5rem" height="5.5rem" />
<ProfileContentContainer>
<ProfileNameContainer>
<SkeletonText width="5rem" height="1.5rem" />
</ProfileNameContainer>
<ProfileUserNameContainer>
<SkeletonText width="5rem" height="1rem" />
</ProfileUserNameContainer>
<ProfileFollowContainer>
<SkeletonText width="8rem" height="1rem" />
<SkeletonText width="8rem" height="1rem" />
</ProfileFollowContainer>
<SkeletonText width="20rem" height="1rem" />
</ProfileContentContainer>
</ProfileContainer>
<ChainListTitleContainer>
<SkeletonText width="8rem" height="1.5rem" />
</ChainListTitleContainer>
<ChainContainer color={color.grey["700"]}>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
</ChainContainer>
<ButtonContainer>
<SkeletonButton />
</ButtonContainer>
</ContentContainer>
) : (
<ContentContainer>
<ProfileContainer color={color.grey["700"]}>
<ProfileImageContainer>
<Image
src="https://pbs.twimg.com/profile_images/1503375455532974084/KWG1XmEc_400x400.jpg"
alt="profile image"
fill={true}
/>
</ProfileImageContainer>
<ProfileContentContainer>
<ProfileNameContainer>BaeHeesung</ProfileNameContainer>
<ProfileUserNameContainer>
@BaeHeesung25
</ProfileUserNameContainer>
<ProfileFollowContainer>
<ProfileFollowerContainer>
<ProfileFollowBold>42</ProfileFollowBold> Following
</ProfileFollowerContainer>
<ProfileFollowerContainer>
<ProfileFollowBold>42</ProfileFollowBold> Following
</ProfileFollowerContainer>
</ProfileFollowContainer>
<ProfileDescriptionContainer>
Product UIUX designer @Keplrwallet and I like @regen_network🌿
</ProfileDescriptionContainer>
</ProfileContentContainer>
</ProfileContainer>
<ChainListTitleContainer>
<ChainListTitle>Chain List</ChainListTitle>
<SearchContainer>Search</SearchContainer>
</ChainListTitleContainer>
<ChainContainer color={color.grey["700"]}>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<Image
src="https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/osmosis/chain.png"
alt="chain image"
fill={true}
/>
</ChainImageContainer>
<ChainInfoContainer>
<ChainName>.osmo</ChainName>
<WalletAddress>
cosmos14ky6udatsvdx859050mrnr7rvml0huue2wszvs
</WalletAddress>
</ChainInfoContainer>
<Flex1 />
<ChainCheckBox />
</ChainItemContainer>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<Image
src="https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/osmosis/chain.png"
alt="chain image"
fill={true}
/>
</ChainImageContainer>
<ChainInfoContainer>
<ChainName>.osmo</ChainName>
<WalletAddress>
cosmos14ky6udatsvdx859050mrnr7rvml0huue2wszvs
</WalletAddress>
</ChainInfoContainer>
<Flex1 />
<ChainCheckBox />
</ChainItemContainer>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<Image
src="https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/osmosis/chain.png"
alt="chain image"
fill={true}
/>
</ChainImageContainer>
<ChainInfoContainer>
<ChainName>.osmo</ChainName>
<WalletAddress>
cosmos14ky6udatsvdx859050mrnr7rvml0huue2wszvs
</WalletAddress>
</ChainInfoContainer>
<Flex1 />
<ChainCheckBox />
</ChainItemContainer>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<Image
src="https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/osmosis/chain.png"
alt="chain image"
fill={true}
/>
</ChainImageContainer>
<ChainInfoContainer>
<ChainName>.osmo</ChainName>
<WalletAddress>
cosmos14ky6udatsvdx859050mrnr7rvml0huue2wszvs
</WalletAddress>
</ChainInfoContainer>
<Flex1 />
<ChainCheckBox />
</ChainItemContainer>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<Image
src="https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/osmosis/chain.png"
alt="chain image"
fill={true}
/>
</ChainImageContainer>
<ChainInfoContainer>
<ChainName>.osmo</ChainName>
<WalletAddress>
cosmos14ky6udatsvdx859050mrnr7rvml0huue2wszvs
</WalletAddress>
</ChainInfoContainer>
<Flex1 />
<ChainCheckBox />
</ChainItemContainer>
<ChainItemContainer>
<ChainImageContainer width="3rem" height="3rem">
<Image
src="https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/osmosis/chain.png"
alt="chain image"
fill={true}
/>
</ChainImageContainer>
<ChainInfoContainer>
<ChainName>.osmo</ChainName>
<WalletAddress>
cosmos14ky6udatsvdx859050mrnr7rvml0huue2wszvs
</WalletAddress>
</ChainInfoContainer>
<Flex1 />
<ChainCheckBox />
</ChainItemContainer>
</ChainContainer>
<ButtonContainer>
<PrimaryButton>Register</PrimaryButton>
</ButtonContainer>
</ContentContainer>
)}
</MainContainer>
</Container>
);
}

View File

@ -0,0 +1,219 @@
import styled from "styled-components";
import color from "../../styles/color";
import { WidthHeightProps } from "../../types";
import { SkeletonAnimation } from "../../components/skeleton";
export const Container = styled.div`
width: 100vw;
height: 100vh;
`;
export const MainContainer = styled.div`
display: flex;
justify-content: center;
color: white;
`;
export const ContentContainer = styled.div`
display: flex;
flex-direction: column;
align-items: center;
width: 40rem;
margin-top: 5rem;
`;
export const ProfileContainer = styled.div`
display: flex;
flex-direction: row;
width: 100%;
padding: 1.5rem 2rem;
background-color: ${(props) => props.color};
`;
export const ProfileContentContainer = styled.div`
display: flex;
flex-direction: column;
gap: 0.85rem;
margin-left: 1.5rem;
`;
export const ProfileFollowContainer = styled.div`
display: flex;
flex-direction: row;
gap: 1.5rem;
`;
export const ChainContainer = styled.div`
display: flex;
flex-direction: column;
width: 100%;
max-height: 33rem;
overflow: scroll;
background-color: ${(props) => props.color};
`;
export const ChainItemContainer = styled.div`
display: flex;
flex-direction: row;
align-items: center;
gap: 1rem;
padding: 1.5rem;
&:hover {
background: ${color.grey["900"]};
}
`;
export const ChainImageContainer = styled.div<WidthHeightProps>`
width: ${(props) => props.width};
height: ${(props) => props.height};
position: relative;
`;
export const ChainInfoContainer = styled.div`
display: flex;
flex-direction: column;
gap: 0.5rem;
`;
export const ButtonContainer = styled.div`
width: 10rem;
height: 4rem;
margin-top: 2rem;
`;
export const SkeletonButton = styled.div`
width: 12rem;
height: 4rem;
background-color: ${color.grey["700"]};
`;
export const SkeletonDivider = styled(SkeletonAnimation)`
width: 100%;
height: 1px;
background-color: ${color.grey["600"]};
`;
export const ProfileImageContainer = styled.div`
width: 5rem;
height: 5rem;
margin-top: -3rem;
border-radius: 50%;
overflow: hidden;
position: relative;
`;
export const ProfileNameContainer = styled.div`
font-weight: 600;
font-size: 1.2rem;
line-height: 1.5rem;
color: ${color.white};
`;
export const ProfileUserNameContainer = styled.div`
font-weight: 500;
font-size: 0.8rem;
line-height: 1rem;
color: ${color.grey["100"]};
`;
export const ProfileFollowerContainer = styled.div`
font-weight: 500;
font-size: 0.8rem;
line-height: 1rem;
color: ${color.grey["400"]};
`;
export const ProfileFollowBold = styled.span`
font-weight: 600;
font-size: 0.8rem;
line-height: 1rem;
color: ${color.white};
`;
export const ProfileDescriptionContainer = styled.div`
font-weight: 500;
font-size: 0.8rem;
line-height: 1rem;
color: ${color.grey["300"]};
`;
export const ChainListTitleContainer = styled.div`
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
width: 100%;
margin-top: 2rem;
margin-bottom: 1rem;
`;
export const ChainListTitle = styled.div`
font-weight: 700;
font-size: 1.5rem;
line-height: 1.9rem;
color: ${color.white};
`;
export const SearchContainer = styled.div`
display: flex;
align-items: center;
border-radius: 3rem;
min-width: 10rem;
height: 2rem;
background-color: ${color.grey["700"]};
`;
export const ChainName = styled.div`
font-weight: 600;
font-size: 0.8rem;
line-height: 1rem;
color: ${color.grey["100"]};
`;
export const WalletAddress = styled.div`
font-weight: 500;
font-size: 0.8rem;
line-height: 1rem;
color: ${color.grey["400"]};
`;
export const Flex1 = styled.div`
flex: 1;
`;
export const ChainCheckBox = styled.input.attrs({ type: "checkbox" })`
width: 1.5rem;
height: 1.5rem;
`;

View File

@ -0,0 +1,3 @@
<svg width="27" height="27" viewBox="0 0 27 27" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7 11.5882L12.525 19L20 7" stroke="#A3A3A3" stroke-width="3"/>
</svg>

After

Width:  |  Height:  |  Size: 175 B

View File

@ -0,0 +1,15 @@
<svg width="127" height="34" viewBox="0 0 127 34" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="9" width="16.8571" height="17" rx="8.42855" fill="#FFCDC4"/>
<path d="M9 17H25.8571V34H9V17Z" fill="#FB5232"/>
<rect x="76.4292" width="16.8571" height="17" fill="#EBFFBF"/>
<rect x="76.4292" y="17" width="16.8571" height="17" fill="#EBFFBF"/>
<path d="M59.5721 0L93.2864 33.9999H59.5721V0Z" fill="#00B86E"/>
<path d="M25.8565 17C25.8565 7.61114 33.4037 0 42.7136 0V17H25.8565Z" fill="#F4CC3E"/>
<path d="M42.7136 0H59.5707C59.5707 9.38882 52.0235 17 42.7136 17V0Z" fill="#FFE9B1"/>
<path d="M25.8565 17H42.7136V34C33.4037 34 25.8565 26.3888 25.8565 17Z" fill="#F4CC3E"/>
<path d="M42.7136 17C52.0235 17 59.5707 24.6111 59.5707 34H42.7136V17Z" fill="#FFE9B1"/>
<path d="M93.2858 17C93.2858 14.7675 93.7218 12.5569 94.5689 10.4944C95.4161 8.43183 96.6578 6.55777 98.2231 4.97917C99.7884 3.40058 101.647 2.14837 103.692 1.29404C105.737 0.439717 107.929 -9.75842e-08 110.143 0L110.143 17H93.2858Z" fill="#BED4FF"/>
<path d="M127 17C127 19.2325 126.564 21.4431 125.717 23.5056C124.87 25.5681 123.628 27.4422 122.063 29.0208C120.497 30.5994 118.639 31.8516 116.594 32.7059C114.549 33.5602 112.357 34 110.143 34L110.143 17H127Z" fill="#5A4CFA"/>
<path d="M110.143 0H127L110.143 17V0Z" fill="#BED4FF"/>
<path d="M110.143 34H93.2858L110.143 17V34Z" fill="#5A4CFA"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -0,0 +1,9 @@
<svg width="404" height="404" viewBox="0 0 404 404" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="202" cy="202" r="201" fill="#121212" stroke="#333333" stroke-width="2"/>
<path d="M402.881 202C402.881 175.604 397.682 149.467 387.581 125.081C377.48 100.694 362.675 78.5361 344.01 59.8715C325.345 41.207 303.187 26.4014 278.801 16.3002C254.414 6.19902 228.277 0.999999 201.881 1L201.881 202H402.881Z" stroke="#333333" stroke-width="2"/>
<path d="M202 402.762C175.604 402.762 149.467 397.563 125.081 387.462C100.694 377.36 78.5361 362.555 59.8715 343.89C41.207 325.226 26.4014 303.068 16.3002 278.681C6.19901 254.295 0.999998 228.157 1 201.762L202 201.762L202 402.762Z" stroke="#333333" stroke-width="2"/>
<path d="M202 402.762C228.396 402.762 254.533 397.563 278.919 387.462C303.306 377.36 325.464 362.555 344.128 343.89C362.793 325.226 377.599 303.068 387.7 278.681C397.801 254.295 403 228.157 403 201.762L202 201.762L202 402.762Z" fill="#242424"/>
<path d="M202 2.2656C175.604 2.2656 149.467 7.46461 125.081 17.5658C100.694 27.667 78.5361 42.4726 59.8715 61.1371C41.207 79.8017 26.4014 101.96 16.3002 126.346C6.19901 150.733 0.999998 176.87 1 203.266L202 203.266L202 2.2656Z" fill="#242424"/>
<circle cx="202" cy="201.999" r="80.9057" fill="#242424"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.533 39.4131C185.701 38.5543 163.923 42.1628 143.518 50.0201C123.106 57.8798 104.492 69.8274 88.8035 85.1391C73.1154 100.451 60.6796 118.808 52.2496 139.098C43.9999 158.954 39.7544 180.258 39.7544 201.77L39.7544 201.893L39.7556 202.391C39.7566 202.654 39.7582 202.917 39.7605 203.181C40.0335 234.824 49.4843 265.711 66.9672 292.039C84.7099 318.759 109.928 339.585 139.433 351.883C168.938 364.18 201.405 367.398 232.727 361.129C264.05 354.859 292.821 339.385 315.403 316.661L288.134 289.222C270.945 306.518 249.046 318.297 225.204 323.069C201.362 327.841 176.65 325.392 154.191 316.031C131.733 306.671 112.537 290.819 99.0322 270.48C85.7247 250.44 78.531 226.93 78.3232 202.844C78.3201 202.486 78.3186 202.128 78.3186 201.77C78.3185 185.395 81.5501 169.18 87.8295 154.066C94.2462 138.622 103.712 124.649 115.653 112.994C127.595 101.339 141.763 92.245 157.3 86.2624C171.741 80.702 187.084 77.9371 202.524 78.1012C218.736 78.1012 234.79 81.7235 249.768 87.9166C264.747 94.1097 278.356 103.187 289.82 114.63C301.284 126.074 310.378 139.659 316.582 154.61C322.787 169.562 325.98 185.587 325.98 201.77L326.01 218.018C326.01 229.305 316.86 238.455 305.574 238.455C294.287 238.455 286.703 229.48 286.703 218.193L286.726 125.079H250.33V131.467C238.846 123.588 225.333 118.45 210.736 116.998C207.614 116.648 204.441 116.467 201.226 116.467C154.408 116.467 116.454 154.659 116.454 201.77C116.454 248.881 154.408 287.072 201.226 287.072C205.997 287.072 210.676 286.676 215.232 285.914C234.476 282.96 251.597 273.565 264.325 259.999C274.945 270.435 289.507 276.872 305.574 276.872C338.078 276.872 364.428 250.522 364.428 218.018L364.716 201.77C364.716 180.509 360.521 159.456 352.37 139.813C344.219 120.171 332.272 102.323 317.211 87.2889C302.15 72.2551 284.27 60.3295 264.592 52.1933C246.458 44.6954 227.124 40.0173 207.533 39.4131ZM279.493 201.986C238.617 198.196 206.241 165.821 202.451 124.945C198.661 165.821 166.286 198.196 125.41 201.986C166.286 205.776 198.661 238.151 202.451 279.027C206.241 238.151 238.617 205.776 279.493 201.986Z" fill="#121212" stroke="#333333" stroke-width="2"/>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -0,0 +1,34 @@
<svg width="920" height="202" viewBox="0 0 920 202" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M149.971 78.9997V64.5897H112.021V49.1897H147.001V34.7797H112.021V19.3797H149.311V4.96969H110.151C99.9215 4.96969 95.9615 10.3597 95.9615 18.8297V65.2497C95.9615 73.7197 99.9215 78.9997 110.151 78.9997H149.971Z" fill="#DAECD5"/>
<path d="M218.14 4.96969H158.52V19.8197H180.3V78.9997H196.36V19.8197H218.14V4.96969Z" fill="#DAECD5"/>
<path d="M272.027 46.5497C274.007 51.1697 276.977 54.3597 280.277 56.3397V78.9997H296.337V56.2297C299.637 54.2497 302.497 51.0597 304.367 46.5497L322.408 4.96969H305.027L289.958 42.1497C289.298 43.4697 288.967 44.3497 288.307 44.3497C287.647 44.3497 287.318 43.5797 286.658 42.1497L271.477 4.96969H254.207L272.027 46.5497Z" fill="#DAECD5"/>
<path d="M450.854 80.2097C472.854 80.2097 483.084 67.4497 483.084 46.1097V4.96969H467.024V45.7797C467.024 58.6497 461.744 64.9197 450.854 64.9197C439.964 64.9197 434.684 58.6497 434.684 45.7797V4.96969H418.624V46.1097C418.624 67.4497 428.744 80.2097 450.854 80.2097Z" fill="#DAECD5"/>
<path d="M518.076 78.9997L518.186 55.3497H524.456C532.816 55.3497 536.006 58.9797 539.416 65.7997L546.016 78.9997H563.396L556.246 64.3697C552.396 56.6697 549.646 51.6097 544.916 48.9697C554.376 46.4397 560.316 38.6297 560.316 28.5097C560.316 12.7797 547.446 4.96969 530.726 4.96969H502.236V78.9997H518.076ZM530.946 19.8197C538.206 19.8197 543.816 22.8997 543.816 30.1597C543.816 37.0897 538.316 41.0497 530.726 41.0497H518.186L518.296 19.8197H530.946Z" fill="#DAECD5"/>
<path d="M626.206 78.9997V24.2197L655.466 74.7097C657.886 78.7797 661.956 80.4297 666.686 80.4297C672.516 80.4297 677.906 76.2497 677.906 68.8797V4.96969H662.726V59.4197L633.466 9.25969C631.046 5.18969 627.196 3.42969 622.356 3.42969C616.306 3.42969 610.916 7.71969 610.916 15.0897V78.9997H626.206Z" fill="#DAECD5"/>
<path d="M689.501 78.9997H705.891L710.181 63.9297L740.211 63.8197L744.501 78.9997H760.891L741.311 15.4197C738.781 7.38969 732.181 3.53969 725.141 3.53969C718.211 3.53969 711.611 7.38969 709.081 15.4197L689.501 78.9997ZM722.831 20.1497C723.271 18.6097 724.041 17.9497 725.251 17.9497C726.571 17.9497 727.231 18.6097 727.671 20.1497L736.031 49.5197H714.361L722.831 20.1497Z" fill="#DAECD5"/>
<path d="M919.812 78.9997V64.5897H881.862V49.1897H916.842V34.7797H881.862V19.3797H919.152V4.96969H879.992C869.762 4.96969 865.802 10.3597 865.802 18.8297V65.2497C865.802 73.7197 869.762 78.9997 879.992 78.9997H919.812Z" fill="#DAECD5"/>
<path d="M69.361 200V145.22L98.621 195.71C101.041 199.78 105.111 201.43 109.841 201.43C115.671 201.43 121.061 197.25 121.061 189.88V125.97H105.881V180.42L76.621 130.26C74.201 126.19 70.351 124.43 65.511 124.43C59.461 124.43 54.071 128.72 54.071 136.09V200H69.361Z" fill="#DAECD5"/>
<path d="M179.247 189.55C180.897 197.36 186.177 201.54 192.997 201.54C199.377 201.54 204.877 197.36 206.527 190.21L217.747 141.26L229.077 189.88C230.837 197.36 236.117 201.54 242.717 201.54C249.867 201.54 254.707 197.03 256.357 189.22L269.557 125.97H253.497L242.277 184.6C242.167 184.93 242.167 185.15 242.057 185.15C241.837 185.15 241.837 185.04 241.727 184.6L230.837 137.63C228.747 128.72 224.347 124.87 217.747 124.87C211.147 124.87 206.637 128.72 204.657 137.74L193.987 184.6C193.877 185.04 193.767 185.15 193.657 185.15C193.547 185.15 193.437 185.04 193.327 184.6L181.667 125.97H165.607L179.247 189.55Z" fill="#DAECD5"/>
<path d="M381.671 125.97H365.611V186.25C365.611 194.72 369.571 200 379.801 200H416.211V185.15H381.671V125.97Z" fill="#DAECD5"/>
<path d="M444.4 125.97H428.34V186.25C428.34 194.72 432.299 200 442.53 200H478.94V185.15H444.4V125.97Z" fill="#DAECD5"/>
<path d="M543.978 200V185.59H506.028V170.19H541.008V155.78H506.028V140.38H543.318V125.97H504.158C493.928 125.97 489.968 131.36 489.968 139.83V186.25C489.968 194.72 493.928 200 504.158 200H543.978Z" fill="#DAECD5"/>
<path d="M612.146 125.97H552.526V140.82H574.306V200H590.366V140.82H612.146V125.97Z" fill="#DAECD5"/>
<rect y="120" width="39.4428" height="40.0003" rx="19.7214" fill="#FB5232"/>
<rect y="160" width="39.4428" height="40.0003" fill="#F4CC3E"/>
<path d="M773 3C794.784 3 812.444 20.6595 812.444 42.4435V43.001H773V3Z" fill="#00B86E"/>
<path d="M812.445 42.4435C812.445 20.6595 830.105 3 851.889 3V43.001H812.445V42.4435Z" fill="#FF77F3"/>
<rect x="773" y="42.9961" width="39.4435" height="40.001" fill="#F4CC3E"/>
<rect x="812.445" y="42.9961" width="39.4435" height="40.001" fill="#FB5232"/>
<path d="M314.448 121C336.233 121 353.893 138.91 353.893 161.002H334.17C323.278 161.002 314.448 152.048 314.448 141.001V121Z" fill="#FF77F3"/>
<path d="M314.448 180.997C314.448 169.951 323.278 160.996 334.17 160.996H353.893V200.999H314.448V180.997Z" fill="#00B86E"/>
<path d="M275 161.002C275 138.91 292.66 121 314.445 121V141.001C314.445 152.048 305.615 161.002 294.722 161.002H275Z" fill="#F4CC3E"/>
<path d="M275 160.996H294.722C305.615 160.996 314.445 169.951 314.445 180.997V200.999H275V160.996Z" fill="#5A4CFA"/>
<path d="M408 42C408 18.804 389.196 0 366 0V20.25C366 32.2622 375.738 42 387.75 42H408Z" fill="#5A4CFA"/>
<path d="M408 42C408 65.196 389.196 84 366 84V63.75C366 51.7378 375.738 42 387.75 42H408Z" fill="#F4CC3E"/>
<path d="M324 42C324 18.804 342.804 0 366 0V20.25C366 32.2622 356.262 42 344.25 42H324Z" fill="#FF77F3"/>
<path d="M324 42C324 65.196 342.804 84 366 84V63.75C366 51.7378 356.262 42 344.25 42H324Z" fill="#00B86E"/>
<path d="M0 23C0 11.9543 8.95431 3 20 3H40V43H20C8.95431 43 0 34.0457 0 23Z" fill="#00B86E"/>
<path d="M0 43H40V83H0V43Z" fill="#5A4CFA"/>
<rect x="40" y="3" width="40" height="40" fill="#FF77F3"/>
<path d="M40 43H60C71.0457 43 80 51.9543 80 63C80 74.0457 71.0457 83 60 83H40V43Z" fill="#F4CC3E"/>
</svg>

After

Width:  |  Height:  |  Size: 5.6 KiB

View File

@ -1,129 +0,0 @@
.container {
padding: 0 2rem;
}
.main {
min-height: 100vh;
padding: 4rem 0;
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.footer {
display: flex;
flex: 1;
padding: 2rem 0;
border-top: 1px solid #eaeaea;
justify-content: center;
align-items: center;
}
.footer a {
display: flex;
justify-content: center;
align-items: center;
flex-grow: 1;
}
.title a {
color: #0070f3;
text-decoration: none;
}
.title a:hover,
.title a:focus,
.title a:active {
text-decoration: underline;
}
.title {
margin: 0;
line-height: 1.15;
font-size: 4rem;
}
.title,
.description {
text-align: center;
}
.description {
margin: 4rem 0;
line-height: 1.5;
font-size: 1.5rem;
}
.code {
background: #fafafa;
border-radius: 5px;
padding: 0.75rem;
font-size: 1.1rem;
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace;
}
.grid {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
max-width: 800px;
}
.card {
margin: 1rem;
padding: 1.5rem;
text-align: left;
color: inherit;
text-decoration: none;
border: 1px solid #eaeaea;
border-radius: 10px;
transition: color 0.15s ease, border-color 0.15s ease;
max-width: 300px;
}
.card:hover,
.card:focus,
.card:active {
color: #0070f3;
border-color: #0070f3;
}
.card h2 {
margin: 0 0 1rem 0;
font-size: 1.5rem;
}
.card p {
margin: 0;
font-size: 1.25rem;
line-height: 1.5;
}
.logo {
height: 1em;
margin-left: 0.5rem;
}
@media (max-width: 600px) {
.grid {
width: 100%;
flex-direction: column;
}
}
@media (prefers-color-scheme: dark) {
.card,
.footer {
border-color: #222;
}
.code {
background: #111;
}
.logo img {
filter: invert(1);
}
}

28
styles/color.ts Normal file
View File

@ -0,0 +1,28 @@
const primary = "#FB5232";
const orange = "#FFCDC3";
const grey = {
100: "#A3A3A3",
200: "#868686",
300: "#6F6F6F",
400: "#5B5B5B",
500: "#424242",
600: "#333333",
700: "#2B2B2B",
800: "#242424",
900: "#181818",
};
const white = "#FFFFFF";
const black = "#121212";
const color = {
primary,
grey,
white,
black,
orange,
};
export default color;

28
styles/global.ts Normal file
View File

@ -0,0 +1,28 @@
import { createGlobalStyle } from "styled-components";
import color from "./color";
export const GlobalStyle = createGlobalStyle`
html, body {
padding: 0;
margin: 0;
font-family: 'Inter', sans-serif;
font-size: 16px;
background-color: ${color.black};
background-size: 5rem 5rem;
background-position: top left;
background-repeat: repeat;
background-image: linear-gradient(
rgba(51, 51, 51, 1) 0.1rem,
transparent 0.1rem
),
linear-gradient(90deg, rgba(51, 51, 51, 1) 0.1rem, transparent 0.1rem);
}
* {
box-sizing: border-box;
}
`;

View File

@ -1,26 +0,0 @@
html,
body {
padding: 0;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}
a {
color: inherit;
text-decoration: none;
}
* {
box-sizing: border-box;
}
@media (prefers-color-scheme: dark) {
html {
color-scheme: dark;
}
body {
color: white;
background: black;
}
}

1
types/index.ts Normal file
View File

@ -0,0 +1 @@
export * from "./width-height-props";

View File

@ -0,0 +1,4 @@
export interface WidthHeightProps {
width: string | number;
height: string | number;
}

350
yarn.lock
View File

@ -5,7 +5,7 @@ __metadata:
version: 6
cacheKey: 8
"@babel/code-frame@npm:^7.0.0":
"@babel/code-frame@npm:^7.0.0, @babel/code-frame@npm:^7.18.6":
version: 7.18.6
resolution: "@babel/code-frame@npm:7.18.6"
dependencies:
@ -14,6 +14,77 @@ __metadata:
languageName: node
linkType: hard
"@babel/generator@npm:^7.20.5":
version: 7.20.5
resolution: "@babel/generator@npm:7.20.5"
dependencies:
"@babel/types": ^7.20.5
"@jridgewell/gen-mapping": ^0.3.2
jsesc: ^2.5.1
checksum: 31c10d1e122f08cf755a24bd6f5d197f47eceba03f1133759687d00ab72d210e60ba4011da42f368b6e9fa85cbfda7dc4adb9889c2c20cc5c34bb2d57c1deab7
languageName: node
linkType: hard
"@babel/helper-annotate-as-pure@npm:^7.16.0":
version: 7.18.6
resolution: "@babel/helper-annotate-as-pure@npm:7.18.6"
dependencies:
"@babel/types": ^7.18.6
checksum: 88ccd15ced475ef2243fdd3b2916a29ea54c5db3cd0cfabf9d1d29ff6e63b7f7cd1c27264137d7a40ac2e978b9b9a542c332e78f40eb72abe737a7400788fc1b
languageName: node
linkType: hard
"@babel/helper-environment-visitor@npm:^7.18.9":
version: 7.18.9
resolution: "@babel/helper-environment-visitor@npm:7.18.9"
checksum: b25101f6162ddca2d12da73942c08ad203d7668e06663df685634a8fde54a98bc015f6f62938e8554457a592a024108d45b8f3e651fd6dcdb877275b73cc4420
languageName: node
linkType: hard
"@babel/helper-function-name@npm:^7.19.0":
version: 7.19.0
resolution: "@babel/helper-function-name@npm:7.19.0"
dependencies:
"@babel/template": ^7.18.10
"@babel/types": ^7.19.0
checksum: eac1f5db428ba546270c2b8d750c24eb528b8fcfe50c81de2e0bdebf0e20f24bec688d4331533b782e4a907fad435244621ca2193cfcf80a86731299840e0f6e
languageName: node
linkType: hard
"@babel/helper-hoist-variables@npm:^7.18.6":
version: 7.18.6
resolution: "@babel/helper-hoist-variables@npm:7.18.6"
dependencies:
"@babel/types": ^7.18.6
checksum: fd9c35bb435fda802bf9ff7b6f2df06308a21277c6dec2120a35b09f9de68f68a33972e2c15505c1a1a04b36ec64c9ace97d4a9e26d6097b76b4396b7c5fa20f
languageName: node
linkType: hard
"@babel/helper-module-imports@npm:^7.0.0, @babel/helper-module-imports@npm:^7.16.0":
version: 7.18.6
resolution: "@babel/helper-module-imports@npm:7.18.6"
dependencies:
"@babel/types": ^7.18.6
checksum: f393f8a3b3304b1b7a288a38c10989de754f01d29caf62ce7c4e5835daf0a27b81f3ac687d9d2780d39685aae7b55267324b512150e7b2be967b0c493b6a1def
languageName: node
linkType: hard
"@babel/helper-split-export-declaration@npm:^7.18.6":
version: 7.18.6
resolution: "@babel/helper-split-export-declaration@npm:7.18.6"
dependencies:
"@babel/types": ^7.18.6
checksum: c6d3dede53878f6be1d869e03e9ffbbb36f4897c7cc1527dc96c56d127d834ffe4520a6f7e467f5b6f3c2843ea0e81a7819d66ae02f707f6ac057f3d57943a2b
languageName: node
linkType: hard
"@babel/helper-string-parser@npm:^7.19.4":
version: 7.19.4
resolution: "@babel/helper-string-parser@npm:7.19.4"
checksum: b2f8a3920b30dfac81ec282ac4ad9598ea170648f8254b10f475abe6d944808fb006aab325d3eb5a8ad3bea8dfa888cfa6ef471050dae5748497c110ec060943
languageName: node
linkType: hard
"@babel/helper-validator-identifier@npm:^7.18.6, @babel/helper-validator-identifier@npm:^7.19.1":
version: 7.19.1
resolution: "@babel/helper-validator-identifier@npm:7.19.1"
@ -32,6 +103,15 @@ __metadata:
languageName: node
linkType: hard
"@babel/parser@npm:^7.18.10, @babel/parser@npm:^7.20.5":
version: 7.20.5
resolution: "@babel/parser@npm:7.20.5"
bin:
parser: ./bin/babel-parser.js
checksum: e8d514ce0aa74d56725bd102919a49fa367afef9cd8208cf52f670f54b061c4672f51b4b7980058ab1f5fe73615fe4dc90720ab47bbcebae07ad08d667eda318
languageName: node
linkType: hard
"@babel/runtime-corejs3@npm:^7.10.2":
version: 7.20.6
resolution: "@babel/runtime-corejs3@npm:7.20.6"
@ -51,6 +131,76 @@ __metadata:
languageName: node
linkType: hard
"@babel/template@npm:^7.18.10":
version: 7.18.10
resolution: "@babel/template@npm:7.18.10"
dependencies:
"@babel/code-frame": ^7.18.6
"@babel/parser": ^7.18.10
"@babel/types": ^7.18.10
checksum: 93a6aa094af5f355a72bd55f67fa1828a046c70e46f01b1606e6118fa1802b6df535ca06be83cc5a5e834022be95c7b714f0a268b5f20af984465a71e28f1473
languageName: node
linkType: hard
"@babel/traverse@npm:^7.4.5":
version: 7.20.5
resolution: "@babel/traverse@npm:7.20.5"
dependencies:
"@babel/code-frame": ^7.18.6
"@babel/generator": ^7.20.5
"@babel/helper-environment-visitor": ^7.18.9
"@babel/helper-function-name": ^7.19.0
"@babel/helper-hoist-variables": ^7.18.6
"@babel/helper-split-export-declaration": ^7.18.6
"@babel/parser": ^7.20.5
"@babel/types": ^7.20.5
debug: ^4.1.0
globals: ^11.1.0
checksum: c7fed468614aab1cf762dda5df26e2cfcd2b1b448c9d3321ac44786c4ee773fb0e10357e6593c3c6a648ae2e0be6d90462d855998dc10e3abae84de99291e008
languageName: node
linkType: hard
"@babel/types@npm:^7.18.10, @babel/types@npm:^7.18.6, @babel/types@npm:^7.19.0, @babel/types@npm:^7.20.5, @babel/types@npm:^7.8.3":
version: 7.20.5
resolution: "@babel/types@npm:7.20.5"
dependencies:
"@babel/helper-string-parser": ^7.19.4
"@babel/helper-validator-identifier": ^7.19.1
to-fast-properties: ^2.0.0
checksum: 773f0a1ad9f6ca5c5beaf751d1d8d81b9130de87689d1321fc911d73c3b1167326d66f0ae086a27fb5bfc8b4ee3ffebf1339be50d3b4d8015719692468c31f2d
languageName: node
linkType: hard
"@emotion/is-prop-valid@npm:^1.1.0":
version: 1.2.0
resolution: "@emotion/is-prop-valid@npm:1.2.0"
dependencies:
"@emotion/memoize": ^0.8.0
checksum: cc7a19850a4c5b24f1514665289442c8c641709e6f7711067ad550e05df331da0692a16148e85eda6f47e31b3261b64d74c5e25194d053223be16231f969d633
languageName: node
linkType: hard
"@emotion/memoize@npm:^0.8.0":
version: 0.8.0
resolution: "@emotion/memoize@npm:0.8.0"
checksum: c87bb110b829edd8e1c13b90a6bc37cebc39af29c7599a1e66a48e06f9bec43e8e53495ba86278cc52e7589549492c8dfdc81d19f4fdec0cee6ba13d2ad2c928
languageName: node
linkType: hard
"@emotion/stylis@npm:^0.8.4":
version: 0.8.5
resolution: "@emotion/stylis@npm:0.8.5"
checksum: 67ff5958449b2374b329fb96e83cb9025775ffe1e79153b499537c6c8b2eb64b77f32d7b5d004d646973662356ceb646afd9269001b97c54439fceea3203ce65
languageName: node
linkType: hard
"@emotion/unitless@npm:^0.7.4":
version: 0.7.5
resolution: "@emotion/unitless@npm:0.7.5"
checksum: f976e5345b53fae9414a7b2e7a949aa6b52f8bdbcc84458b1ddc0729e77ba1d1dfdff9960e0da60183877873d3a631fa24d9695dd714ed94bcd3ba5196586a6b
languageName: node
linkType: hard
"@eslint-community/eslint-utils@npm:^4.1.0":
version: 4.1.2
resolution: "@eslint-community/eslint-utils@npm:4.1.2"
@ -104,6 +254,48 @@ __metadata:
languageName: node
linkType: hard
"@jridgewell/gen-mapping@npm:^0.3.2":
version: 0.3.2
resolution: "@jridgewell/gen-mapping@npm:0.3.2"
dependencies:
"@jridgewell/set-array": ^1.0.1
"@jridgewell/sourcemap-codec": ^1.4.10
"@jridgewell/trace-mapping": ^0.3.9
checksum: 1832707a1c476afebe4d0fbbd4b9434fdb51a4c3e009ab1e9938648e21b7a97049fa6009393bdf05cab7504108413441df26d8a3c12193996e65493a4efb6882
languageName: node
linkType: hard
"@jridgewell/resolve-uri@npm:3.1.0":
version: 3.1.0
resolution: "@jridgewell/resolve-uri@npm:3.1.0"
checksum: b5ceaaf9a110fcb2780d1d8f8d4a0bfd216702f31c988d8042e5f8fbe353c55d9b0f55a1733afdc64806f8e79c485d2464680ac48a0d9fcadb9548ee6b81d267
languageName: node
linkType: hard
"@jridgewell/set-array@npm:^1.0.1":
version: 1.1.2
resolution: "@jridgewell/set-array@npm:1.1.2"
checksum: 69a84d5980385f396ff60a175f7177af0b8da4ddb81824cb7016a9ef914eee9806c72b6b65942003c63f7983d4f39a5c6c27185bbca88eb4690b62075602e28e
languageName: node
linkType: hard
"@jridgewell/sourcemap-codec@npm:1.4.14, @jridgewell/sourcemap-codec@npm:^1.4.10":
version: 1.4.14
resolution: "@jridgewell/sourcemap-codec@npm:1.4.14"
checksum: 61100637b6d173d3ba786a5dff019e1a74b1f394f323c1fee337ff390239f053b87266c7a948777f4b1ee68c01a8ad0ab61e5ff4abb5a012a0b091bec391ab97
languageName: node
linkType: hard
"@jridgewell/trace-mapping@npm:^0.3.9":
version: 0.3.17
resolution: "@jridgewell/trace-mapping@npm:0.3.17"
dependencies:
"@jridgewell/resolve-uri": 3.1.0
"@jridgewell/sourcemap-codec": 1.4.14
checksum: 9d703b859cff5cd83b7308fd457a431387db5db96bd781a63bf48e183418dd9d3d44e76b9e4ae13237f6abeeb25d739ec9215c1d5bfdd08f66f750a50074a339
languageName: node
linkType: hard
"@next/env@npm:13.0.5":
version: 13.0.5
resolution: "@next/env@npm:13.0.5"
@ -405,6 +597,16 @@ __metadata:
languageName: node
linkType: hard
"@types/hoist-non-react-statics@npm:*":
version: 3.3.1
resolution: "@types/hoist-non-react-statics@npm:3.3.1"
dependencies:
"@types/react": "*"
hoist-non-react-statics: ^3.3.0
checksum: 2c0778570d9a01d05afabc781b32163f28409bb98f7245c38d5eaf082416fdb73034003f5825eb5e21313044e8d2d9e1f3fe2831e345d3d1b1d20bcd12270719
languageName: node
linkType: hard
"@types/http-assert@npm:*":
version: 1.5.3
resolution: "@types/http-assert@npm:1.5.3"
@ -565,6 +767,17 @@ __metadata:
languageName: node
linkType: hard
"@types/styled-components@npm:^5":
version: 5.1.26
resolution: "@types/styled-components@npm:5.1.26"
dependencies:
"@types/hoist-non-react-statics": "*"
"@types/react": "*"
csstype: ^3.0.2
checksum: 84f53b3101739b20d1731554fb7735bc2f3f5d050a8b392e9845403c8c8bbd729737d033978649f9195a97b557875b010d46e35a4538564a2d0dbcce661dbf76
languageName: node
linkType: hard
"@typescript-eslint/eslint-plugin@npm:^5.45.0":
version: 5.45.0
resolution: "@typescript-eslint/eslint-plugin@npm:5.45.0"
@ -846,6 +1059,28 @@ __metadata:
languageName: node
linkType: hard
"babel-plugin-styled-components@npm:>= 1.12.0":
version: 2.0.7
resolution: "babel-plugin-styled-components@npm:2.0.7"
dependencies:
"@babel/helper-annotate-as-pure": ^7.16.0
"@babel/helper-module-imports": ^7.16.0
babel-plugin-syntax-jsx: ^6.18.0
lodash: ^4.17.11
picomatch: ^2.3.0
peerDependencies:
styled-components: ">= 2"
checksum: 80b06b10db02d749432a0ac43a5feedd686f6b648628d7433a39b1844260b2b7c72431f6e705c82636ee025fcfd4f6c32fc05677e44033b8a39ddcd4488b3147
languageName: node
linkType: hard
"babel-plugin-syntax-jsx@npm:^6.18.0":
version: 6.18.0
resolution: "babel-plugin-syntax-jsx@npm:6.18.0"
checksum: 0c7ce5b81d6cfc01a7dd7a76a9a8f090ee02ba5c890310f51217ef1a7e6163fb7848994bbc14fd560117892e82240df9c7157ad0764da67ca5f2afafb73a7d27
languageName: node
linkType: hard
"balanced-match@npm:^1.0.0":
version: 1.0.2
resolution: "balanced-match@npm:1.0.2"
@ -913,6 +1148,13 @@ __metadata:
languageName: node
linkType: hard
"camelize@npm:^1.0.0":
version: 1.0.1
resolution: "camelize@npm:1.0.1"
checksum: 91d8611d09af725e422a23993890d22b2b72b4cabf7239651856950c76b4bf53fe0d0da7c5e4db05180e898e4e647220e78c9fbc976113bd96d603d1fcbfcb99
languageName: node
linkType: hard
"caniuse-lite@npm:^1.0.30001406":
version: 1.0.30001435
resolution: "caniuse-lite@npm:1.0.30001435"
@ -1042,6 +1284,24 @@ __metadata:
languageName: node
linkType: hard
"css-color-keywords@npm:^1.0.0":
version: 1.0.0
resolution: "css-color-keywords@npm:1.0.0"
checksum: 8f125e3ad477bd03c77b533044bd9e8a6f7c0da52d49bbc0bbe38327b3829d6ba04d368ca49dd9ff3b667d2fc8f1698d891c198bbf8feade1a5501bf5a296408
languageName: node
linkType: hard
"css-to-react-native@npm:^3.0.0":
version: 3.0.0
resolution: "css-to-react-native@npm:3.0.0"
dependencies:
camelize: ^1.0.0
css-color-keywords: ^1.0.0
postcss-value-parser: ^4.0.2
checksum: 98a2e9d4fbe9cabc8b744dfdd5ec108396ce497a7b860912a95b299bd52517461281810fcb707965a021a8be39adca9587184a26fb4e926211391a1557aca3c1
languageName: node
linkType: hard
"csstype@npm:^3.0.2":
version: 3.1.1
resolution: "csstype@npm:3.1.1"
@ -1074,7 +1334,7 @@ __metadata:
languageName: node
linkType: hard
"debug@npm:^4.1.1, debug@npm:^4.3.2, debug@npm:^4.3.4":
"debug@npm:^4.1.0, debug@npm:^4.1.1, debug@npm:^4.3.2, debug@npm:^4.3.4":
version: 4.3.4
resolution: "debug@npm:4.3.4"
dependencies:
@ -1826,6 +2086,13 @@ __metadata:
languageName: node
linkType: hard
"globals@npm:^11.1.0":
version: 11.12.0
resolution: "globals@npm:11.12.0"
checksum: 67051a45eca3db904aee189dfc7cd53c20c7d881679c93f6146ddd4c9f4ab2268e68a919df740d39c71f4445d2b38ee360fc234428baea1dbdfe68bbcb46979e
languageName: node
linkType: hard
"globals@npm:^13.15.0":
version: 13.18.0
resolution: "globals@npm:13.18.0"
@ -1961,6 +2228,15 @@ __metadata:
languageName: node
linkType: hard
"hoist-non-react-statics@npm:^3.0.0, hoist-non-react-statics@npm:^3.3.0":
version: 3.3.2
resolution: "hoist-non-react-statics@npm:3.3.2"
dependencies:
react-is: ^16.7.0
checksum: b1538270429b13901ee586aa44f4cc3ecd8831c061d06cb8322e50ea17b3f5ce4d0e2e66394761e6c8e152cd8c34fb3b4b690116c6ce2bd45b18c746516cb9e8
languageName: node
linkType: hard
"hosted-git-info@npm:^2.1.4":
version: 2.8.9
resolution: "hosted-git-info@npm:2.8.9"
@ -1977,6 +2253,7 @@ __metadata:
"@types/node": 18.11.9
"@types/react": 18.0.25
"@types/react-dom": 18.0.9
"@types/styled-components": ^5
"@typescript-eslint/eslint-plugin": ^5.45.0
"@typescript-eslint/parser": ^5.45.0
crypto: ^1.0.1
@ -1995,6 +2272,8 @@ __metadata:
prettier: ^2.8.0
react: 18.2.0
react-dom: 18.2.0
react-is: ^18.2.0
styled-components: ^5.3.6
typescript: 4.9.3
languageName: unknown
linkType: soft
@ -2325,6 +2604,15 @@ __metadata:
languageName: node
linkType: hard
"jsesc@npm:^2.5.1":
version: 2.5.2
resolution: "jsesc@npm:2.5.2"
bin:
jsesc: bin/jsesc
checksum: 4dc190771129e12023f729ce20e1e0bfceac84d73a85bc3119f7f938843fe25a4aeccb54b6494dce26fcf263d815f5f31acdefac7cc9329efb8422a4f4d9fa9d
languageName: node
linkType: hard
"jsesc@npm:^3.0.2":
version: 3.0.2
resolution: "jsesc@npm:3.0.2"
@ -2464,7 +2752,7 @@ __metadata:
languageName: node
linkType: hard
"lodash@npm:^4.17.15, lodash@npm:^4.17.21":
"lodash@npm:^4.17.11, lodash@npm:^4.17.15, lodash@npm:^4.17.21":
version: 4.17.21
resolution: "lodash@npm:4.17.21"
checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7
@ -2880,7 +3168,7 @@ __metadata:
languageName: node
linkType: hard
"picomatch@npm:^2.3.1":
"picomatch@npm:^2.3.0, picomatch@npm:^2.3.1":
version: 2.3.1
resolution: "picomatch@npm:2.3.1"
checksum: 050c865ce81119c4822c45d3c84f1ced46f93a0126febae20737bd05ca20589c564d6e9226977df859ed5e03dc73f02584a2b0faad36e896936238238b0446cf
@ -2894,6 +3182,13 @@ __metadata:
languageName: node
linkType: hard
"postcss-value-parser@npm:^4.0.2":
version: 4.2.0
resolution: "postcss-value-parser@npm:4.2.0"
checksum: 819ffab0c9d51cf0acbabf8996dffbfafbafa57afc0e4c98db88b67f2094cb44488758f06e5da95d7036f19556a4a732525e84289a425f4f6fd8e412a9d7442f
languageName: node
linkType: hard
"postcss@npm:8.4.14":
version: 8.4.14
resolution: "postcss@npm:8.4.14"
@ -2983,13 +3278,20 @@ __metadata:
languageName: node
linkType: hard
"react-is@npm:^16.13.1":
"react-is@npm:^16.13.1, react-is@npm:^16.7.0":
version: 16.13.1
resolution: "react-is@npm:16.13.1"
checksum: f7a19ac3496de32ca9ae12aa030f00f14a3d45374f1ceca0af707c831b2a6098ef0d6bdae51bd437b0a306d7f01d4677fcc8de7c0d331eb47ad0f46130e53c5f
languageName: node
linkType: hard
"react-is@npm:^18.2.0":
version: 18.2.0
resolution: "react-is@npm:18.2.0"
checksum: e72d0ba81b5922759e4aff17e0252bd29988f9642ed817f56b25a3e217e13eea8a7f2322af99a06edb779da12d5d636e9fda473d620df9a3da0df2a74141d53e
languageName: node
linkType: hard
"react@npm:18.2.0":
version: 18.2.0
resolution: "react@npm:18.2.0"
@ -3211,6 +3513,13 @@ __metadata:
languageName: node
linkType: hard
"shallowequal@npm:^1.1.0":
version: 1.1.0
resolution: "shallowequal@npm:1.1.0"
checksum: f4c1de0837f106d2dbbfd5d0720a5d059d1c66b42b580965c8f06bb1db684be8783538b684092648c981294bf817869f743a066538771dbecb293df78f765e00
languageName: node
linkType: hard
"shebang-command@npm:^2.0.0":
version: 2.0.0
resolution: "shebang-command@npm:2.0.0"
@ -3386,6 +3695,28 @@ __metadata:
languageName: node
linkType: hard
"styled-components@npm:^5.3.6":
version: 5.3.6
resolution: "styled-components@npm:5.3.6"
dependencies:
"@babel/helper-module-imports": ^7.0.0
"@babel/traverse": ^7.4.5
"@emotion/is-prop-valid": ^1.1.0
"@emotion/stylis": ^0.8.4
"@emotion/unitless": ^0.7.4
babel-plugin-styled-components: ">= 1.12.0"
css-to-react-native: ^3.0.0
hoist-non-react-statics: ^3.0.0
shallowequal: ^1.1.0
supports-color: ^5.5.0
peerDependencies:
react: ">= 16.8.0"
react-dom: ">= 16.8.0"
react-is: ">= 16.8.0"
checksum: 68eac1e451be81d66739cf86de8ec9e72f46e7584aa359271761a2437468210bd7cf0a864281fc97dab08c32b35e6bf7513dc8b4104ed6b196cf8d65674dd289
languageName: node
linkType: hard
"styled-jsx@npm:5.1.0":
version: 5.1.0
resolution: "styled-jsx@npm:5.1.0"
@ -3402,7 +3733,7 @@ __metadata:
languageName: node
linkType: hard
"supports-color@npm:^5.3.0":
"supports-color@npm:^5.3.0, supports-color@npm:^5.5.0":
version: 5.5.0
resolution: "supports-color@npm:5.5.0"
dependencies:
@ -3461,6 +3792,13 @@ __metadata:
languageName: node
linkType: hard
"to-fast-properties@npm:^2.0.0":
version: 2.0.0
resolution: "to-fast-properties@npm:2.0.0"
checksum: be2de62fe58ead94e3e592680052683b1ec986c72d589e7b21e5697f8744cdbf48c266fa72f6c15932894c10187b5f54573a3bcf7da0bfd964d5caf23d436168
languageName: node
linkType: hard
"to-regex-range@npm:^5.0.1":
version: 5.0.1
resolution: "to-regex-range@npm:5.0.1"