From 938b6982a48eda24f1c2f662409b4f5c29aa7547 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sat, 24 Jun 2023 00:28:19 +0900 Subject: [PATCH 001/118] =?UTF-8?q?design:=20=EA=B6=8C=ED=95=9C=20?= =?UTF-8?q?=EC=84=A4=EC=A0=95=20=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20?= =?UTF-8?q?=EC=B4=88=EC=95=88=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/MainButton.jsx | 12 +++++ .../permissionPage/OptionalPermission.jsx | 15 ++++++ src/pages/PermissionPage.jsx | 51 +++++++++++++++++++ src/static/constants.js | 37 ++++++++++++++ tailwind.config.js | 7 +++ 5 files changed, 122 insertions(+) create mode 100644 src/components/common/MainButton.jsx create mode 100644 src/components/permissionPage/OptionalPermission.jsx create mode 100644 src/pages/PermissionPage.jsx create mode 100644 src/static/constants.js diff --git a/src/components/common/MainButton.jsx b/src/components/common/MainButton.jsx new file mode 100644 index 0000000..ca352bd --- /dev/null +++ b/src/components/common/MainButton.jsx @@ -0,0 +1,12 @@ +import React from 'react'; + +function MainButton({ name, customClass }) { + return ( +
+ {name} +
+ ); +} + +export default MainButton; diff --git a/src/components/permissionPage/OptionalPermission.jsx b/src/components/permissionPage/OptionalPermission.jsx new file mode 100644 index 0000000..7deb7d4 --- /dev/null +++ b/src/components/permissionPage/OptionalPermission.jsx @@ -0,0 +1,15 @@ +import React from 'react'; + +function OptionalPermission({ src, title, description }) { + return ( +
+ alt +
+
{title}
+
{description}
+
+
+ ); +} + +export default OptionalPermission; diff --git a/src/pages/PermissionPage.jsx b/src/pages/PermissionPage.jsx new file mode 100644 index 0000000..b6a632e --- /dev/null +++ b/src/pages/PermissionPage.jsx @@ -0,0 +1,51 @@ +import React from 'react'; + +import OptionalPermission from '../components/permissionPage/OptionalPermission'; + +import { + PERMISSION_FIRST_TITLE, + PERMISSION_SECOND_TITLE, + SELECT_PERMISSION, + TEMPORARY_SRC, + NOTIFICATION, + NOTIFICATION_DESCRIPTION, + LOCATION, + LOCATION_DESCRIPTION, + CAMERA, + CAMERA_DESCRIPTION, + MIKE, + MIKE_DESCRIPTION, + STORAGE, + STORAGE_DESCRIPTION, + PERMISSION_MESSAGE, + CONFIRM, +} from '../static/constants'; +import MainButton from '../components/common/MainButton'; + +function PermissionPage() { + return ( +
+
+
{PERMISSION_FIRST_TITLE}
+
{PERMISSION_SECOND_TITLE}
+
+
{SELECT_PERMISSION}
+ +
+ + + + + +
+ +
+ {PERMISSION_MESSAGE} +
+ + +
+ ); +} + +export default PermissionPage; diff --git a/src/static/constants.js b/src/static/constants.js new file mode 100644 index 0000000..baadc43 --- /dev/null +++ b/src/static/constants.js @@ -0,0 +1,37 @@ +// PermissionPage +const PERMISSION_FIRST_TITLE = '우리동네 함께사요 이용을 위해'; +const PERMISSION_SECOND_TITLE = '우리동네 함께사요 이용을 위해'; +const SELECT_PERMISSION = '선택 권한'; +const TEMPORARY_SRC = 'https://img.freepik.com/free-psd/portrait-of-an-adorable-golden-retriever-puppy_53876-73975.jpg'; +const NOTIFICATION = '알림'; +const NOTIFICATION_DESCRIPTION = '채팅 등 앱 알림 수신 시 필요'; +const LOCATION = '위치'; +const LOCATION_DESCRIPTION = '지역별 상품 등록, 상품 검색 시 허용'; +const CAMERA = '카메라/앨범'; +const CAMERA_DESCRIPTION = '상품 등록, 채팅에서 사진 전송 시 사용'; +const MIKE = '마이크'; +const MIKE_DESCRIPTION = '채팅에서 동영상 촬영 시 사용'; +const STORAGE = '저장소'; +const STORAGE_DESCRIPTION = '사진 편집 및 저장 시 사용'; +const PERMISSION_MESSAGE = + '해당 기능을 사용할 때 권한 허용이 필요하며, 허용되지 않아도 해당 기능 외 서비스 이용이 가능합니다.'; +const CONFIRM = '확인'; + +export { + PERMISSION_FIRST_TITLE, + PERMISSION_SECOND_TITLE, + SELECT_PERMISSION, + TEMPORARY_SRC, + NOTIFICATION, + NOTIFICATION_DESCRIPTION, + LOCATION, + LOCATION_DESCRIPTION, + CAMERA, + CAMERA_DESCRIPTION, + MIKE, + MIKE_DESCRIPTION, + STORAGE, + STORAGE_DESCRIPTION, + PERMISSION_MESSAGE, + CONFIRM, +}; diff --git a/tailwind.config.js b/tailwind.config.js index 0171921..8314004 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -4,6 +4,13 @@ module.exports = { content: ['./src/**/*.{js,jsx,ts,tsx}'], theme: { extend: {}, + colors: { + backgroundColor: '#FFEAA7', + white: '#FFFFFF', + lightGray: '#F0F0F0', + deepGray: '#9D9D9D', + mainColor: '#2572E5', + }, }, plugins: [], }; From 12794069fdabc8a122d88919c945f418b6e03e16 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sat, 24 Jun 2023 00:40:48 +0900 Subject: [PATCH 002/118] =?UTF-8?q?design:=20app=20css=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/App.js b/src/App.js index 077bec7..45fd99e 100644 --- a/src/App.js +++ b/src/App.js @@ -1,7 +1,11 @@ import './styles/App.css'; function App() { - return
; + return ( +
+
+
+ ); } export default App; From 777d8df8f8fb14754728f16ba9fd9924c5492d78 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sat, 24 Jun 2023 12:46:14 +0900 Subject: [PATCH 003/118] =?UTF-8?q?design:=20=EC=9C=84=EC=B9=98=20?= =?UTF-8?q?=EB=93=B1=EB=A1=9D=20=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20?= =?UTF-8?q?=EC=B4=88=EC=95=88=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../registerLocationPage/NearLoacation.jsx | 7 +++ src/pages/RegisterLocationPage.jsx | 54 +++++++++++++++++++ src/static/constants.js | 8 ++- tailwind.config.js | 1 + 4 files changed, 69 insertions(+), 1 deletion(-) create mode 100644 src/components/registerLocationPage/NearLoacation.jsx create mode 100644 src/pages/RegisterLocationPage.jsx diff --git a/src/components/registerLocationPage/NearLoacation.jsx b/src/components/registerLocationPage/NearLoacation.jsx new file mode 100644 index 0000000..83b5c1c --- /dev/null +++ b/src/components/registerLocationPage/NearLoacation.jsx @@ -0,0 +1,7 @@ +import React from 'react'; + +function NearLoacation({ location }) { + return
{location}
; +} + +export default NearLoacation; diff --git a/src/pages/RegisterLocationPage.jsx b/src/pages/RegisterLocationPage.jsx new file mode 100644 index 0000000..69616ba --- /dev/null +++ b/src/pages/RegisterLocationPage.jsx @@ -0,0 +1,54 @@ +import React from 'react'; +import NearLoacation from '../components/registerLocationPage/NearLoacation'; +import { SEARCH_LOCATION, NEAR_LOCATION } from '../static/constants'; + +function RegisterLocationPage() { + return ( +
+
+ + +
+ +
{NEAR_LOCATION}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ ); +} + +export default RegisterLocationPage; diff --git a/src/static/constants.js b/src/static/constants.js index baadc43..2ebc876 100644 --- a/src/static/constants.js +++ b/src/static/constants.js @@ -1,6 +1,6 @@ // PermissionPage const PERMISSION_FIRST_TITLE = '우리동네 함께사요 이용을 위해'; -const PERMISSION_SECOND_TITLE = '우리동네 함께사요 이용을 위해'; +const PERMISSION_SECOND_TITLE = '앱 권한을 허용해주세요'; const SELECT_PERMISSION = '선택 권한'; const TEMPORARY_SRC = 'https://img.freepik.com/free-psd/portrait-of-an-adorable-golden-retriever-puppy_53876-73975.jpg'; const NOTIFICATION = '알림'; @@ -17,6 +17,10 @@ const PERMISSION_MESSAGE = '해당 기능을 사용할 때 권한 허용이 필요하며, 허용되지 않아도 해당 기능 외 서비스 이용이 가능합니다.'; const CONFIRM = '확인'; +// RegisterLocationPage +const SEARCH_LOCATION = '내 동네 이름(동,읍,면)으로 검색'; +const NEAR_LOCATION = '근처 동네'; + export { PERMISSION_FIRST_TITLE, PERMISSION_SECOND_TITLE, @@ -34,4 +38,6 @@ export { STORAGE_DESCRIPTION, PERMISSION_MESSAGE, CONFIRM, + SEARCH_LOCATION, + NEAR_LOCATION, }; diff --git a/tailwind.config.js b/tailwind.config.js index 8314004..e891f29 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -8,6 +8,7 @@ module.exports = { backgroundColor: '#FFEAA7', white: '#FFFFFF', lightGray: '#F0F0F0', + gray: '#D9D9D9', deepGray: '#9D9D9D', mainColor: '#2572E5', }, From f3b7f916f59ddbca4d3a4134247dff505d132e7d Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sat, 24 Jun 2023 12:58:19 +0900 Subject: [PATCH 004/118] =?UTF-8?q?refactor:=20=EA=B2=80=EC=83=89=EC=B0=BD?= =?UTF-8?q?,=20=EB=B2=84=ED=8A=BC=20=EA=B3=B5=ED=86=B5=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/BackButton.jsx | 8 ++++++++ src/pages/RegisterLocationPage.jsx | 9 ++------- src/pages/SearchPage.jsx | 7 +++++++ 3 files changed, 17 insertions(+), 7 deletions(-) create mode 100644 src/components/common/BackButton.jsx create mode 100644 src/pages/SearchPage.jsx diff --git a/src/components/common/BackButton.jsx b/src/components/common/BackButton.jsx new file mode 100644 index 0000000..e55b865 --- /dev/null +++ b/src/components/common/BackButton.jsx @@ -0,0 +1,8 @@ +import React from 'react'; + +function BackButton() { + // TODO 추후 이미지나 만들어진 아이콘으로 수정 예정 + return ; +} + +export default BackButton; diff --git a/src/pages/RegisterLocationPage.jsx b/src/pages/RegisterLocationPage.jsx index 69616ba..2c55d71 100644 --- a/src/pages/RegisterLocationPage.jsx +++ b/src/pages/RegisterLocationPage.jsx @@ -1,17 +1,12 @@ import React from 'react'; import NearLoacation from '../components/registerLocationPage/NearLoacation'; import { SEARCH_LOCATION, NEAR_LOCATION } from '../static/constants'; +import SearchBar from '../components/common/SearchBar'; function RegisterLocationPage() { return (
-
- - -
+
{NEAR_LOCATION}
diff --git a/src/pages/SearchPage.jsx b/src/pages/SearchPage.jsx new file mode 100644 index 0000000..edfc729 --- /dev/null +++ b/src/pages/SearchPage.jsx @@ -0,0 +1,7 @@ +import React from 'react'; + +function SearchPage() { + return
SearchPage
; +} + +export default SearchPage; From 390986f7ace0f1f714cad3538ff532a03c614c90 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sat, 24 Jun 2023 13:43:04 +0900 Subject: [PATCH 005/118] =?UTF-8?q?chore:=20react-select=20=EB=9D=BC?= =?UTF-8?q?=EC=9D=B4=EB=B8=8C=EB=9F=AC=EB=A6=AC=20=EC=84=A4=EC=B9=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit npm i react-select --- package-lock.json | 397 ++++++++++++++++++++++++++++++++++++++++++++++ package.json | 1 + 2 files changed, 398 insertions(+) diff --git a/package-lock.json b/package-lock.json index 8ae474e..6755268 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", + "react-select": "^5.7.3", "styled-components": "^6.0.0-rc.5", "web-vitals": "^2.1.4" }, @@ -3046,6 +3047,60 @@ "postcss-selector-parser": "^6.0.10" } }, + "node_modules/@emotion/babel-plugin": { + "version": "11.11.0", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz", + "integrity": "sha512-m4HEDZleaaCH+XgDDsPF15Ht6wTLsgDTeR3WYj9Q/k76JtWhrJjcP4+/XlG8LGT/Rol9qUfOIztXeA84ATpqPQ==", + "dependencies": { + "@babel/helper-module-imports": "^7.16.7", + "@babel/runtime": "^7.18.3", + "@emotion/hash": "^0.9.1", + "@emotion/memoize": "^0.8.1", + "@emotion/serialize": "^1.1.2", + "babel-plugin-macros": "^3.1.0", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.2.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/@emotion/cache": { + "version": "11.11.0", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.11.0.tgz", + "integrity": "sha512-P34z9ssTCBi3e9EI1ZsWpNHcfY1r09ZO0rZbRO2ob3ZQMnFI35jB536qoXbkdesr5EUhYi22anuEJuyxifaqAQ==", + "dependencies": { + "@emotion/memoize": "^0.8.1", + "@emotion/sheet": "^1.2.2", + "@emotion/utils": "^1.2.1", + "@emotion/weak-memoize": "^0.3.1", + "stylis": "4.2.0" + } + }, + "node_modules/@emotion/hash": { + "version": "0.9.1", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.1.tgz", + "integrity": "sha512-gJB6HLm5rYwSLI6PQa+X1t5CFGrv1J1TWG+sOyMCeKz2ojaj6Fnl/rZEspogG+cvqbt4AE/2eIyD2QfLKTBNlQ==" + }, "node_modules/@emotion/is-prop-valid": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz", @@ -3059,11 +3114,69 @@ "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==" }, + "node_modules/@emotion/react": { + "version": "11.11.1", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.11.1.tgz", + "integrity": "sha512-5mlW1DquU5HaxjLkfkGN1GA/fvVGdyHURRiX/0FHl2cfIfRxSOfmxEH5YS43edp0OldZrZ+dkBKbngxcNCdZvA==", + "dependencies": { + "@babel/runtime": "^7.18.3", + "@emotion/babel-plugin": "^11.11.0", + "@emotion/cache": "^11.11.0", + "@emotion/serialize": "^1.1.2", + "@emotion/use-insertion-effect-with-fallbacks": "^1.0.1", + "@emotion/utils": "^1.2.1", + "@emotion/weak-memoize": "^0.3.1", + "hoist-non-react-statics": "^3.3.1" + }, + "peerDependencies": { + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/serialize": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.2.tgz", + "integrity": "sha512-zR6a/fkFP4EAcCMQtLOhIgpprZOwNmCldtpaISpvz348+DP4Mz8ZoKaGGCQpbzepNIUWbq4w6hNZkwDyKoS+HA==", + "dependencies": { + "@emotion/hash": "^0.9.1", + "@emotion/memoize": "^0.8.1", + "@emotion/unitless": "^0.8.1", + "@emotion/utils": "^1.2.1", + "csstype": "^3.0.2" + } + }, + "node_modules/@emotion/sheet": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.2.2.tgz", + "integrity": "sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==" + }, "node_modules/@emotion/unitless": { "version": "0.8.1", "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz", "integrity": "sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==" }, + "node_modules/@emotion/use-insertion-effect-with-fallbacks": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.1.tgz", + "integrity": "sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==", + "peerDependencies": { + "react": ">=16.8.0" + } + }, + "node_modules/@emotion/utils": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.1.tgz", + "integrity": "sha512-Y2tGf3I+XVnajdItskUCn6LX+VUDmP6lTL4fcqsXAv43dnlbZiuW4MWQW38rW/BVWSE7Q/7+XQocmpnRYILUmg==" + }, + "node_modules/@emotion/weak-memoize": { + "version": "0.3.1", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.3.1.tgz", + "integrity": "sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww==" + }, "node_modules/@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", @@ -3157,6 +3270,19 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@floating-ui/core": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.3.1.tgz", + "integrity": "sha512-Bu+AMaXNjrpjh41znzHqaz3r2Nr8hHuHZT6V2LBKMhyMl0FgKA62PNYbqnfgmzOhoWZj70Zecisbo4H1rotP5g==" + }, + "node_modules/@floating-ui/dom": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.4.2.tgz", + "integrity": "sha512-VKmvHVatWnewmGGy+7Mdy4cTJX71Pli6v/Wjb5RQBuq5wjUYx+Ef+kRThi8qggZqDgD8CogCpqhRoVp3+yQk+g==", + "dependencies": { + "@floating-ui/core": "^1.3.1" + } + }, "node_modules/@humanwhocodes/config-array": { "version": "0.11.10", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz", @@ -5185,6 +5311,14 @@ "@types/react": "*" } }, + "node_modules/@types/react-transition-group": { + "version": "4.4.6", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.6.tgz", + "integrity": "sha512-VnCdSxfcm08KjsJVQcfBmhEQAPnLB8G08hAxn39azX1qYBQ/5RVQuoHuKIcfKOdncuaUvEpFKFzEvbtIMsfVew==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -7995,6 +8129,15 @@ "utila": "~0.4" } }, + "node_modules/dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "dependencies": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "node_modules/dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -9412,6 +9555,11 @@ "url": "https://github.com/avajs/find-cache-dir?sponsor=1" } }, + "node_modules/find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -10091,6 +10239,19 @@ "he": "bin/he" } }, + "node_modules/hoist-non-react-statics": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", + "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "dependencies": { + "react-is": "^16.7.0" + } + }, + "node_modules/hoist-non-react-statics/node_modules/react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + }, "node_modules/hoopy": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz", @@ -13780,6 +13941,11 @@ "node": ">= 4.0.0" } }, + "node_modules/memoize-one": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz", + "integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==" + }, "node_modules/meow": { "version": "8.1.2", "resolved": "https://registry.npmjs.org/meow/-/meow-8.1.2.tgz", @@ -16421,6 +16587,41 @@ } } }, + "node_modules/react-select": { + "version": "5.7.3", + "resolved": "https://registry.npmjs.org/react-select/-/react-select-5.7.3.tgz", + "integrity": "sha512-z8i3NCuFFWL3w27xq92rBkVI2onT0jzIIPe480HlBjXJ3b5o6Q+Clp4ydyeKrj9DZZ3lrjawwLC5NGl0FSvUDg==", + "dependencies": { + "@babel/runtime": "^7.12.0", + "@emotion/cache": "^11.4.0", + "@emotion/react": "^11.8.1", + "@floating-ui/dom": "^1.0.1", + "@types/react-transition-group": "^4.4.0", + "memoize-one": "^6.0.0", + "prop-types": "^15.6.0", + "react-transition-group": "^4.3.0", + "use-isomorphic-layout-effect": "^1.1.2" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/react-transition-group": { + "version": "4.4.5", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", + "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", + "dependencies": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "peerDependencies": { + "react": ">=16.6.0", + "react-dom": ">=16.6.0" + } + }, "node_modules/read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", @@ -18684,6 +18885,19 @@ "requires-port": "^1.0.0" } }, + "node_modules/use-isomorphic-layout-effect": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz", + "integrity": "sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==", + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, "node_modules/util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", @@ -21744,6 +21958,53 @@ "integrity": "sha512-+OJ9konv95ClSTOJCmMZqpd5+YGsB2S+x6w3E1oaM8UuR5j8nTNHYSz8c9BEPGDOCMQYIEEGlVPj/VY64iTbGw==", "requires": {} }, + "@emotion/babel-plugin": { + "version": "11.11.0", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz", + "integrity": "sha512-m4HEDZleaaCH+XgDDsPF15Ht6wTLsgDTeR3WYj9Q/k76JtWhrJjcP4+/XlG8LGT/Rol9qUfOIztXeA84ATpqPQ==", + "requires": { + "@babel/helper-module-imports": "^7.16.7", + "@babel/runtime": "^7.18.3", + "@emotion/hash": "^0.9.1", + "@emotion/memoize": "^0.8.1", + "@emotion/serialize": "^1.1.2", + "babel-plugin-macros": "^3.1.0", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.2.0" + }, + "dependencies": { + "escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==" + }, + "source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==" + } + } + }, + "@emotion/cache": { + "version": "11.11.0", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.11.0.tgz", + "integrity": "sha512-P34z9ssTCBi3e9EI1ZsWpNHcfY1r09ZO0rZbRO2ob3ZQMnFI35jB536qoXbkdesr5EUhYi22anuEJuyxifaqAQ==", + "requires": { + "@emotion/memoize": "^0.8.1", + "@emotion/sheet": "^1.2.2", + "@emotion/utils": "^1.2.1", + "@emotion/weak-memoize": "^0.3.1", + "stylis": "4.2.0" + } + }, + "@emotion/hash": { + "version": "0.9.1", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.1.tgz", + "integrity": "sha512-gJB6HLm5rYwSLI6PQa+X1t5CFGrv1J1TWG+sOyMCeKz2ojaj6Fnl/rZEspogG+cvqbt4AE/2eIyD2QfLKTBNlQ==" + }, "@emotion/is-prop-valid": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz", @@ -21757,11 +22018,59 @@ "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==" }, + "@emotion/react": { + "version": "11.11.1", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.11.1.tgz", + "integrity": "sha512-5mlW1DquU5HaxjLkfkGN1GA/fvVGdyHURRiX/0FHl2cfIfRxSOfmxEH5YS43edp0OldZrZ+dkBKbngxcNCdZvA==", + "requires": { + "@babel/runtime": "^7.18.3", + "@emotion/babel-plugin": "^11.11.0", + "@emotion/cache": "^11.11.0", + "@emotion/serialize": "^1.1.2", + "@emotion/use-insertion-effect-with-fallbacks": "^1.0.1", + "@emotion/utils": "^1.2.1", + "@emotion/weak-memoize": "^0.3.1", + "hoist-non-react-statics": "^3.3.1" + } + }, + "@emotion/serialize": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.2.tgz", + "integrity": "sha512-zR6a/fkFP4EAcCMQtLOhIgpprZOwNmCldtpaISpvz348+DP4Mz8ZoKaGGCQpbzepNIUWbq4w6hNZkwDyKoS+HA==", + "requires": { + "@emotion/hash": "^0.9.1", + "@emotion/memoize": "^0.8.1", + "@emotion/unitless": "^0.8.1", + "@emotion/utils": "^1.2.1", + "csstype": "^3.0.2" + } + }, + "@emotion/sheet": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.2.2.tgz", + "integrity": "sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==" + }, "@emotion/unitless": { "version": "0.8.1", "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.1.tgz", "integrity": "sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==" }, + "@emotion/use-insertion-effect-with-fallbacks": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.1.tgz", + "integrity": "sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==", + "requires": {} + }, + "@emotion/utils": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.1.tgz", + "integrity": "sha512-Y2tGf3I+XVnajdItskUCn6LX+VUDmP6lTL4fcqsXAv43dnlbZiuW4MWQW38rW/BVWSE7Q/7+XQocmpnRYILUmg==" + }, + "@emotion/weak-memoize": { + "version": "0.3.1", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.3.1.tgz", + "integrity": "sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww==" + }, "@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", @@ -21824,6 +22133,19 @@ "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.43.0.tgz", "integrity": "sha512-s2UHCoiXfxMvmfzqoN+vrQ84ahUSYde9qNO1MdxmoEhyHWsfmwOpFlwYV+ePJEVc7gFnATGUi376WowX1N7tFg==" }, + "@floating-ui/core": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.3.1.tgz", + "integrity": "sha512-Bu+AMaXNjrpjh41znzHqaz3r2Nr8hHuHZT6V2LBKMhyMl0FgKA62PNYbqnfgmzOhoWZj70Zecisbo4H1rotP5g==" + }, + "@floating-ui/dom": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.4.2.tgz", + "integrity": "sha512-VKmvHVatWnewmGGy+7Mdy4cTJX71Pli6v/Wjb5RQBuq5wjUYx+Ef+kRThi8qggZqDgD8CogCpqhRoVp3+yQk+g==", + "requires": { + "@floating-ui/core": "^1.3.1" + } + }, "@humanwhocodes/config-array": { "version": "0.11.10", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz", @@ -23347,6 +23669,14 @@ "@types/react": "*" } }, + "@types/react-transition-group": { + "version": "4.4.6", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.6.tgz", + "integrity": "sha512-VnCdSxfcm08KjsJVQcfBmhEQAPnLB8G08hAxn39azX1qYBQ/5RVQuoHuKIcfKOdncuaUvEpFKFzEvbtIMsfVew==", + "requires": { + "@types/react": "*" + } + }, "@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -25396,6 +25726,15 @@ "utila": "~0.4" } }, + "dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "requires": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -26457,6 +26796,11 @@ "pkg-dir": "^4.1.0" } }, + "find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -26916,6 +27260,21 @@ "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==" }, + "hoist-non-react-statics": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", + "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "requires": { + "react-is": "^16.7.0" + }, + "dependencies": { + "react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + } + } + }, "hoopy": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz", @@ -29573,6 +29932,11 @@ "fs-monkey": "^1.0.4" } }, + "memoize-one": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz", + "integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==" + }, "meow": { "version": "8.1.2", "resolved": "https://registry.npmjs.org/meow/-/meow-8.1.2.tgz", @@ -31282,6 +31646,33 @@ "workbox-webpack-plugin": "^6.4.1" } }, + "react-select": { + "version": "5.7.3", + "resolved": "https://registry.npmjs.org/react-select/-/react-select-5.7.3.tgz", + "integrity": "sha512-z8i3NCuFFWL3w27xq92rBkVI2onT0jzIIPe480HlBjXJ3b5o6Q+Clp4ydyeKrj9DZZ3lrjawwLC5NGl0FSvUDg==", + "requires": { + "@babel/runtime": "^7.12.0", + "@emotion/cache": "^11.4.0", + "@emotion/react": "^11.8.1", + "@floating-ui/dom": "^1.0.1", + "@types/react-transition-group": "^4.4.0", + "memoize-one": "^6.0.0", + "prop-types": "^15.6.0", + "react-transition-group": "^4.3.0", + "use-isomorphic-layout-effect": "^1.1.2" + } + }, + "react-transition-group": { + "version": "4.4.5", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", + "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + } + }, "read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", @@ -32942,6 +33333,12 @@ "requires-port": "^1.0.0" } }, + "use-isomorphic-layout-effect": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz", + "integrity": "sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==", + "requires": {} + }, "util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", diff --git a/package.json b/package.json index 8dc1d66..bd805ff 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", + "react-select": "^5.7.3", "styled-components": "^6.0.0-rc.5", "web-vitals": "^2.1.4" }, From 26653546da2ce4dffab69ba3b29c96dbce387a55 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sat, 24 Jun 2023 13:43:51 +0900 Subject: [PATCH 006/118] =?UTF-8?q?chore:=20=EC=82=AC=EC=9A=A9=ED=95=98?= =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EC=98=B5=EC=85=98=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .eslintrc.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index 67ca6a5..c07de9c 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -5,7 +5,6 @@ "no-multiple-empty-lines": "error", // 여러 줄 공백 금지 "no-console": ["error", { "allow": ["warn", "error", "info"] }], // console.log() 금지 "eqeqeq": "error", // 일치 연산자 사용 필수 - "dot-notation": "error", // 가능하다면 dot notation 사용 - "no-unused-vars": "error" // 사용하지 않는 변수 금지 + "dot-notation": "error" // 가능하다면 dot notation 사용 } } From 3399375f5ed195fe5cc5a569979be8e4bf3db0fe Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 00:50:59 +0900 Subject: [PATCH 007/118] =?UTF-8?q?design:=20app=20css=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/App.css | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/styles/App.css b/src/styles/App.css index b5c61c9..2ae6c78 100644 --- a/src/styles/App.css +++ b/src/styles/App.css @@ -1,3 +1,17 @@ @tailwind base; @tailwind components; @tailwind utilities; + +html { + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + background-color: #ddd; +} + +body { + width: 390px; + height: 100vh; + background: #ffffff; +} From 4c232c9314dd81c057a81bf3d9d79f9676c2aa1b Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 01:00:25 +0900 Subject: [PATCH 008/118] =?UTF-8?q?refactor:=20=EA=B3=B5=ED=86=B5=EB=90=98?= =?UTF-8?q?=EB=8A=94=20LongButton=20=EC=BD=94=EB=93=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/LongButton.jsx | 23 +++++++++++++++++++++++ src/components/common/MainButton.jsx | 12 ------------ 2 files changed, 23 insertions(+), 12 deletions(-) create mode 100644 src/components/common/LongButton.jsx delete mode 100644 src/components/common/MainButton.jsx diff --git a/src/components/common/LongButton.jsx b/src/components/common/LongButton.jsx new file mode 100644 index 0000000..beee07c --- /dev/null +++ b/src/components/common/LongButton.jsx @@ -0,0 +1,23 @@ +import React from 'react'; +import styled from 'styled-components'; + +const StyledButton = styled.button` + width: 100%; + height: 100%; + border-radius: 55px; + background: ${props => props.background || '#2572E5'}; + color: FFFFFF; + text-align: center; +`; + +function LongButton({ type, contents, onClick, background }) { + return ( +
+ + {contents} + +
+ ); +} + +export default LongButton; diff --git a/src/components/common/MainButton.jsx b/src/components/common/MainButton.jsx deleted file mode 100644 index ca352bd..0000000 --- a/src/components/common/MainButton.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react'; - -function MainButton({ name, customClass }) { - return ( -
- {name} -
- ); -} - -export default MainButton; From 23302fb70c58da4cd439c4fed91e475f270a2117 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 01:48:25 +0900 Subject: [PATCH 009/118] =?UTF-8?q?design:=20=EC=99=80=EC=9D=B4=EC=96=B4?= =?UTF-8?q?=ED=94=84=EB=A0=88=EC=9E=84=20=EB=B3=80=EA=B2=BD=EC=97=90=20?= =?UTF-8?q?=EC=9D=98=ED=95=9C=20css=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit top 47px, bottom 34px 고정 --- src/App.js | 4 ++-- src/styles/App.css | 8 ++++++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/App.js b/src/App.js index 45fd99e..66c3977 100644 --- a/src/App.js +++ b/src/App.js @@ -2,8 +2,8 @@ import './styles/App.css'; function App() { return ( -
-
+
+
); } diff --git a/src/styles/App.css b/src/styles/App.css index 2ae6c78..952a3d0 100644 --- a/src/styles/App.css +++ b/src/styles/App.css @@ -15,3 +15,11 @@ body { height: 100vh; background: #ffffff; } + +.page-wrapper { + width: 390px; + height: 844px; + position: absolute; + top: 50%; + transform: translateY(-50%); +} From f959865fcd9beb644f08e20575b7ef4e2a947a63 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 01:53:08 +0900 Subject: [PATCH 010/118] =?UTF-8?q?refactor:=20=EA=B3=B5=ED=86=B5=EB=90=98?= =?UTF-8?q?=EB=8A=94=20LongButton=20=EC=BD=94=EB=93=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/LongButton.jsx | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/src/components/common/LongButton.jsx b/src/components/common/LongButton.jsx index beee07c..1505c1c 100644 --- a/src/components/common/LongButton.jsx +++ b/src/components/common/LongButton.jsx @@ -1,22 +1,25 @@ import React from 'react'; import styled from 'styled-components'; +const ButtonWrapper = styled.div` + bottom: ${props => props.bottom || '56px'}; +`; + const StyledButton = styled.button` - width: 100%; - height: 100%; - border-radius: 55px; background: ${props => props.background || '#2572E5'}; - color: FFFFFF; - text-align: center; `; -function LongButton({ type, contents, onClick, background }) { +function LongButton({ type, contents, onClick, background, bottom }) { return ( -
- + + {contents} -
+ ); } From bd9bdd799b2645475ce3b8a437556efaec028baf Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 01:56:20 +0900 Subject: [PATCH 011/118] =?UTF-8?q?design:=20design:=20=EA=B6=8C=ED=95=9C?= =?UTF-8?q?=20=EC=84=A4=EC=A0=95=20=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20?= =?UTF-8?q?=EC=B4=88=EC=95=88=20=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../permissionPage/OptionalPermission.jsx | 10 ++++---- src/pages/PermissionPage.jsx | 24 ++++++++++++------- 2 files changed, 20 insertions(+), 14 deletions(-) diff --git a/src/components/permissionPage/OptionalPermission.jsx b/src/components/permissionPage/OptionalPermission.jsx index 7deb7d4..84434f5 100644 --- a/src/components/permissionPage/OptionalPermission.jsx +++ b/src/components/permissionPage/OptionalPermission.jsx @@ -2,11 +2,11 @@ import React from 'react'; function OptionalPermission({ src, title, description }) { return ( -
- alt -
-
{title}
-
{description}
+
+ alt +
+
{title}
+
{description}
); diff --git a/src/pages/PermissionPage.jsx b/src/pages/PermissionPage.jsx index b6a632e..5409f85 100644 --- a/src/pages/PermissionPage.jsx +++ b/src/pages/PermissionPage.jsx @@ -1,6 +1,7 @@ import React from 'react'; import OptionalPermission from '../components/permissionPage/OptionalPermission'; +import LongButton from '../components/common/LongButton'; import { PERMISSION_FIRST_TITLE, @@ -20,18 +21,23 @@ import { PERMISSION_MESSAGE, CONFIRM, } from '../static/constants'; -import MainButton from '../components/common/MainButton'; function PermissionPage() { return ( -
-
-
{PERMISSION_FIRST_TITLE}
-
{PERMISSION_SECOND_TITLE}
+
+
+
+ {PERMISSION_FIRST_TITLE} +
+ {PERMISSION_SECOND_TITLE} +
-
{SELECT_PERMISSION}
-
+
+ {SELECT_PERMISSION} +
+ +
@@ -39,11 +45,11 @@ function PermissionPage() {
-
+
{PERMISSION_MESSAGE}
- +
); } From 744f82582fbdfc59e99797a97b680b0270e13fc3 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 02:15:30 +0900 Subject: [PATCH 012/118] =?UTF-8?q?chore:=20=EC=82=AC=EC=9A=A9=ED=95=98?= =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EC=98=B5=EC=85=98=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .eslintrc.json | 1 - 1 file changed, 1 deletion(-) diff --git a/.eslintrc.json b/.eslintrc.json index c07de9c..4c1fda1 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -3,7 +3,6 @@ "rules": { "no-var": "error", // var 금지 "no-multiple-empty-lines": "error", // 여러 줄 공백 금지 - "no-console": ["error", { "allow": ["warn", "error", "info"] }], // console.log() 금지 "eqeqeq": "error", // 일치 연산자 사용 필수 "dot-notation": "error" // 가능하다면 dot notation 사용 } From a15c0a8ed46ae1afa7060294fb4f20394f0e5cac Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 03:09:28 +0900 Subject: [PATCH 013/118] =?UTF-8?q?rename:=20=EA=B2=BD=EB=A1=9C=20?= =?UTF-8?q?=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/BackButton.jsx | 8 -------- src/components/common/Circle.jsx | 16 ++++++++++++++++ src/components/common/navBar/BackButton.jsx | 13 +++++++++++++ .../registerLocationPage/NearLoacation.jsx | 2 +- src/styles/App.css | 1 + 5 files changed, 31 insertions(+), 9 deletions(-) delete mode 100644 src/components/common/BackButton.jsx create mode 100644 src/components/common/Circle.jsx create mode 100644 src/components/common/navBar/BackButton.jsx diff --git a/src/components/common/BackButton.jsx b/src/components/common/BackButton.jsx deleted file mode 100644 index e55b865..0000000 --- a/src/components/common/BackButton.jsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react'; - -function BackButton() { - // TODO 추후 이미지나 만들어진 아이콘으로 수정 예정 - return ; -} - -export default BackButton; diff --git a/src/components/common/Circle.jsx b/src/components/common/Circle.jsx new file mode 100644 index 0000000..24671e4 --- /dev/null +++ b/src/components/common/Circle.jsx @@ -0,0 +1,16 @@ +import React from 'react'; +import styled from 'styled-components'; + +const Circle = styled.div` + width: 9px; + height: 9px; + border-radius: 50%; + transition: all 0.3s; + background: ${props => props.background || '#2572E5'}; +`; + +function Carousel({ carouselColor }) { + return ; +} + +export default Carousel; diff --git a/src/components/common/navBar/BackButton.jsx b/src/components/common/navBar/BackButton.jsx new file mode 100644 index 0000000..645082c --- /dev/null +++ b/src/components/common/navBar/BackButton.jsx @@ -0,0 +1,13 @@ +import React from 'react'; + +function BackButton({ onClickHandler }) { + return ( + + ); +} + +export default BackButton; diff --git a/src/components/registerLocationPage/NearLoacation.jsx b/src/components/registerLocationPage/NearLoacation.jsx index 83b5c1c..dffef85 100644 --- a/src/components/registerLocationPage/NearLoacation.jsx +++ b/src/components/registerLocationPage/NearLoacation.jsx @@ -1,7 +1,7 @@ import React from 'react'; function NearLoacation({ location }) { - return
{location}
; + return
{location}
; } export default NearLoacation; diff --git a/src/styles/App.css b/src/styles/App.css index 952a3d0..db30784 100644 --- a/src/styles/App.css +++ b/src/styles/App.css @@ -22,4 +22,5 @@ body { position: absolute; top: 50%; transform: translateY(-50%); + background: #ffffff; } From 9d5b77aa8f60dacf8e4e18ad90e05d210cad54d3 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 03:11:59 +0900 Subject: [PATCH 014/118] =?UTF-8?q?rename:=20=ED=8C=8C=EC=9D=BC=EB=AA=85?= =?UTF-8?q?=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/{Circle.jsx => Carousel.jsx} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/components/common/{Circle.jsx => Carousel.jsx} (100%) diff --git a/src/components/common/Circle.jsx b/src/components/common/Carousel.jsx similarity index 100% rename from src/components/common/Circle.jsx rename to src/components/common/Carousel.jsx From a38840a56981a2b7583ed991c9a250f778b7979f Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 03:18:16 +0900 Subject: [PATCH 015/118] =?UTF-8?q?design:=20=EC=9C=84=EC=B9=98=20?= =?UTF-8?q?=EB=93=B1=EB=A1=9D=20=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20?= =?UTF-8?q?=EC=B4=88=EC=95=88=20=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/navBar/SearchBar.jsx | 18 ++++++++++++++++++ src/pages/RegisterLocationPage.jsx | 20 ++++++-------------- 2 files changed, 24 insertions(+), 14 deletions(-) create mode 100644 src/components/common/navBar/SearchBar.jsx diff --git a/src/components/common/navBar/SearchBar.jsx b/src/components/common/navBar/SearchBar.jsx new file mode 100644 index 0000000..ecbd0cc --- /dev/null +++ b/src/components/common/navBar/SearchBar.jsx @@ -0,0 +1,18 @@ +import React from 'react'; +import BackButton from './BackButton'; + +function SearchBar({ placeholder }) { + const moveToPermissionPage = () => {}; + + return ( +
+ + +
+ ); +} + +export default SearchBar; diff --git a/src/pages/RegisterLocationPage.jsx b/src/pages/RegisterLocationPage.jsx index 2c55d71..be83f82 100644 --- a/src/pages/RegisterLocationPage.jsx +++ b/src/pages/RegisterLocationPage.jsx @@ -1,26 +1,18 @@ import React from 'react'; + import NearLoacation from '../components/registerLocationPage/NearLoacation'; +import SearchBar from '../components/common/navBar/SearchBar'; + import { SEARCH_LOCATION, NEAR_LOCATION } from '../static/constants'; -import SearchBar from '../components/common/SearchBar'; function RegisterLocationPage() { return ( -
+
-
{NEAR_LOCATION}
+
{NEAR_LOCATION}
-
- - - - - - - - - - +
From 2c82143af9805bbf6f2d3dd32dd2edbd05396ffe Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 03:18:48 +0900 Subject: [PATCH 016/118] =?UTF-8?q?design:=20=EA=B3=B5=ED=86=B5=20input=20?= =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=83=9D=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/Input.jsx | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 src/components/common/Input.jsx diff --git a/src/components/common/Input.jsx b/src/components/common/Input.jsx new file mode 100644 index 0000000..71dd75f --- /dev/null +++ b/src/components/common/Input.jsx @@ -0,0 +1,23 @@ +import React from 'react'; +import styled from 'styled-components'; + +const StyledInput = styled.input` + width: ${props => props.width || '360px'}; + margin-bottom: ${props => props.mb || 0}; +`; + +function Input({ type, onClick, label, placeholder, width, mb, autoComplete }) { + return ( + + ); +} + +export default Input; From 0df06fc22b193965a2b225a814b862f9abdd49b5 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 03:49:40 +0900 Subject: [PATCH 017/118] =?UTF-8?q?design:=20gap=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/RegisterLocationPage.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/RegisterLocationPage.jsx b/src/pages/RegisterLocationPage.jsx index be83f82..dd571ab 100644 --- a/src/pages/RegisterLocationPage.jsx +++ b/src/pages/RegisterLocationPage.jsx @@ -12,7 +12,7 @@ function RegisterLocationPage() {
{NEAR_LOCATION}
-
+
From cae1b567ca966a3b085d93068b55051354803cdd Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 16:19:50 +0900 Subject: [PATCH 018/118] =?UTF-8?q?design:=20=EA=B2=80=EC=83=89=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20=EC=B4=88=EC=95=88=20?= =?UTF-8?q?=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/navBar/SearchBar.jsx | 3 +- src/components/searchPage/SearchedOutput.jsx | 22 ++++++++++ src/pages/SearchPage.jsx | 46 +++++++++++++++++++- src/static/constants.js | 6 +++ tailwind.config.js | 3 +- 5 files changed, 76 insertions(+), 4 deletions(-) create mode 100644 src/components/searchPage/SearchedOutput.jsx diff --git a/src/components/common/navBar/SearchBar.jsx b/src/components/common/navBar/SearchBar.jsx index ecbd0cc..6b2d98e 100644 --- a/src/components/common/navBar/SearchBar.jsx +++ b/src/components/common/navBar/SearchBar.jsx @@ -7,9 +7,10 @@ function SearchBar({ placeholder }) { return (
+ {/* TODO: placeholder 색상 반응형으로 */}
); diff --git a/src/components/searchPage/SearchedOutput.jsx b/src/components/searchPage/SearchedOutput.jsx new file mode 100644 index 0000000..4105c45 --- /dev/null +++ b/src/components/searchPage/SearchedOutput.jsx @@ -0,0 +1,22 @@ +import React from 'react'; +import { TEMPORARY_SRC } from '../../static/constants'; + +// TODO: 하드코딩되어 있는 값들 모두 수정 필요 +function SearchedOutput() { + return ( +
+ {'searchedImage'} +
+
+
{'프로틴 바/ 다크 초코씨솔트&카라멜넛, 마이프로틴 바'}
+
+ {'서울시 서초구 서초대로'} ㅣ {'20분'} 전 +
+
+
{'20,000'}원
+
+
+ ); +} + +export default SearchedOutput; diff --git a/src/pages/SearchPage.jsx b/src/pages/SearchPage.jsx index edfc729..0e1e556 100644 --- a/src/pages/SearchPage.jsx +++ b/src/pages/SearchPage.jsx @@ -1,7 +1,49 @@ -import React from 'react'; +import React, { useState } from 'react'; +import Select from 'react-select'; +import SearchBar from '../components/common/navBar/SearchBar'; +import SearchedOutput from '../components/searchPage/SearchedOutput'; + +import { ENTER_INPUT, TOTAL_SEARCHED_OUTPUT } from '../static/constants'; + +// TODO: 하드코딩되어 있는 값들 모두 수정 필요 function SearchPage() { - return
SearchPage
; + const options = [ + { value: '인기순', label: '인기순' }, + { value: '최신순', label: '최신순' }, + { value: '낮은 가격순', label: '낮은 가격순' }, + { value: '높은 가격순', label: '높은 가격순' }, + ]; + + const [selectedOption, setSelectedOption] = useState(options[0]); + const [selectedCategory, setSelectedCategory] = useState(TOTAL_SEARCHED_OUTPUT); + + return ( +
+ + +
+ {/* FIXME: height 상의 필요 */} +
+ {selectedCategory} +
+ +
From b9260710e7cd9205612cd1f78cfa5d6bf10e76e2 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 18:01:41 +0900 Subject: [PATCH 020/118] =?UTF-8?q?chore:=20prettier=EC=97=90=EC=84=9C=20?= =?UTF-8?q?=EC=82=AC=EC=9A=A9=ED=95=98=EC=A7=80=20=EC=95=8A=EB=8A=94=20?= =?UTF-8?q?=EC=98=B5=EC=85=98=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .prettierrc.js | 1 - 1 file changed, 1 deletion(-) diff --git a/.prettierrc.js b/.prettierrc.js index b4d2e65..d5fdbf1 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -2,7 +2,6 @@ module.exports = { singleQuote: true, bracketSpacing: true, bracketSameLine: true, - arrowParens: 'avoid', printWidth: 120, tabWidth: 2, }; From 2adb595066bb51cc84a97c2135a4c595e8d7be9f Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 18:46:40 +0900 Subject: [PATCH 021/118] =?UTF-8?q?style:=20=EA=B4=84=ED=98=B8=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/Carousel.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/common/Carousel.jsx b/src/components/common/Carousel.jsx index 24671e4..2f39e20 100644 --- a/src/components/common/Carousel.jsx +++ b/src/components/common/Carousel.jsx @@ -6,7 +6,7 @@ const Circle = styled.div` height: 9px; border-radius: 50%; transition: all 0.3s; - background: ${props => props.background || '#2572E5'}; + background: ${(props) => props.background || '#2572E5'}; `; function Carousel({ carouselColor }) { From 379c69cee23c1736002f7145bd00c235aff64179 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 18:47:17 +0900 Subject: [PATCH 022/118] =?UTF-8?q?style:=20=EA=B4=84=ED=98=B8=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/Input.jsx | 4 ++-- src/components/common/LongButton.jsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/common/Input.jsx b/src/components/common/Input.jsx index 71dd75f..9737b43 100644 --- a/src/components/common/Input.jsx +++ b/src/components/common/Input.jsx @@ -2,8 +2,8 @@ import React from 'react'; import styled from 'styled-components'; const StyledInput = styled.input` - width: ${props => props.width || '360px'}; - margin-bottom: ${props => props.mb || 0}; + width: ${(props) => props.width || '360px'}; + margin-bottom: ${(props) => props.mb || 0}; `; function Input({ type, onClick, label, placeholder, width, mb, autoComplete }) { diff --git a/src/components/common/LongButton.jsx b/src/components/common/LongButton.jsx index 1505c1c..a78b7ec 100644 --- a/src/components/common/LongButton.jsx +++ b/src/components/common/LongButton.jsx @@ -2,11 +2,11 @@ import React from 'react'; import styled from 'styled-components'; const ButtonWrapper = styled.div` - bottom: ${props => props.bottom || '56px'}; + bottom: ${(props) => props.bottom || '56px'}; `; const StyledButton = styled.button` - background: ${props => props.background || '#2572E5'}; + background: ${(props) => props.background || '#2572E5'}; `; function LongButton({ type, contents, onClick, background, bottom }) { From 1ea49a390beb1bf51b0de58d43cb8f5788cc4419 Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 18:50:42 +0900 Subject: [PATCH 023/118] =?UTF-8?q?design:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20=EC=B4=88?= =?UTF-8?q?=EC=95=88=20=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/Category.jsx | 15 +++++++++++++ src/components/common/CategoryList.jsx | 30 ++++++++++++++++++++++++++ src/pages/CategoryPage.jsx | 24 +++++++++++++++++++++ 3 files changed, 69 insertions(+) create mode 100644 src/components/common/Category.jsx create mode 100644 src/components/common/CategoryList.jsx create mode 100644 src/pages/CategoryPage.jsx diff --git a/src/components/common/Category.jsx b/src/components/common/Category.jsx new file mode 100644 index 0000000..409004a --- /dev/null +++ b/src/components/common/Category.jsx @@ -0,0 +1,15 @@ +import React from 'react'; + +function Category({ src, firstName, lastName = '' }) { + return ( +
+ +
{firstName}
+
{lastName}
+
+ ); +} + +export default Category; diff --git a/src/components/common/CategoryList.jsx b/src/components/common/CategoryList.jsx new file mode 100644 index 0000000..e5cc279 --- /dev/null +++ b/src/components/common/CategoryList.jsx @@ -0,0 +1,30 @@ +import React from 'react'; + +import Category from './Category'; +import { TEMPORARY_SRC } from '../../static/constants'; + +function CategoryList() { + return ( +
+ + + + + + + + + + + + + + + + + +
+ ); +} + +export default CategoryList; diff --git a/src/pages/CategoryPage.jsx b/src/pages/CategoryPage.jsx new file mode 100644 index 0000000..fe9fd75 --- /dev/null +++ b/src/pages/CategoryPage.jsx @@ -0,0 +1,24 @@ +import React from 'react'; + +import SearchBar from '../components/common/navBar/SearchBar'; +import CategoryList from '../components/common/CategoryList'; + +import { ENTER_INPUT } from '../static/constants'; + +function CategoryPage() { + return ( +
+ + +
카테고리
+ +
+ +
+ + {/* TODO: 하단 NavBar 추가 예정 */} +
+ ); +} + +export default CategoryPage; From 2b21d77c70bfff8741de67e6589aded30b08694e Mon Sep 17 00:00:00 2001 From: Tory <88531407+1two13@users.noreply.github.com> Date: Sun, 25 Jun 2023 21:18:09 +0900 Subject: [PATCH 024/118] =?UTF-8?q?design:=20=EA=B8=80=20=EC=9E=91?= =?UTF-8?q?=EC=84=B1=20=ED=8E=98=EC=9D=B4=EC=A7=80=20CSS=20=EC=B4=88?= =?UTF-8?q?=EC=95=88=20=EC=99=84=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/writingPage/Input.jsx | 11 +++ src/pages/WritingPage.jsx | 103 +++++++++++++++++++++++++++ src/static/constants.js | 18 +++++ tailwind.config.js | 1 + 4 files changed, 133 insertions(+) create mode 100644 src/components/writingPage/Input.jsx create mode 100644 src/pages/WritingPage.jsx diff --git a/src/components/writingPage/Input.jsx b/src/components/writingPage/Input.jsx new file mode 100644 index 0000000..92d4ba8 --- /dev/null +++ b/src/components/writingPage/Input.jsx @@ -0,0 +1,11 @@ +import React from 'react'; + +function Input({ placeholder }) { + return ( +
+ +
+ ); +} + +export default Input; diff --git a/src/pages/WritingPage.jsx b/src/pages/WritingPage.jsx new file mode 100644 index 0000000..10aab3a --- /dev/null +++ b/src/pages/WritingPage.jsx @@ -0,0 +1,103 @@ +import React, { useRef, useState } from 'react'; + +import LongButton from '../components/common/LongButton'; +import Input from '../components/writingPage/Input'; + +import { + MAX_IMAGES, + ARTICLE_TITLE, + CATEGORY, + TOTAL_AMOUNT, + MAXIMUM_PEOPLE, + DESIRED_PLACE, + PLEASE_WRITE_TEXT, + DONE, +} from '../static/constants'; + +function WritingPage() { + const imgRef = useRef(null); + const [count, setCount] = useState(1); + + const addImages = () => imgRef.current?.click(); + const addImagesHandler = (e) => {}; + + return ( +
+
+
+ + +
+ + +
+ + +
+ +
+ + +
+
{MAXIMUM_PEOPLE}
+
+ +
{count}
+ +
+
+ + +