From c00dcbdb7c10117cef6e9e328219fdcd3d75c17d Mon Sep 17 00:00:00 2001 From: limkhl Date: Wed, 22 Sep 2021 02:34:25 +0900 Subject: [PATCH 1/8] =?UTF-8?q?init:=20SPA=20=EC=82=AC=EC=9D=B4=ED=8A=B8?= =?UTF-8?q?=20=EC=84=B8=ED=8C=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 180 +++ eslintrc.js | 14 + index.html | 27 + package.json | 16 + prettierrc.json | 10 + project1-colors/src/Project1Page.js | 18 + .../src/Project2Page.js | 26 + .../src/Project3Page.js | 13 + src/assets/favicon.ico | Bin 0 -> 1150 bytes src/components/App.js | 55 + src/data/projectList.js | 5 + src/layouts/Header.js | 12 + src/main.js | 5 + src/pages/HomePage.js | 24 + src/pages/NotFoundPage.js | 15 + src/styles/project1.css | 18 + src/styles/project2.css | 54 + src/styles/project3.css | 74 + src/styles/style.css | 113 ++ yarn.lock | 1355 +++++++++++++++++ 20 files changed, 2034 insertions(+) create mode 100644 .gitignore create mode 100644 eslintrc.js create mode 100644 index.html create mode 100644 package.json create mode 100644 prettierrc.json create mode 100644 project1-colors/src/Project1Page.js create mode 100644 project2-HexColorsGradient/src/Project2Page.js create mode 100644 project3-RandomQuoteGenerator/src/Project3Page.js create mode 100644 src/assets/favicon.ico create mode 100644 src/components/App.js create mode 100644 src/data/projectList.js create mode 100644 src/layouts/Header.js create mode 100644 src/main.js create mode 100644 src/pages/HomePage.js create mode 100644 src/pages/NotFoundPage.js create mode 100644 src/styles/project1.css create mode 100644 src/styles/project2.css create mode 100644 src/styles/project3.css create mode 100644 src/styles/style.css create mode 100644 yarn.lock diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..9a94f57 --- /dev/null +++ b/.gitignore @@ -0,0 +1,180 @@ +# Created by https://www.toptal.com/developers/gitignore/api/node,yarn + +# Edit at https://www.toptal.com/developers/gitignore?templates=node,yarn + +### Node + +# Logs + +logs +_.log +npm-debug.log_ +yarn-debug.log* +yarn-error.log* +lerna-debug.log* +.pnpm-debug.log* + +# Diagnostic reports (https://nodejs.org/api/report.html) + +report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json + +# Runtime data + +pids +_.pid +_.seed +\*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover + +lib-cov + +# Coverage directory used by tools like istanbul + +coverage +\*.lcov + +# nyc test coverage + +.nyc_output + +# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) + +.grunt + +# Bower dependency directory (https://bower.io/) + +bower_components + +# node-waf configuration + +.lock-wscript + +# Compiled binary addons (https://nodejs.org/api/addons.html) + +build/Release + +# Dependency directories + +node_modules/ +jspm_packages/ + +# Snowpack dependency directory (https://snowpack.dev/) + +web_modules/ + +# TypeScript cache + +\*.tsbuildinfo + +# Optional npm cache directory + +.npm + +# Optional eslint cache + +.eslintcache + +# Microbundle cache + +.rpt2_cache/ +.rts2_cache_cjs/ +.rts2_cache_es/ +.rts2_cache_umd/ + +# Optional REPL history + +.node_repl_history + +# Output of 'npm pack' + +\*.tgz + +# Yarn Integrity file + +.yarn-integrity + +# dotenv environment variables file + +.env +.env.test +.env.production + +# parcel-bundler cache (https://parceljs.org/) + +.cache +.parcel-cache + +# Next.js build output + +.next +out + +# Nuxt.js build / generate output + +.nuxt +dist + +# Gatsby files + +.cache/ + +# Comment in the public line in if your project uses Gatsby and not Next.js + +# https://nextjs.org/blog/next-9-1#public-directory-support + +# public + +# vuepress build output + +.vuepress/dist + +# Serverless directories + +.serverless/ + +# FuseBox cache + +.fusebox/ + +# DynamoDB Local files + +.dynamodb/ + +# TernJS port file + +.tern-port + +# Stores VSCode versions used for testing VSCode extensions + +.vscode-test + +# yarn v2 + +.yarn/cache +.yarn/unplugged +.yarn/build-state.yml +.yarn/install-state.gz +.pnp.\* + +### yarn + +# https://yarnpkg.com/advanced/qa#which-files-should-be-gitignored + +.yarn/\* +!.yarn/releases +!.yarn/plugins +!.yarn/sdks +!.yarn/versions + +# if you are NOT using Zero-installs, then: + +# comment the following lines + +!.yarn/cache + +# and uncomment the following lines + +# .pnp.\* + +# End of https://www.toptal.com/developers/gitignore/api/node,yarn diff --git a/eslintrc.js b/eslintrc.js new file mode 100644 index 0000000..d37fff3 --- /dev/null +++ b/eslintrc.js @@ -0,0 +1,14 @@ +// eslint + prettier ์„ค์ • ์ฐธ๊ณ  : https://pravusid.kr/javascript/2019/03/10/eslint-prettier.html + +module.exports = { + env: { + browser: true, + es2021: true, + }, + extends: ['google', 'plugin:prettier/recommended'], + parserOptions: { + ecmaVersion: 12, + sourceType: 'module', + }, + rules: {}, +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..cf94a32 --- /dev/null +++ b/index.html @@ -0,0 +1,27 @@ + + + + + + + JS Mini Project 25 + + + + + + +
+ + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..2c3a1b3 --- /dev/null +++ b/package.json @@ -0,0 +1,16 @@ +{ + "scripts": { + "start": "node main.js", + "lint": "eslint *.js", + "lint:fix": "eslint --fix *.js" + }, + "devDependencies": { + "eslint": "^7.32.0", + "eslint-config-airbnb-base": "^14.2.1", + "eslint-config-google": "^0.14.0", + "eslint-config-prettier": "^8.3.0", + "eslint-plugin-import": "^2.24.0", + "eslint-plugin-prettier": "^3.4.0", + "prettier": "^2.3.2" + } +} diff --git a/prettierrc.json b/prettierrc.json new file mode 100644 index 0000000..de28c84 --- /dev/null +++ b/prettierrc.json @@ -0,0 +1,10 @@ +{ + "printWidth": 100, + "tabWidth": 2, + "singleQuote": true, + "trailingComma": "all", + "bracketSpacing": true, + "semi": true, + "useTabs": false, + "endOfLine": "lf" + } \ No newline at end of file diff --git a/project1-colors/src/Project1Page.js b/project1-colors/src/Project1Page.js new file mode 100644 index 0000000..c8f5ff9 --- /dev/null +++ b/project1-colors/src/Project1Page.js @@ -0,0 +1,18 @@ +import Button from "./Button.js"; + +export default function Project1Page({ $target }) { + const $page = document.createElement("div"); + + $page.className = "project1 page"; + + new Button({ + $target: $page, + onClick: (colorCode) => { + $page.style.backgroundColor = `#${colorCode}`; + }, + }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/project2-HexColorsGradient/src/Project2Page.js b/project2-HexColorsGradient/src/Project2Page.js new file mode 100644 index 0000000..e5ba33c --- /dev/null +++ b/project2-HexColorsGradient/src/Project2Page.js @@ -0,0 +1,26 @@ +import Button from "./Button.js"; +import Sign from "./Sign.js"; + +export default function Project2Page({ $target }) { + const $page = document.createElement("div"); + + $page.className = "project2 page"; + + const signBoard = new Sign({ $target: $page }); + + new Button({ + $target: $page, + onClick: (direction, startColor, endColor) => { + $page.style.background = `linear-gradient(to ${direction}, #${startColor}, #${endColor})`; + signBoard.setState({ + ...signBoard.state, + direction, + colorCode: { start: startColor, end: endColor }, + }); + }, + }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/project3-RandomQuoteGenerator/src/Project3Page.js b/project3-RandomQuoteGenerator/src/Project3Page.js new file mode 100644 index 0000000..9476a45 --- /dev/null +++ b/project3-RandomQuoteGenerator/src/Project3Page.js @@ -0,0 +1,13 @@ +import App from "./App.js"; + +export default function Project3Page({ $target }) { + const $page = document.createElement("div"); + + $page.className = "project3 page"; + + new App({ $target: $page }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/src/assets/favicon.ico b/src/assets/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..286cd9748a222d64a6e9c4cd3636d5e25e19e53c GIT binary patch literal 1150 zcmds1O(;ZB6u!#NX0ouhv{b}S6j>M>DVA1}F{b=0nv%c#l;5PJrryk$nO?>q3`5a~ zL1G&D&6NBNNi##4n)%#&r&o`jjUDIp-E-eL=R5bDdtQ%_1p25{gs!QiDv^*BLP#0~ zHBn34P8A{4mz)#_f2WI}NymSHd%72LIQumaYBF%{a^Q4z7OyvcoUPems?AdDHypT! zT%Im`U^$pB^yM(=vcJT!{7hKhpJvAD_y`5z9MJL@OIT+Oh$VcQY z1lFffo2kebThy>M7T{#bipYByVoMQhO@(;zU*cxpjf;&1*xO1JxvZYI=K$`#2UzN< zK>8plE7~(UKe3trLuyfg5_s!#cwvz9!Yw17mTm1=K&6CCe literal 0 HcmV?d00001 diff --git a/src/components/App.js b/src/components/App.js new file mode 100644 index 0000000..0edeb01 --- /dev/null +++ b/src/components/App.js @@ -0,0 +1,55 @@ +import Header from "../layouts/Header.js"; + +import HomePage from "../pages/HomePage.js"; +import NotFoundPage from "../pages/NotFoundPage.js"; +import Project1Page from "../../project1-colors/src/Project1Page.js"; +import Project2Page from "../../project2-HexColorsGradient/src/Project2Page.js"; +import Project3Page from "../../project3-RandomQuoteGenerator/src/Project3Page.js"; + +export default function App({ $target }) { + new Header({ $target }); + + const $main = document.createElement("main"); + $target.append($main); + + const homePage = new HomePage({ $target: $main }); + const notFoundPage = new NotFoundPage({ $target: $main }); + const project1Page = new Project1Page({ $target: $main }); + const project2Page = new Project2Page({ $target: $main }); + const project3Page = new Project3Page({ $target: $main }); + + this.route = () => { + $main.innerHTML = ``; + const { pathname } = location; + + if (pathname === `/`) { + homePage.render(); + } else if (pathname.indexOf(`/project/`) === 0) { + const [, , projectId] = pathname.split("/"); + switch (parseInt(projectId)) { + case 1: + project1Page.render(); + break; + case 2: + project2Page.render(); + break; + case 3: + project3Page.render(); + break; + } + } else { + notFoundPage.render(); + } + }; + + this.route(); + + window.addEventListener("click", (e) => { + if (e.target.className === "link") { + e.preventDefault(); + history.pushState(null, null, e.target.href); + + this.route(); + } + }); +} diff --git a/src/data/projectList.js b/src/data/projectList.js new file mode 100644 index 0000000..d3c72e6 --- /dev/null +++ b/src/data/projectList.js @@ -0,0 +1,5 @@ +export const projectList = [ + { id: 1, title: "Colors" }, + { id: 2, title: "Hex Colors Gradient" }, + { id: 3, title: "Random Quote Generator" }, +]; diff --git a/src/layouts/Header.js b/src/layouts/Header.js new file mode 100644 index 0000000..3ecb364 --- /dev/null +++ b/src/layouts/Header.js @@ -0,0 +1,12 @@ +export default function Header({ $target }) { + const $header = document.createElement("header"); + $target.append($header); + + this.render = () => { + $header.innerHTML = /* html */ ` +

๐Ÿ  Lim's 25 JavaScript Mini Project ๐Ÿ 

+ `; + }; + + this.render(); +} diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..cbd472b --- /dev/null +++ b/src/main.js @@ -0,0 +1,5 @@ +import App from "./components/App.js"; + +const $target = document.querySelector("#app"); + +new App({ $target }); diff --git a/src/pages/HomePage.js b/src/pages/HomePage.js new file mode 100644 index 0000000..b3ed3c5 --- /dev/null +++ b/src/pages/HomePage.js @@ -0,0 +1,24 @@ +import { projectList } from "../data/projectList.js"; + +export default function HomePage({ $target }) { + const $page = document.createElement("div"); + $page.className = "home"; + + this.state = projectList; + + this.render = () => { + $page.innerHTML = /* html */ ` + + `; + + $target.append($page); + }; +} diff --git a/src/pages/NotFoundPage.js b/src/pages/NotFoundPage.js new file mode 100644 index 0000000..6b57c54 --- /dev/null +++ b/src/pages/NotFoundPage.js @@ -0,0 +1,15 @@ +export default function NotFoundPage({ $target }) { + const $page = document.createElement("div"); + $page.className = "notFound page"; + + this.render = () => { + $page.innerHTML = /* html */ ` +
+

โ›” Not Found โ›”

+

์ž˜๋ชป๋œ ์ ‘๊ทผ์ž…๋‹ˆ๋‹ค

+
+ `; + + $target.append($page); + }; +} diff --git a/src/styles/project1.css b/src/styles/project1.css new file mode 100644 index 0000000..26219aa --- /dev/null +++ b/src/styles/project1.css @@ -0,0 +1,18 @@ +.project1 button { + padding: 10px 15px; + background-color: transparent; + border-radius: 5px; + cursor: pointer; + outline: 0; + color: rgb(52, 58, 64); + font-size: 16px; + border: 1px solid rgb(52, 58, 64); + transition: all 0.2s; + box-shadow: 0px 0px 0px 5px rgb(255, 255, 255, 0.8); +} + +.project1 button:hover { + color: white; + font-weight: 500; + background-color: rgb(52, 58, 64); +} diff --git a/src/styles/project2.css b/src/styles/project2.css new file mode 100644 index 0000000..0cf72c6 --- /dev/null +++ b/src/styles/project2.css @@ -0,0 +1,54 @@ +:root .project2 { + --text-start-color: rgb(52, 58, 64); + --text-end-color: white; + --button-color: white; + --button-hover-color: rgb(52, 58, 64); + --button-font-color: rgb(52, 58, 64); + --button-border-color: rgb(52, 58, 64); +} + +.project2 div { + text-align: center; + animation: 3s ease-in-out 1s infinite alternate changeFontColor; + color: var(--text-start-color); +} + +.project2 h1 { + font-size: 2rem; + margin-bottom: 100px; + line-height: 3rem; +} + +.project2 h2 { + font-size: 1.6rem; + margin-bottom: 30px; +} + +.project2 button { + padding: 10px 15px; + background-color: var(--button-color); + border-radius: 5px; + cursor: pointer; + outline: 0; + color: var(--button-font-color); + font-size: 16px; + border: 1px solid var(--button-border-color); + transition: all 0.2s; + box-shadow: 0px 0px 0px 5px rgb(255, 255, 255, 0.8); +} + +.project2 button:hover { + color: white; + font-weight: 500; + background-color: var(--button-hover-color); +} + +@keyframes changeFontColor { + from { + color: var(--text-start-color); + } + + to { + color: var(--text-end-color); + } +} diff --git a/src/styles/project3.css b/src/styles/project3.css new file mode 100644 index 0000000..e3bae4b --- /dev/null +++ b/src/styles/project3.css @@ -0,0 +1,74 @@ +@import url("https://fonts.googleapis.com/css2?family=Caveat&family=Dancing+Script&display=swap"); + +:root .project3 { + --background-gradient: radial-gradient(#2b8fb4, #67489f); + --box-border-color: #06bdc1; + --button-color: #17a2b8; + --button-hover-color: #138496; + --button-font-color: white; + --button-border-color: #117a8b; + --font-quote: "Caveat", cursive; + --font-author: "Dancing Script", cursive; +} + +.project3 { + background: var(--background-gradient); + font-weight: normal; + letter-spacing: 0; +} + +.project3 .quoteContainer { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + width: 700px; + min-height: 350px; + padding: 50px; + box-sizing: border-box; + background-color: white; + margin-bottom: 30px; + border: 10px solid var(--box-border-color); + border-radius: 10px; + box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.9); +} + +.project3 .quoteContainer .quoteArea { + font-family: var(--font-quote); + font-size: 1.8rem; + text-align: center; + margin-bottom: 30px; +} + +.project3 .quoteContainer .authorArea { + font-family: var(--font-author); + font-size: 2rem; +} + +.project3 button { + padding: 10px 15px; + background-color: var(--button-color); + border-radius: 5px; + cursor: pointer; + outline: 0; + color: var(--button-font-color); + font-size: 1rem; + border: 1px solid var(--button-border-color); + transition: all 0.2s; +} + +.project3 button:hover { + color: white; + font-weight: 500; + background-color: var(--button-hover-color); +} + +@media screen and (max-width: 1000px) { + .project3 { + padding: 0 100px; + } + + .project3 .quoteContainer { + width: 100%; + } +} diff --git a/src/styles/style.css b/src/styles/style.css new file mode 100644 index 0000000..54c53f3 --- /dev/null +++ b/src/styles/style.css @@ -0,0 +1,113 @@ +@import url("./project1.css"); +@import url("./project2.css"); +@import url("./project3.css"); + +:root { + --primary-color: #306ba4; + --highlight-color: #31d2f7; + --border-radius: 1rem; +} + +* { + box-sizing: border-box; +} + +a { + text-decoration: none; + color: black; + display: inline-block; + width: 100%; +} + +body { + font-family: "Noto Sans KR", sans-serif; + font-weight: bold; + letter-spacing: -1px; +} + +#app { + display: flex; + width: 100vw; + height: 100vh; + flex-direction: column; + justify-content: center; + align-items: center; +} + +main { + display: flex; + width: 100%; + flex-grow: 1; + justify-content: center; + align-items: center; + background-color: transparent; +} + +header { + width: 100%; + position: sticky; + font-size: 1.4rem; + text-align: center; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); +} + +header a { + padding: 1.4rem; +} + +header a:hover { + color: var(--highlight-color); +} + +.home { + width: 100%; + height: 100%; + background-color: var(--primary-color); + display: flex; + justify-content: center; + align-items: center; +} + +.home .homeList li { + font-size: 1.2rem; + margin: 1rem; + background-color: white; + border-radius: var(--border-radius); +} + +.home .homeList li a { + padding: 0.5rem 2rem; +} + +.home .homeList li a:hover { + color: var(--highlight-color); +} + +.page { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.notFound { + background-color: tomato; +} + +.notFound .noticeBox { + padding: 1.6rem; + background-color: white; + text-align: center; + border-radius: var(--border-radius); +} + +.notFound h2 { + font-size: 2rem; + margin-bottom: 1.4rem; +} + +.notFound p { + font-size: 1.4rem; +} diff --git a/yarn.lock b/yarn.lock new file mode 100644 index 0000000..838c56e --- /dev/null +++ b/yarn.lock @@ -0,0 +1,1355 @@ +# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. +# yarn lockfile v1 + + +"@babel/code-frame@7.12.11": + version "7.12.11" + resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.12.11.tgz#f4ad435aa263db935b8f10f2c552d23fb716a63f" + integrity sha512-Zt1yodBx1UcyiePMSkWnU4hPqhwq7hGi2nFL1LeA3EUl+q2LQx16MISgJ0+z7dnmgvP9QtIleuETGOiOH1RcIw== + dependencies: + "@babel/highlight" "^7.10.4" + +"@babel/helper-validator-identifier@^7.14.5": + version "7.14.9" + resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz#6654d171b2024f6d8ee151bf2509699919131d48" + integrity sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g== + +"@babel/highlight@^7.10.4": + version "7.14.5" + resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.14.5.tgz#6861a52f03966405001f6aa534a01a24d99e8cd9" + integrity sha512-qf9u2WFWVV0MppaL877j2dBtQIDgmidgjGk5VIMw3OadXvYaXn66U1BFlH2t4+t3i+8PhedppRv+i40ABzd+gg== + dependencies: + "@babel/helper-validator-identifier" "^7.14.5" + chalk "^2.0.0" + js-tokens "^4.0.0" + +"@eslint/eslintrc@^0.4.3": + version "0.4.3" + resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-0.4.3.tgz#9e42981ef035beb3dd49add17acb96e8ff6f394c" + integrity sha512-J6KFFz5QCYUJq3pf0mjEcCJVERbzv71PUIDczuh9JkwGEzced6CO5ADLHB1rbf/+oPBtoPfMYNOpGDzCANlbXw== + dependencies: + ajv "^6.12.4" + debug "^4.1.1" + espree "^7.3.0" + globals "^13.9.0" + ignore "^4.0.6" + import-fresh "^3.2.1" + js-yaml "^3.13.1" + minimatch "^3.0.4" + strip-json-comments "^3.1.1" + +"@humanwhocodes/config-array@^0.5.0": + version "0.5.0" + resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.5.0.tgz#1407967d4c6eecd7388f83acf1eaf4d0c6e58ef9" + integrity sha512-FagtKFz74XrTl7y6HCzQpwDfXP0yhxe9lHLD1UZxjvZIcbyRz8zTFF/yYNfSfzU414eDwZ1SrO0Qvtyf+wFMQg== + dependencies: + "@humanwhocodes/object-schema" "^1.2.0" + debug "^4.1.1" + minimatch "^3.0.4" + +"@humanwhocodes/object-schema@^1.2.0": + version "1.2.0" + resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.0.tgz#87de7af9c231826fdd68ac7258f77c429e0e5fcf" + integrity sha512-wdppn25U8z/2yiaT6YGquE6X8sSv7hNMWSXYSSU1jGv/yd6XqjXgTDJ8KP4NgjTXfJ3GbRjeeb8RTV7a/VpM+w== + +acorn-jsx@^5.3.1: + version "5.3.2" + resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937" + integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ== + +acorn@^7.4.0: + version "7.4.1" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa" + integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A== + +ajv@^6.10.0, ajv@^6.12.4: + version "6.12.6" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4" + integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g== + dependencies: + fast-deep-equal "^3.1.1" + fast-json-stable-stringify "^2.0.0" + json-schema-traverse "^0.4.1" + uri-js "^4.2.2" + +ajv@^8.0.1: + version "8.6.2" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.6.2.tgz#2fb45e0e5fcbc0813326c1c3da535d1881bb0571" + integrity sha512-9807RlWAgT564wT+DjeyU5OFMPjmzxVobvDFmNAhY+5zD6A2ly3jDp6sgnfyDtlIQ+7H97oc/DGCzzfu9rjw9w== + dependencies: + fast-deep-equal "^3.1.1" + json-schema-traverse "^1.0.0" + require-from-string "^2.0.2" + uri-js "^4.2.2" + +ansi-colors@^4.1.1: + version "4.1.1" + resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-4.1.1.tgz#cbb9ae256bf750af1eab344f229aa27fe94ba348" + integrity sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA== + +ansi-regex@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.0.tgz#388539f55179bf39339c81af30a654d69f87cb75" + integrity sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg== + +ansi-styles@^3.2.1: + version "3.2.1" + resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d" + integrity sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA== + dependencies: + color-convert "^1.9.0" + +ansi-styles@^4.0.0, ansi-styles@^4.1.0: + version "4.3.0" + resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-4.3.0.tgz#edd803628ae71c04c85ae7a0906edad34b648937" + integrity sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg== + dependencies: + color-convert "^2.0.1" + +argparse@^1.0.7: + version "1.0.10" + resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911" + integrity sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg== + dependencies: + sprintf-js "~1.0.2" + +array-includes@^3.1.3: + version "3.1.3" + resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.3.tgz#c7f619b382ad2afaf5326cddfdc0afc61af7690a" + integrity sha512-gcem1KlBU7c9rB+Rq8/3PPKsK2kjqeEBa3bD5kkQo4nYlOHQCJqIJFqBXDEfwaRuYTT4E+FxA9xez7Gf/e3Q7A== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.3" + es-abstract "^1.18.0-next.2" + get-intrinsic "^1.1.1" + is-string "^1.0.5" + +array.prototype.flat@^1.2.4: + version "1.2.4" + resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.2.4.tgz#6ef638b43312bd401b4c6199fdec7e2dc9e9a123" + integrity sha512-4470Xi3GAPAjZqFcljX2xzckv1qeKPizoNkiS0+O4IoPR2ZNpcjE0pkhdihlDouK+x6QOast26B4Q/O9DJnwSg== + dependencies: + call-bind "^1.0.0" + define-properties "^1.1.3" + es-abstract "^1.18.0-next.1" + +astral-regex@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-2.0.0.tgz#483143c567aeed4785759c0865786dc77d7d2e31" + integrity sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ== + +balanced-match@^1.0.0: + version "1.0.2" + resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" + integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw== + +brace-expansion@^1.1.7: + version "1.1.11" + resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd" + integrity sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA== + dependencies: + balanced-match "^1.0.0" + concat-map "0.0.1" + +call-bind@^1.0.0, call-bind@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c" + integrity sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA== + dependencies: + function-bind "^1.1.1" + get-intrinsic "^1.0.2" + +callsites@^3.0.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73" + integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ== + +chalk@^2.0.0: + version "2.4.2" + resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424" + integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ== + dependencies: + ansi-styles "^3.2.1" + escape-string-regexp "^1.0.5" + supports-color "^5.3.0" + +chalk@^4.0.0: + version "4.1.2" + resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01" + integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA== + dependencies: + ansi-styles "^4.1.0" + supports-color "^7.1.0" + +color-convert@^1.9.0: + version "1.9.3" + resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8" + integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg== + dependencies: + color-name "1.1.3" + +color-convert@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-2.0.1.tgz#72d3a68d598c9bdb3af2ad1e84f21d896abd4de3" + integrity sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ== + dependencies: + color-name "~1.1.4" + +color-name@1.1.3: + version "1.1.3" + resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25" + integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU= + +color-name@~1.1.4: + version "1.1.4" + resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2" + integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA== + +concat-map@0.0.1: + version "0.0.1" + resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b" + integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s= + +confusing-browser-globals@^1.0.10: + version "1.0.10" + resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.10.tgz#30d1e7f3d1b882b25ec4933d1d1adac353d20a59" + integrity sha512-gNld/3lySHwuhaVluJUKLePYirM3QNCKzVxqAdhJII9/WXKVX5PURzMVJspS1jTslSqjeuG4KMVTSouit5YPHA== + +cross-spawn@^7.0.2: + version "7.0.3" + resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6" + integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w== + dependencies: + path-key "^3.1.0" + shebang-command "^2.0.0" + which "^2.0.1" + +debug@^2.6.9: + version "2.6.9" + resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f" + integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== + dependencies: + ms "2.0.0" + +debug@^3.2.7: + version "3.2.7" + resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a" + integrity sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ== + dependencies: + ms "^2.1.1" + +debug@^4.0.1, debug@^4.1.1: + version "4.3.2" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.2.tgz#f0a49c18ac8779e31d4a0c6029dfb76873c7428b" + integrity sha512-mOp8wKcvj7XxC78zLgw/ZA+6TSgkoE2C/ienthhRD298T7UNwAg9diBpLRxC0mOezLl4B0xV7M0cCO6P/O0Xhw== + dependencies: + ms "2.1.2" + +deep-is@^0.1.3: + version "0.1.3" + resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34" + integrity sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ= + +define-properties@^1.1.3: + version "1.1.3" + resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1" + integrity sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ== + dependencies: + object-keys "^1.0.12" + +doctrine@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.1.0.tgz#5cd01fc101621b42c4cd7f5d1a66243716d3f39d" + integrity sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw== + dependencies: + esutils "^2.0.2" + +doctrine@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961" + integrity sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w== + dependencies: + esutils "^2.0.2" + +emoji-regex@^8.0.0: + version "8.0.0" + resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-8.0.0.tgz#e818fd69ce5ccfcb404594f842963bf53164cc37" + integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A== + +enquirer@^2.3.5: + version "2.3.6" + resolved "https://registry.yarnpkg.com/enquirer/-/enquirer-2.3.6.tgz#2a7fe5dd634a1e4125a975ec994ff5456dc3734d" + integrity sha512-yjNnPr315/FjS4zIsUxYguYUPP2e1NK4d7E7ZOLiyYCcbFBiTMyID+2wvm2w6+pZ/odMA7cRkjhsPbltwBOrLg== + dependencies: + ansi-colors "^4.1.1" + +error-ex@^1.3.1: + version "1.3.2" + resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf" + integrity sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g== + dependencies: + is-arrayish "^0.2.1" + +es-abstract@^1.18.0-next.1, es-abstract@^1.18.0-next.2, es-abstract@^1.18.2: + version "1.18.5" + resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.18.5.tgz#9b10de7d4c206a3581fd5b2124233e04db49ae19" + integrity sha512-DDggyJLoS91CkJjgauM5c0yZMjiD1uK3KcaCeAmffGwZ+ODWzOkPN4QwRbsK5DOFf06fywmyLci3ZD8jLGhVYA== + dependencies: + call-bind "^1.0.2" + es-to-primitive "^1.2.1" + function-bind "^1.1.1" + get-intrinsic "^1.1.1" + has "^1.0.3" + has-symbols "^1.0.2" + internal-slot "^1.0.3" + is-callable "^1.2.3" + is-negative-zero "^2.0.1" + is-regex "^1.1.3" + is-string "^1.0.6" + object-inspect "^1.11.0" + object-keys "^1.1.1" + object.assign "^4.1.2" + string.prototype.trimend "^1.0.4" + string.prototype.trimstart "^1.0.4" + unbox-primitive "^1.0.1" + +es-to-primitive@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a" + integrity sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA== + dependencies: + is-callable "^1.1.4" + is-date-object "^1.0.1" + is-symbol "^1.0.2" + +escape-string-regexp@^1.0.5: + version "1.0.5" + resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4" + integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ= + +escape-string-regexp@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34" + integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA== + +eslint-config-airbnb-base@^14.2.1: + version "14.2.1" + resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-14.2.1.tgz#8a2eb38455dc5a312550193b319cdaeef042cd1e" + integrity sha512-GOrQyDtVEc1Xy20U7vsB2yAoB4nBlfH5HZJeatRXHleO+OS5Ot+MWij4Dpltw4/DyIkqUfqz1epfhVR5XWWQPA== + dependencies: + confusing-browser-globals "^1.0.10" + object.assign "^4.1.2" + object.entries "^1.1.2" + +eslint-config-google@^0.14.0: + version "0.14.0" + resolved "https://registry.yarnpkg.com/eslint-config-google/-/eslint-config-google-0.14.0.tgz#4f5f8759ba6e11b424294a219dbfa18c508bcc1a" + integrity sha512-WsbX4WbjuMvTdeVL6+J3rK1RGhCTqjsFjX7UMSMgZiyxxaNLkoJENbrGExzERFeoTpGw3F3FypTiWAP9ZXzkEw== + +eslint-config-prettier@^8.3.0: + version "8.3.0" + resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.3.0.tgz#f7471b20b6fe8a9a9254cc684454202886a2dd7a" + integrity sha512-BgZuLUSeKzvlL/VUjx/Yb787VQ26RU3gGjA3iiFvdsp/2bMfVIWUVP7tjxtjS0e+HP409cPlPvNkQloz8C91ew== + +eslint-import-resolver-node@^0.3.5: + version "0.3.5" + resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.5.tgz#939bbb0f74e179e757ca87f7a4a890dabed18ac4" + integrity sha512-XMoPKjSpXbkeJ7ZZ9icLnJMTY5Mc1kZbCakHquaFsXPpyWOwK0TK6CODO+0ca54UoM9LKOxyUNnoVZRl8TeaAg== + dependencies: + debug "^3.2.7" + resolve "^1.20.0" + +eslint-module-utils@^2.6.2: + version "2.6.2" + resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.6.2.tgz#94e5540dd15fe1522e8ffa3ec8db3b7fa7e7a534" + integrity sha512-QG8pcgThYOuqxupd06oYTZoNOGaUdTY1PqK+oS6ElF6vs4pBdk/aYxFVQQXzcrAqp9m7cl7lb2ubazX+g16k2Q== + dependencies: + debug "^3.2.7" + pkg-dir "^2.0.0" + +eslint-plugin-import@^2.24.0: + version "2.24.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.24.0.tgz#697ffd263e24da5e84e03b282f5fb62251777177" + integrity sha512-Kc6xqT9hiYi2cgybOc0I2vC9OgAYga5o/rAFinam/yF/t5uBqxQbauNPMC6fgb640T/89P0gFoO27FOilJ/Cqg== + dependencies: + array-includes "^3.1.3" + array.prototype.flat "^1.2.4" + debug "^2.6.9" + doctrine "^2.1.0" + eslint-import-resolver-node "^0.3.5" + eslint-module-utils "^2.6.2" + find-up "^2.0.0" + has "^1.0.3" + is-core-module "^2.4.0" + minimatch "^3.0.4" + object.values "^1.1.3" + pkg-up "^2.0.0" + read-pkg-up "^3.0.0" + resolve "^1.20.0" + tsconfig-paths "^3.9.0" + +eslint-plugin-prettier@^3.4.0: + version "3.4.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.4.0.tgz#cdbad3bf1dbd2b177e9825737fe63b476a08f0c7" + integrity sha512-UDK6rJT6INSfcOo545jiaOwB701uAIt2/dR7WnFQoGCVl1/EMqdANBmwUaqqQ45aXprsTGzSa39LI1PyuRBxxw== + dependencies: + prettier-linter-helpers "^1.0.0" + +eslint-scope@^5.1.1: + version "5.1.1" + resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c" + integrity sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw== + dependencies: + esrecurse "^4.3.0" + estraverse "^4.1.1" + +eslint-utils@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27" + integrity sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg== + dependencies: + eslint-visitor-keys "^1.1.0" + +eslint-visitor-keys@^1.1.0, eslint-visitor-keys@^1.3.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e" + integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ== + +eslint-visitor-keys@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303" + integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw== + +eslint@^7.32.0: + version "7.32.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.32.0.tgz#c6d328a14be3fb08c8d1d21e12c02fdb7a2a812d" + integrity sha512-VHZ8gX+EDfz+97jGcgyGCyRia/dPOd6Xh9yPv8Bl1+SoaIwD+a/vlrOmGRUyOYu7MwUhc7CxqeaDZU13S4+EpA== + dependencies: + "@babel/code-frame" "7.12.11" + "@eslint/eslintrc" "^0.4.3" + "@humanwhocodes/config-array" "^0.5.0" + ajv "^6.10.0" + chalk "^4.0.0" + cross-spawn "^7.0.2" + debug "^4.0.1" + doctrine "^3.0.0" + enquirer "^2.3.5" + escape-string-regexp "^4.0.0" + eslint-scope "^5.1.1" + eslint-utils "^2.1.0" + eslint-visitor-keys "^2.0.0" + espree "^7.3.1" + esquery "^1.4.0" + esutils "^2.0.2" + fast-deep-equal "^3.1.3" + file-entry-cache "^6.0.1" + functional-red-black-tree "^1.0.1" + glob-parent "^5.1.2" + globals "^13.6.0" + ignore "^4.0.6" + import-fresh "^3.0.0" + imurmurhash "^0.1.4" + is-glob "^4.0.0" + js-yaml "^3.13.1" + json-stable-stringify-without-jsonify "^1.0.1" + levn "^0.4.1" + lodash.merge "^4.6.2" + minimatch "^3.0.4" + natural-compare "^1.4.0" + optionator "^0.9.1" + progress "^2.0.0" + regexpp "^3.1.0" + semver "^7.2.1" + strip-ansi "^6.0.0" + strip-json-comments "^3.1.0" + table "^6.0.9" + text-table "^0.2.0" + v8-compile-cache "^2.0.3" + +espree@^7.3.0, espree@^7.3.1: + version "7.3.1" + resolved "https://registry.yarnpkg.com/espree/-/espree-7.3.1.tgz#f2df330b752c6f55019f8bd89b7660039c1bbbb6" + integrity sha512-v3JCNCE64umkFpmkFGqzVKsOT0tN1Zr+ueqLZfpV1Ob8e+CEgPWa+OxCoGH3tnhimMKIaBm4m/vaRpJ/krRz2g== + dependencies: + acorn "^7.4.0" + acorn-jsx "^5.3.1" + eslint-visitor-keys "^1.3.0" + +esprima@^4.0.0: + version "4.0.1" + resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71" + integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A== + +esquery@^1.4.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.4.0.tgz#2148ffc38b82e8c7057dfed48425b3e61f0f24a5" + integrity sha512-cCDispWt5vHHtwMY2YrAQ4ibFkAL8RbH5YGBnZBc90MolvvfkkQcJro/aZiAQUlQ3qgrYS6D6v8Gc5G5CQsc9w== + dependencies: + estraverse "^5.1.0" + +esrecurse@^4.3.0: + version "4.3.0" + resolved "https://registry.yarnpkg.com/esrecurse/-/esrecurse-4.3.0.tgz#7ad7964d679abb28bee72cec63758b1c5d2c9921" + integrity sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag== + dependencies: + estraverse "^5.2.0" + +estraverse@^4.1.1: + version "4.3.0" + resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d" + integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw== + +estraverse@^5.1.0, estraverse@^5.2.0: + version "5.2.0" + resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.2.0.tgz#307df42547e6cc7324d3cf03c155d5cdb8c53880" + integrity sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ== + +esutils@^2.0.2: + version "2.0.3" + resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64" + integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g== + +fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3: + version "3.1.3" + resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525" + integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q== + +fast-diff@^1.1.2: + version "1.2.0" + resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.2.0.tgz#73ee11982d86caaf7959828d519cfe927fac5f03" + integrity sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w== + +fast-json-stable-stringify@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633" + integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw== + +fast-levenshtein@^2.0.6: + version "2.0.6" + resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917" + integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc= + +file-entry-cache@^6.0.1: + version "6.0.1" + resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027" + integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg== + dependencies: + flat-cache "^3.0.4" + +find-up@^2.0.0, find-up@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7" + integrity sha1-RdG35QbHF93UgndaK3eSCjwMV6c= + dependencies: + locate-path "^2.0.0" + +flat-cache@^3.0.4: + version "3.0.4" + resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11" + integrity sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg== + dependencies: + flatted "^3.1.0" + rimraf "^3.0.2" + +flatted@^3.1.0: + version "3.2.2" + resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.2.tgz#64bfed5cb68fe3ca78b3eb214ad97b63bedce561" + integrity sha512-JaTY/wtrcSyvXJl4IMFHPKyFur1sE9AUqc0QnhOaJ0CxHtAoIV8pYDzeEfAaNEtGkOfq4gr3LBFmdXW5mOQFnA== + +fs.realpath@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f" + integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= + +function-bind@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d" + integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A== + +functional-red-black-tree@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz#1b0ab3bd553b2a0d6399d29c0e3ea0b252078327" + integrity sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc= + +get-intrinsic@^1.0.2, get-intrinsic@^1.1.0, get-intrinsic@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.1.1.tgz#15f59f376f855c446963948f0d24cd3637b4abc6" + integrity sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q== + dependencies: + function-bind "^1.1.1" + has "^1.0.3" + has-symbols "^1.0.1" + +glob-parent@^5.1.2: + version "5.1.2" + resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4" + integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow== + dependencies: + is-glob "^4.0.1" + +glob@^7.1.3: + version "7.1.7" + resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.7.tgz#3b193e9233f01d42d0b3f78294bbeeb418f94a90" + integrity sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ== + dependencies: + fs.realpath "^1.0.0" + inflight "^1.0.4" + inherits "2" + minimatch "^3.0.4" + once "^1.3.0" + path-is-absolute "^1.0.0" + +globals@^13.6.0, globals@^13.9.0: + version "13.10.0" + resolved "https://registry.yarnpkg.com/globals/-/globals-13.10.0.tgz#60ba56c3ac2ca845cfbf4faeca727ad9dd204676" + integrity sha512-piHC3blgLGFjvOuMmWZX60f+na1lXFDhQXBf1UYp2fXPXqvEUbOhNwi6BsQ0bQishwedgnjkwv1d9zKf+MWw3g== + dependencies: + type-fest "^0.20.2" + +graceful-fs@^4.1.2: + version "4.2.8" + resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.8.tgz#e412b8d33f5e006593cbd3cee6df9f2cebbe802a" + integrity sha512-qkIilPUYcNhJpd33n0GBXTB1MMPp14TxEsEs0pTrsSVucApsYzW5V+Q8Qxhik6KU3evy+qkAAowTByymK0avdg== + +has-bigints@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113" + integrity sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA== + +has-flag@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd" + integrity sha1-tdRU3CGZriJWmfNGfloH87lVuv0= + +has-flag@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b" + integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ== + +has-symbols@^1.0.1, has-symbols@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.2.tgz#165d3070c00309752a1236a479331e3ac56f1423" + integrity sha512-chXa79rL/UC2KlX17jo3vRGz0azaWEx5tGqZg5pO3NUyEJVB17dMruQlzCCOfUvElghKcm5194+BCRvi2Rv/Gw== + +has-tostringtag@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.0.tgz#7e133818a7d394734f941e73c3d3f9291e658b25" + integrity sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ== + dependencies: + has-symbols "^1.0.2" + +has@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796" + integrity sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw== + dependencies: + function-bind "^1.1.1" + +hosted-git-info@^2.1.4: + version "2.8.9" + resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.9.tgz#dffc0bf9a21c02209090f2aa69429e1414daf3f9" + integrity sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw== + +ignore@^4.0.6: + version "4.0.6" + resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc" + integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg== + +import-fresh@^3.0.0, import-fresh@^3.2.1: + version "3.3.0" + resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b" + integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw== + dependencies: + parent-module "^1.0.0" + resolve-from "^4.0.0" + +imurmurhash@^0.1.4: + version "0.1.4" + resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea" + integrity sha1-khi5srkoojixPcT7a21XbyMUU+o= + +inflight@^1.0.4: + version "1.0.6" + resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9" + integrity sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk= + dependencies: + once "^1.3.0" + wrappy "1" + +inherits@2: + version "2.0.4" + resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c" + integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ== + +internal-slot@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.3.tgz#7347e307deeea2faac2ac6205d4bc7d34967f59c" + integrity sha512-O0DB1JC/sPyZl7cIo78n5dR7eUSwwpYPiXRhTzNxZVAMUuB8vlnRFyLxdrVToks6XPLVnFfbzaVd5WLjhgg+vA== + dependencies: + get-intrinsic "^1.1.0" + has "^1.0.3" + side-channel "^1.0.4" + +is-arrayish@^0.2.1: + version "0.2.1" + resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d" + integrity sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0= + +is-bigint@^1.0.1: + version "1.0.3" + resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.3.tgz#fc9d9e364210480675653ddaea0518528d49a581" + integrity sha512-ZU538ajmYJmzysE5yU4Y7uIrPQ2j704u+hXFiIPQExpqzzUbpe5jCPdTfmz7jXRxZdvjY3KZ3ZNenoXQovX+Dg== + +is-boolean-object@^1.1.0: + version "1.1.2" + resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.1.2.tgz#5c6dc200246dd9321ae4b885a114bb1f75f63719" + integrity sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA== + dependencies: + call-bind "^1.0.2" + has-tostringtag "^1.0.0" + +is-callable@^1.1.4, is-callable@^1.2.3: + version "1.2.4" + resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.4.tgz#47301d58dd0259407865547853df6d61fe471945" + integrity sha512-nsuwtxZfMX67Oryl9LCQ+upnC0Z0BgpwntpS89m1H/TLF0zNfzfLMV/9Wa/6MZsj0acpEjAO0KF1xT6ZdLl95w== + +is-core-module@^2.2.0, is-core-module@^2.4.0: + version "2.5.0" + resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.5.0.tgz#f754843617c70bfd29b7bd87327400cda5c18491" + integrity sha512-TXCMSDsEHMEEZ6eCA8rwRDbLu55MRGmrctljsBX/2v1d9/GzqHOxW5c5oPSgrUt2vBFXebu9rGqckXGPWOlYpg== + dependencies: + has "^1.0.3" + +is-date-object@^1.0.1: + version "1.0.5" + resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.0.5.tgz#0841d5536e724c25597bf6ea62e1bd38298df31f" + integrity sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ== + dependencies: + has-tostringtag "^1.0.0" + +is-extglob@^2.1.1: + version "2.1.1" + resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2" + integrity sha1-qIwCU1eR8C7TfHahueqXc8gz+MI= + +is-fullwidth-code-point@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz#f116f8064fe90b3f7844a38997c0b75051269f1d" + integrity sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg== + +is-glob@^4.0.0, is-glob@^4.0.1: + version "4.0.1" + resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.1.tgz#7567dbe9f2f5e2467bc77ab83c4a29482407a5dc" + integrity sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg== + dependencies: + is-extglob "^2.1.1" + +is-negative-zero@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.1.tgz#3de746c18dda2319241a53675908d8f766f11c24" + integrity sha512-2z6JzQvZRa9A2Y7xC6dQQm4FSTSTNWjKIYYTt4246eMTJmIo0Q+ZyOsU66X8lxK1AbB92dFeglPLrhwpeRKO6w== + +is-number-object@^1.0.4: + version "1.0.6" + resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.6.tgz#6a7aaf838c7f0686a50b4553f7e54a96494e89f0" + integrity sha512-bEVOqiRcvo3zO1+G2lVMy+gkkEm9Yh7cDMRusKKu5ZJKPUYSJwICTKZrNKHA2EbSP0Tu0+6B/emsYNHZyn6K8g== + dependencies: + has-tostringtag "^1.0.0" + +is-regex@^1.1.3: + version "1.1.4" + resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958" + integrity sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg== + dependencies: + call-bind "^1.0.2" + has-tostringtag "^1.0.0" + +is-string@^1.0.5, is-string@^1.0.6: + version "1.0.7" + resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.7.tgz#0dd12bf2006f255bb58f695110eff7491eebc0fd" + integrity sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg== + dependencies: + has-tostringtag "^1.0.0" + +is-symbol@^1.0.2, is-symbol@^1.0.3: + version "1.0.4" + resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.0.4.tgz#a6dac93b635b063ca6872236de88910a57af139c" + integrity sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg== + dependencies: + has-symbols "^1.0.2" + +isexe@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10" + integrity sha1-6PvzdNxVb/iUehDcsFctYz8s+hA= + +js-tokens@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" + integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ== + +js-yaml@^3.13.1: + version "3.14.1" + resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.14.1.tgz#dae812fdb3825fa306609a8717383c50c36a0537" + integrity sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g== + dependencies: + argparse "^1.0.7" + esprima "^4.0.0" + +json-parse-better-errors@^1.0.1: + version "1.0.2" + resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" + integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw== + +json-schema-traverse@^0.4.1: + version "0.4.1" + resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660" + integrity sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg== + +json-schema-traverse@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz#ae7bcb3656ab77a73ba5c49bf654f38e6b6860e2" + integrity sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug== + +json-stable-stringify-without-jsonify@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651" + integrity sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE= + +json5@^2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.0.tgz#2dfefe720c6ba525d9ebd909950f0515316c89a3" + integrity sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA== + dependencies: + minimist "^1.2.5" + +levn@^0.4.1: + version "0.4.1" + resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade" + integrity sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ== + dependencies: + prelude-ls "^1.2.1" + type-check "~0.4.0" + +load-json-file@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-4.0.0.tgz#2f5f45ab91e33216234fd53adab668eb4ec0993b" + integrity sha1-L19Fq5HjMhYjT9U62rZo607AmTs= + dependencies: + graceful-fs "^4.1.2" + parse-json "^4.0.0" + pify "^3.0.0" + strip-bom "^3.0.0" + +locate-path@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e" + integrity sha1-K1aLJl7slExtnA3pw9u7ygNUzY4= + dependencies: + p-locate "^2.0.0" + path-exists "^3.0.0" + +lodash.clonedeep@^4.5.0: + version "4.5.0" + resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef" + integrity sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8= + +lodash.merge@^4.6.2: + version "4.6.2" + resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a" + integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ== + +lodash.truncate@^4.4.2: + version "4.4.2" + resolved "https://registry.yarnpkg.com/lodash.truncate/-/lodash.truncate-4.4.2.tgz#5a350da0b1113b837ecfffd5812cbe58d6eae193" + integrity sha1-WjUNoLERO4N+z//VgSy+WNbq4ZM= + +lru-cache@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94" + integrity sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA== + dependencies: + yallist "^4.0.0" + +minimatch@^3.0.4: + version "3.0.4" + resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083" + integrity sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA== + dependencies: + brace-expansion "^1.1.7" + +minimist@^1.2.0, minimist@^1.2.5: + version "1.2.5" + resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602" + integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw== + +ms@2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8" + integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g= + +ms@2.1.2: + version "2.1.2" + resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" + integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w== + +ms@^2.1.1: + version "2.1.3" + resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2" + integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA== + +natural-compare@^1.4.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7" + integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc= + +normalize-package-data@^2.3.2: + version "2.5.0" + resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.5.0.tgz#e66db1838b200c1dfc233225d12cb36520e234a8" + integrity sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA== + dependencies: + hosted-git-info "^2.1.4" + resolve "^1.10.0" + semver "2 || 3 || 4 || 5" + validate-npm-package-license "^3.0.1" + +object-inspect@^1.11.0, object-inspect@^1.9.0: + version "1.11.0" + resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.11.0.tgz#9dceb146cedd4148a0d9e51ab88d34cf509922b1" + integrity sha512-jp7ikS6Sd3GxQfZJPyH3cjcbJF6GZPClgdV+EFygjFLQ5FmW/dRUnTd9PQ9k0JhoNDabWFbpF1yCdSWCC6gexg== + +object-keys@^1.0.12, object-keys@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e" + integrity sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA== + +object.assign@^4.1.2: + version "4.1.2" + resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.2.tgz#0ed54a342eceb37b38ff76eb831a0e788cb63940" + integrity sha512-ixT2L5THXsApyiUPYKmW+2EHpXXe5Ii3M+f4e+aJFAHao5amFRW6J0OO6c/LU8Be47utCx2GL89hxGB6XSmKuQ== + dependencies: + call-bind "^1.0.0" + define-properties "^1.1.3" + has-symbols "^1.0.1" + object-keys "^1.1.1" + +object.entries@^1.1.2: + version "1.1.4" + resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.4.tgz#43ccf9a50bc5fd5b649d45ab1a579f24e088cafd" + integrity sha512-h4LWKWE+wKQGhtMjZEBud7uLGhqyLwj8fpHOarZhD2uY3C9cRtk57VQ89ke3moByLXMedqs3XCHzyb4AmA2DjA== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.3" + es-abstract "^1.18.2" + +object.values@^1.1.3: + version "1.1.4" + resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.4.tgz#0d273762833e816b693a637d30073e7051535b30" + integrity sha512-TnGo7j4XSnKQoK3MfvkzqKCi0nVe/D9I9IjwTNYdb/fxYHpjrluHVOgw0AF6jrRFGMPHdfuidR09tIDiIvnaSg== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.3" + es-abstract "^1.18.2" + +once@^1.3.0: + version "1.4.0" + resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1" + integrity sha1-WDsap3WWHUsROsF9nFC6753Xa9E= + dependencies: + wrappy "1" + +optionator@^0.9.1: + version "0.9.1" + resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.1.tgz#4f236a6373dae0566a6d43e1326674f50c291499" + integrity sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw== + dependencies: + deep-is "^0.1.3" + fast-levenshtein "^2.0.6" + levn "^0.4.1" + prelude-ls "^1.2.1" + type-check "^0.4.0" + word-wrap "^1.2.3" + +p-limit@^1.1.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.3.0.tgz#b86bd5f0c25690911c7590fcbfc2010d54b3ccb8" + integrity sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q== + dependencies: + p-try "^1.0.0" + +p-locate@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43" + integrity sha1-IKAQOyIqcMj9OcwuWAaA893l7EM= + dependencies: + p-limit "^1.1.0" + +p-try@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/p-try/-/p-try-1.0.0.tgz#cbc79cdbaf8fd4228e13f621f2b1a237c1b207b3" + integrity sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M= + +parent-module@^1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2" + integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g== + dependencies: + callsites "^3.0.0" + +parse-json@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-4.0.0.tgz#be35f5425be1f7f6c747184f98a788cb99477ee0" + integrity sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA= + dependencies: + error-ex "^1.3.1" + json-parse-better-errors "^1.0.1" + +path-exists@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515" + integrity sha1-zg6+ql94yxiSXqfYENe1mwEP1RU= + +path-is-absolute@^1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f" + integrity sha1-F0uSaHNVNP+8es5r9TpanhtcX18= + +path-key@^3.1.0: + version "3.1.1" + resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375" + integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q== + +path-parse@^1.0.6: + version "1.0.7" + resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735" + integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw== + +path-type@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/path-type/-/path-type-3.0.0.tgz#cef31dc8e0a1a3bb0d105c0cd97cf3bf47f4e36f" + integrity sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg== + dependencies: + pify "^3.0.0" + +pify@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176" + integrity sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY= + +pkg-dir@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-2.0.0.tgz#f6d5d1109e19d63edf428e0bd57e12777615334b" + integrity sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s= + dependencies: + find-up "^2.1.0" + +pkg-up@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f" + integrity sha1-yBmscoBZpGHKscOImivjxJoATX8= + dependencies: + find-up "^2.1.0" + +prelude-ls@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" + integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g== + +prettier-linter-helpers@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b" + integrity sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w== + dependencies: + fast-diff "^1.1.2" + +prettier@^2.3.2: + version "2.3.2" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.3.2.tgz#ef280a05ec253712e486233db5c6f23441e7342d" + integrity sha512-lnJzDfJ66zkMy58OL5/NY5zp70S7Nz6KqcKkXYzn2tMVrNxvbqaBpg7H3qHaLxCJ5lNMsGuM8+ohS7cZrthdLQ== + +progress@^2.0.0: + version "2.0.3" + resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8" + integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA== + +punycode@^2.1.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec" + integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== + +read-pkg-up@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-3.0.0.tgz#3ed496685dba0f8fe118d0691dc51f4a1ff96f07" + integrity sha1-PtSWaF26D4/hGNBpHcUfSh/5bwc= + dependencies: + find-up "^2.0.0" + read-pkg "^3.0.0" + +read-pkg@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-3.0.0.tgz#9cbc686978fee65d16c00e2b19c237fcf6e38389" + integrity sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k= + dependencies: + load-json-file "^4.0.0" + normalize-package-data "^2.3.2" + path-type "^3.0.0" + +regexpp@^3.1.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2" + integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg== + +require-from-string@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-2.0.2.tgz#89a7fdd938261267318eafe14f9c32e598c36909" + integrity sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw== + +resolve-from@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6" + integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g== + +resolve@^1.10.0, resolve@^1.20.0: + version "1.20.0" + resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.20.0.tgz#629a013fb3f70755d6f0b7935cc1c2c5378b1975" + integrity sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A== + dependencies: + is-core-module "^2.2.0" + path-parse "^1.0.6" + +rimraf@^3.0.2: + version "3.0.2" + resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a" + integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA== + dependencies: + glob "^7.1.3" + +"semver@2 || 3 || 4 || 5": + version "5.7.1" + resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" + integrity sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ== + +semver@^7.2.1: + version "7.3.5" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7" + integrity sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ== + dependencies: + lru-cache "^6.0.0" + +shebang-command@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-2.0.0.tgz#ccd0af4f8835fbdc265b82461aaf0c36663f34ea" + integrity sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA== + dependencies: + shebang-regex "^3.0.0" + +shebang-regex@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172" + integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A== + +side-channel@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf" + integrity sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw== + dependencies: + call-bind "^1.0.0" + get-intrinsic "^1.0.2" + object-inspect "^1.9.0" + +slice-ansi@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-4.0.0.tgz#500e8dd0fd55b05815086255b3195adf2a45fe6b" + integrity sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ== + dependencies: + ansi-styles "^4.0.0" + astral-regex "^2.0.0" + is-fullwidth-code-point "^3.0.0" + +spdx-correct@^3.0.0: + version "3.1.1" + resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.1.tgz#dece81ac9c1e6713e5f7d1b6f17d468fa53d89a9" + integrity sha512-cOYcUWwhCuHCXi49RhFRCyJEK3iPj1Ziz9DpViV3tbZOwXD49QzIN3MpOLJNxh2qwq2lJJZaKMVw9qNi4jTC0w== + dependencies: + spdx-expression-parse "^3.0.0" + spdx-license-ids "^3.0.0" + +spdx-exceptions@^2.1.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz#3f28ce1a77a00372683eade4a433183527a2163d" + integrity sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A== + +spdx-expression-parse@^3.0.0: + version "3.0.1" + resolved "https://registry.yarnpkg.com/spdx-expression-parse/-/spdx-expression-parse-3.0.1.tgz#cf70f50482eefdc98e3ce0a6833e4a53ceeba679" + integrity sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q== + dependencies: + spdx-exceptions "^2.1.0" + spdx-license-ids "^3.0.0" + +spdx-license-ids@^3.0.0: + version "3.0.10" + resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.10.tgz#0d9becccde7003d6c658d487dd48a32f0bf3014b" + integrity sha512-oie3/+gKf7QtpitB0LYLETe+k8SifzsX4KixvpOsbI6S0kRiRQ5MKOio8eMSAKQ17N06+wdEOXRiId+zOxo0hA== + +sprintf-js@~1.0.2: + version "1.0.3" + resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c" + integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw= + +string-width@^4.2.0: + version "4.2.2" + resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.2.tgz#dafd4f9559a7585cfba529c6a0a4f73488ebd4c5" + integrity sha512-XBJbT3N4JhVumXE0eoLU9DCjcaF92KLNqTmFCnG1pf8duUxFGwtP6AD6nkjw9a3IdiRtL3E2w3JDiE/xi3vOeA== + dependencies: + emoji-regex "^8.0.0" + is-fullwidth-code-point "^3.0.0" + strip-ansi "^6.0.0" + +string.prototype.trimend@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.4.tgz#e75ae90c2942c63504686c18b287b4a0b1a45f80" + integrity sha512-y9xCjw1P23Awk8EvTpcyL2NIr1j7wJ39f+k6lvRnSMz+mz9CGz9NYPelDk42kOz6+ql8xjfK8oYzy3jAP5QU5A== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.3" + +string.prototype.trimstart@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.4.tgz#b36399af4ab2999b4c9c648bd7a3fb2bb26feeed" + integrity sha512-jh6e984OBfvxS50tdY2nRZnoC5/mLFKOREQfw8t5yytkoUsJRNxvI/E39qu1sD0OtWI3OC0XgKSmcWwziwYuZw== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.3" + +strip-ansi@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.0.tgz#0b1571dd7669ccd4f3e06e14ef1eed26225ae532" + integrity sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w== + dependencies: + ansi-regex "^5.0.0" + +strip-bom@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3" + integrity sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM= + +strip-json-comments@^3.1.0, strip-json-comments@^3.1.1: + version "3.1.1" + resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006" + integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig== + +supports-color@^5.3.0: + version "5.5.0" + resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f" + integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow== + dependencies: + has-flag "^3.0.0" + +supports-color@^7.1.0: + version "7.2.0" + resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da" + integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw== + dependencies: + has-flag "^4.0.0" + +table@^6.0.9: + version "6.7.1" + resolved "https://registry.yarnpkg.com/table/-/table-6.7.1.tgz#ee05592b7143831a8c94f3cee6aae4c1ccef33e2" + integrity sha512-ZGum47Yi6KOOFDE8m223td53ath2enHcYLgOCjGr5ngu8bdIARQk6mN/wRMv4yMRcHnCSnHbCEha4sobQx5yWg== + dependencies: + ajv "^8.0.1" + lodash.clonedeep "^4.5.0" + lodash.truncate "^4.4.2" + slice-ansi "^4.0.0" + string-width "^4.2.0" + strip-ansi "^6.0.0" + +text-table@^0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" + integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ= + +tsconfig-paths@^3.9.0: + version "3.10.1" + resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.10.1.tgz#79ae67a68c15289fdf5c51cb74f397522d795ed7" + integrity sha512-rETidPDgCpltxF7MjBZlAFPUHv5aHH2MymyPvh+vEyWAED4Eb/WeMbsnD/JDr4OKPOA1TssDHgIcpTN5Kh0p6Q== + dependencies: + json5 "^2.2.0" + minimist "^1.2.0" + strip-bom "^3.0.0" + +type-check@^0.4.0, type-check@~0.4.0: + version "0.4.0" + resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1" + integrity sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew== + dependencies: + prelude-ls "^1.2.1" + +type-fest@^0.20.2: + version "0.20.2" + resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4" + integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ== + +unbox-primitive@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.1.tgz#085e215625ec3162574dc8859abee78a59b14471" + integrity sha512-tZU/3NqK3dA5gpE1KtyiJUrEB0lxnGkMFHptJ7q6ewdZ8s12QrODwNbhIJStmJkd1QDXa1NRA8aF2A1zk/Ypyw== + dependencies: + function-bind "^1.1.1" + has-bigints "^1.0.1" + has-symbols "^1.0.2" + which-boxed-primitive "^1.0.2" + +uri-js@^4.2.2: + version "4.4.1" + resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e" + integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg== + dependencies: + punycode "^2.1.0" + +v8-compile-cache@^2.0.3: + version "2.3.0" + resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee" + integrity sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA== + +validate-npm-package-license@^3.0.1: + version "3.0.4" + resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a" + integrity sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew== + dependencies: + spdx-correct "^3.0.0" + spdx-expression-parse "^3.0.0" + +which-boxed-primitive@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz#13757bc89b209b049fe5d86430e21cf40a89a8e6" + integrity sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg== + dependencies: + is-bigint "^1.0.1" + is-boolean-object "^1.1.0" + is-number-object "^1.0.4" + is-string "^1.0.5" + is-symbol "^1.0.3" + +which@^2.0.1: + version "2.0.2" + resolved "https://registry.yarnpkg.com/which/-/which-2.0.2.tgz#7c6a8dd0a636a0327e10b59c9286eee93f3f51b1" + integrity sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA== + dependencies: + isexe "^2.0.0" + +word-wrap@^1.2.3: + version "1.2.3" + resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c" + integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ== + +wrappy@1: + version "1.0.2" + resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f" + integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8= + +yallist@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72" + integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A== From 43eb6c5c27621034da5256aa10579a4871bf0db9 Mon Sep 17 00:00:00 2001 From: limkhl Date: Wed, 22 Sep 2021 11:39:00 +0900 Subject: [PATCH 2/8] =?UTF-8?q?fix:=20prettier,=20eslint=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .eslintrc.json | 16 +++++++++++++++ .prettierrc.json | 10 ++++++++++ README.md | 12 +++++++++-- eslintrc.js | 14 ------------- index.html | 11 ++-------- prettierrc.json | 10 ---------- project1-colors/src/Button.js | 10 ++++------ project1-colors/src/Project1Page.js | 6 +++--- project1-colors/src/main.js | 4 ++-- project2-HexColorsGradient/src/Button.js | 16 +++++---------- .../src/Project2Page.js | 8 ++++---- project2-HexColorsGradient/src/Sign.js | 8 ++++---- project2-HexColorsGradient/src/main.js | 6 +++--- project2-HexColorsGradient/src/style.css | 4 ++-- project3-RandomQuoteGenerator/src/App.js | 12 +++++------ project3-RandomQuoteGenerator/src/Button.js | 6 +++--- .../src/Project3Page.js | 6 +++--- project3-RandomQuoteGenerator/src/QuoteBox.js | 8 ++++---- project3-RandomQuoteGenerator/src/api.js | 4 ++-- project3-RandomQuoteGenerator/src/main.js | 4 ++-- project3-RandomQuoteGenerator/src/style.css | 6 +++--- src/components/App.js | 20 +++++++++---------- src/data/projectList.js | 6 +++--- src/layouts/Header.js | 2 +- src/main.js | 4 ++-- src/pages/HomePage.js | 10 +++++----- src/pages/NotFoundPage.js | 4 ++-- src/styles/project3.css | 6 +++--- src/styles/style.css | 8 ++++---- 29 files changed, 117 insertions(+), 124 deletions(-) create mode 100644 .eslintrc.json create mode 100644 .prettierrc.json delete mode 100644 eslintrc.js delete mode 100644 prettierrc.json diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..8feb476 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,16 @@ +{ + "env": { + "browser": true, + "es2021": true + }, + "extends": ["google", "plugin:prettier/recommended"], + "parserOptions": { + "ecmaVersion": 12, + "sourceType": "module" + }, + "rules": { + "require-jsdoc": "off", + "linebreak-style": ["error", "windows"], + "prettier/prettier": ["error", { "endOfLine": "auto" }] + } +} diff --git a/.prettierrc.json b/.prettierrc.json new file mode 100644 index 0000000..9a70205 --- /dev/null +++ b/.prettierrc.json @@ -0,0 +1,10 @@ +{ + "printWidth": 100, + "tabWidth": 2, + "singleQuote": true, + "trailingComma": "all", + "bracketSpacing": true, + "semi": true, + "useTabs": false, + "endOfLine": "lf" +} diff --git a/README.md b/README.md index 8e7c12a..4eb605a 100644 --- a/README.md +++ b/README.md @@ -1,14 +1,22 @@ # 25 Beginner JavaScript Project Ideas + ## ๊ทœ์น™ + - ๋ธŒ๋žœ์น˜๋ช…์€ JSmini_lia ํ˜•์‹์œผ๋กœ ๋งŒ๋“ค์–ด ์ฃผ์„ธ์š”. - ๋งค์ฃผ ์ฃผ์–ด์ง„ ์–‘์˜ project๋ฅผ ์™„์„ฑ ํ›„ project ๋‹จ์œ„๋กœ PRํ•ด ์ฃผ์„ธ์š”! - - [Project1/๋ฆฌ์•„] ํ”„๋กœ์ ํŠธ๋ช… - - ์˜ˆ) [Project1/๋ฆฌ์•„] Colors + - [Project1/๋ฆฌ์•„] ํ”„๋กœ์ ํŠธ๋ช… + - ์˜ˆ) [Project1/๋ฆฌ์•„] Colors ## 1ํšŒ์ฐจ(~9/12) + ### Project 1 Colors + ![image](https://user-images.githubusercontent.com/64760270/132218819-23e9edb1-9596-4a31-9618-5e7e6adeecb0.png) + ### Project 2 Hex colors gradient + ![image](https://user-images.githubusercontent.com/64760270/132218843-b12f04ef-8259-43da-8a82-4ae9d48446cb.png) + ### Project 3 Random quote generator + ![image](https://user-images.githubusercontent.com/64760270/132218869-39280963-64e9-4ac6-a074-c8cb4b984927.png) diff --git a/eslintrc.js b/eslintrc.js deleted file mode 100644 index d37fff3..0000000 --- a/eslintrc.js +++ /dev/null @@ -1,14 +0,0 @@ -// eslint + prettier ์„ค์ • ์ฐธ๊ณ  : https://pravusid.kr/javascript/2019/03/10/eslint-prettier.html - -module.exports = { - env: { - browser: true, - es2021: true, - }, - extends: ['google', 'plugin:prettier/recommended'], - parserOptions: { - ecmaVersion: 12, - sourceType: 'module', - }, - rules: {}, -} diff --git a/index.html b/index.html index cf94a32..4be7bf1 100644 --- a/index.html +++ b/index.html @@ -5,19 +5,12 @@ JS Mini Project 25 - + - + diff --git a/prettierrc.json b/prettierrc.json deleted file mode 100644 index de28c84..0000000 --- a/prettierrc.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "printWidth": 100, - "tabWidth": 2, - "singleQuote": true, - "trailingComma": "all", - "bracketSpacing": true, - "semi": true, - "useTabs": false, - "endOfLine": "lf" - } \ No newline at end of file diff --git a/project1-colors/src/Button.js b/project1-colors/src/Button.js index e47c425..699107a 100644 --- a/project1-colors/src/Button.js +++ b/project1-colors/src/Button.js @@ -1,14 +1,12 @@ export default function Button({ $target, onClick }) { - const $button = document.createElement("button"); + const $button = document.createElement('button'); $target.append($button); - $button.textContent = "Click Me!"; + $button.textContent = 'Click Me!'; - $button.addEventListener("click", (e) => { + $button.addEventListener('click', () => { const generateRandomColorCode = () => { const randomHex = Math.floor(Math.random() * 16777215).toString(16); - return randomHex.length < 6 - ? `${"0".repeat(6 - randomHex.length)}${randomHex}` - : randomHex; + return randomHex.length < 6 ? `${'0'.repeat(6 - randomHex.length)}${randomHex}` : randomHex; }; onClick(generateRandomColorCode()); }); diff --git a/project1-colors/src/Project1Page.js b/project1-colors/src/Project1Page.js index c8f5ff9..0feb8af 100644 --- a/project1-colors/src/Project1Page.js +++ b/project1-colors/src/Project1Page.js @@ -1,9 +1,9 @@ -import Button from "./Button.js"; +import Button from './Button.js'; export default function Project1Page({ $target }) { - const $page = document.createElement("div"); + const $page = document.createElement('div'); - $page.className = "project1 page"; + $page.className = 'project1 page'; new Button({ $target: $page, diff --git a/project1-colors/src/main.js b/project1-colors/src/main.js index e1a9c64..0d3e70e 100644 --- a/project1-colors/src/main.js +++ b/project1-colors/src/main.js @@ -1,6 +1,6 @@ -import Button from "./Button.js"; +import Button from './Button.js'; -const $app = document.querySelector("#app"); +const $app = document.querySelector('#app'); new Button({ $target: $app, diff --git a/project2-HexColorsGradient/src/Button.js b/project2-HexColorsGradient/src/Button.js index c69201c..a6327ed 100644 --- a/project2-HexColorsGradient/src/Button.js +++ b/project2-HexColorsGradient/src/Button.js @@ -1,24 +1,18 @@ export default function Button({ $target, onClick }) { - const $button = document.createElement("button"); + const $button = document.createElement('button'); $target.append($button); - $button.textContent = "Click Me!"; + $button.textContent = 'Click Me!'; - $button.addEventListener("click", (e) => { + $button.addEventListener('click', (e) => { const generateRandomDirection = () => { return Math.floor(Math.random() * 2) === 0 ? `right` : `left`; }; const generateRandomColorCode = () => { const randomHex = Math.floor(Math.random() * 16777215).toString(16); - return randomHex.length < 6 - ? `${"0".repeat(6 - randomHex.length)}${randomHex}` - : randomHex; + return randomHex.length < 6 ? `${'0'.repeat(6 - randomHex.length)}${randomHex}` : randomHex; }; - onClick( - generateRandomDirection(), - generateRandomColorCode(), - generateRandomColorCode() - ); + onClick(generateRandomDirection(), generateRandomColorCode(), generateRandomColorCode()); }); } diff --git a/project2-HexColorsGradient/src/Project2Page.js b/project2-HexColorsGradient/src/Project2Page.js index e5ba33c..2966efe 100644 --- a/project2-HexColorsGradient/src/Project2Page.js +++ b/project2-HexColorsGradient/src/Project2Page.js @@ -1,10 +1,10 @@ -import Button from "./Button.js"; -import Sign from "./Sign.js"; +import Button from './Button.js'; +import Sign from './Sign.js'; export default function Project2Page({ $target }) { - const $page = document.createElement("div"); + const $page = document.createElement('div'); - $page.className = "project2 page"; + $page.className = 'project2 page'; const signBoard = new Sign({ $target: $page }); diff --git a/project2-HexColorsGradient/src/Sign.js b/project2-HexColorsGradient/src/Sign.js index e389a3f..e48b356 100644 --- a/project2-HexColorsGradient/src/Sign.js +++ b/project2-HexColorsGradient/src/Sign.js @@ -1,12 +1,12 @@ export default function Sign({ $target }) { - const $signContainer = document.createElement("div"); + const $signContainer = document.createElement('div'); $target.append($signContainer); this.state = { - direction: "right", + direction: 'right', colorCode: { - start: "ffffff", - end: "ffffff", + start: 'ffffff', + end: 'ffffff', }, }; diff --git a/project2-HexColorsGradient/src/main.js b/project2-HexColorsGradient/src/main.js index e6f9e02..6eb1249 100644 --- a/project2-HexColorsGradient/src/main.js +++ b/project2-HexColorsGradient/src/main.js @@ -1,7 +1,7 @@ -import Button from "./Button.js"; -import Sign from "./Sign.js"; +import Button from './Button.js'; +import Sign from './Sign.js'; -const $app = document.querySelector("#app"); +const $app = document.querySelector('#app'); const signBoard = new Sign({ $target: $app }); diff --git a/project2-HexColorsGradient/src/style.css b/project2-HexColorsGradient/src/style.css index 7d81298..d0f6b5b 100644 --- a/project2-HexColorsGradient/src/style.css +++ b/project2-HexColorsGradient/src/style.css @@ -1,9 +1,9 @@ -@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap"); +@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap'); * { margin: 0; padding: 0; - font-family: "Noto Sans KR", sans-serif; + font-family: 'Noto Sans KR', sans-serif; } :root { diff --git a/project3-RandomQuoteGenerator/src/App.js b/project3-RandomQuoteGenerator/src/App.js index 4d63ca1..3bede71 100644 --- a/project3-RandomQuoteGenerator/src/App.js +++ b/project3-RandomQuoteGenerator/src/App.js @@ -1,6 +1,6 @@ -import { request } from "./api.js"; -import Button from "./Button.js"; -import QuoteBox from "./QuoteBox.js"; +import { request } from './api.js'; +import Button from './Button.js'; +import QuoteBox from './QuoteBox.js'; export default function App({ $target }) { const quoteBox = new QuoteBox({ $target }); @@ -8,10 +8,8 @@ export default function App({ $target }) { $target, onClick: async () => { const generatedQuoteSet = await request(); - const quote = `"${generatedQuoteSet.quote.replace("\uFFFD", "'")}"`; - const author = generatedQuoteSet.author - ? `- ${generatedQuoteSet.author}` - : ``; + const quote = `"${generatedQuoteSet.quote.replace('\uFFFD', "'")}"`; + const author = generatedQuoteSet.author ? `- ${generatedQuoteSet.author}` : ``; quoteBox.setState({ ...quoteBox.state, diff --git a/project3-RandomQuoteGenerator/src/Button.js b/project3-RandomQuoteGenerator/src/Button.js index ba81b72..649772b 100644 --- a/project3-RandomQuoteGenerator/src/Button.js +++ b/project3-RandomQuoteGenerator/src/Button.js @@ -1,9 +1,9 @@ export default function Button({ $target, onClick }) { - const $button = document.createElement("button"); + const $button = document.createElement('button'); $target.append($button); - $button.textContent = "Generate Quote"; + $button.textContent = 'Generate Quote'; - $button.addEventListener("click", (e) => { + $button.addEventListener('click', (e) => { onClick(); }); } diff --git a/project3-RandomQuoteGenerator/src/Project3Page.js b/project3-RandomQuoteGenerator/src/Project3Page.js index 9476a45..126d504 100644 --- a/project3-RandomQuoteGenerator/src/Project3Page.js +++ b/project3-RandomQuoteGenerator/src/Project3Page.js @@ -1,9 +1,9 @@ -import App from "./App.js"; +import App from './App.js'; export default function Project3Page({ $target }) { - const $page = document.createElement("div"); + const $page = document.createElement('div'); - $page.className = "project3 page"; + $page.className = 'project3 page'; new App({ $target: $page }); diff --git a/project3-RandomQuoteGenerator/src/QuoteBox.js b/project3-RandomQuoteGenerator/src/QuoteBox.js index 6d6a0fc..49afb46 100644 --- a/project3-RandomQuoteGenerator/src/QuoteBox.js +++ b/project3-RandomQuoteGenerator/src/QuoteBox.js @@ -1,11 +1,11 @@ export default function QuoteBox({ $target }) { - const $box = document.createElement("div"); + const $box = document.createElement('div'); $target.append($box); - $box.className = "quoteContainer"; + $box.className = 'quoteContainer'; this.state = { - quote: "", - author: "", + quote: '', + author: '', }; this.setState = (nextState) => { diff --git a/project3-RandomQuoteGenerator/src/api.js b/project3-RandomQuoteGenerator/src/api.js index 4467b8d..4eacc00 100644 --- a/project3-RandomQuoteGenerator/src/api.js +++ b/project3-RandomQuoteGenerator/src/api.js @@ -1,11 +1,11 @@ -export const API_END_POINT = "https://free-quotes-api.herokuapp.com/"; +export const API_END_POINT = 'https://free-quotes-api.herokuapp.com/'; export const request = async () => { try { const res = await fetch(API_END_POINT); if (!res.ok) { - throw new Error("API ํ˜ธ์ถœ ์—๋Ÿฌ"); + throw new Error('API ํ˜ธ์ถœ ์—๋Ÿฌ'); } return await res.json(); } catch (e) { diff --git a/project3-RandomQuoteGenerator/src/main.js b/project3-RandomQuoteGenerator/src/main.js index 4628364..e21a427 100644 --- a/project3-RandomQuoteGenerator/src/main.js +++ b/project3-RandomQuoteGenerator/src/main.js @@ -1,5 +1,5 @@ -import App from "./App.js"; +import App from './App.js'; -const $app = document.querySelector("#app"); +const $app = document.querySelector('#app'); new App({ $target: $app }); diff --git a/project3-RandomQuoteGenerator/src/style.css b/project3-RandomQuoteGenerator/src/style.css index 661116d..f581cee 100644 --- a/project3-RandomQuoteGenerator/src/style.css +++ b/project3-RandomQuoteGenerator/src/style.css @@ -1,4 +1,4 @@ -@import url("https://fonts.googleapis.com/css2?family=Caveat&family=Dancing+Script&display=swap"); +@import url('https://fonts.googleapis.com/css2?family=Caveat&family=Dancing+Script&display=swap'); * { margin: 0; @@ -12,8 +12,8 @@ --button-hover-color: #138496; --button-font-color: white; --button-border-color: #117a8b; - --font-quote: "Caveat", cursive; - --font-author: "Dancing Script", cursive; + --font-quote: 'Caveat', cursive; + --font-author: 'Dancing Script', cursive; } #app { diff --git a/src/components/App.js b/src/components/App.js index 0edeb01..7b1ac56 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -1,15 +1,15 @@ -import Header from "../layouts/Header.js"; +import Header from '../layouts/Header.js'; -import HomePage from "../pages/HomePage.js"; -import NotFoundPage from "../pages/NotFoundPage.js"; -import Project1Page from "../../project1-colors/src/Project1Page.js"; -import Project2Page from "../../project2-HexColorsGradient/src/Project2Page.js"; -import Project3Page from "../../project3-RandomQuoteGenerator/src/Project3Page.js"; +import HomePage from '../pages/HomePage.js'; +import NotFoundPage from '../pages/NotFoundPage.js'; +import Project1Page from '../../project1-colors/src/Project1Page.js'; +import Project2Page from '../../project2-HexColorsGradient/src/Project2Page.js'; +import Project3Page from '../../project3-RandomQuoteGenerator/src/Project3Page.js'; export default function App({ $target }) { new Header({ $target }); - const $main = document.createElement("main"); + const $main = document.createElement('main'); $target.append($main); const homePage = new HomePage({ $target: $main }); @@ -25,7 +25,7 @@ export default function App({ $target }) { if (pathname === `/`) { homePage.render(); } else if (pathname.indexOf(`/project/`) === 0) { - const [, , projectId] = pathname.split("/"); + const [, , projectId] = pathname.split('/'); switch (parseInt(projectId)) { case 1: project1Page.render(); @@ -44,8 +44,8 @@ export default function App({ $target }) { this.route(); - window.addEventListener("click", (e) => { - if (e.target.className === "link") { + window.addEventListener('click', (e) => { + if (e.target.className === 'link') { e.preventDefault(); history.pushState(null, null, e.target.href); diff --git a/src/data/projectList.js b/src/data/projectList.js index d3c72e6..e43441d 100644 --- a/src/data/projectList.js +++ b/src/data/projectList.js @@ -1,5 +1,5 @@ export const projectList = [ - { id: 1, title: "Colors" }, - { id: 2, title: "Hex Colors Gradient" }, - { id: 3, title: "Random Quote Generator" }, + { id: 1, title: 'Colors' }, + { id: 2, title: 'Hex Colors Gradient' }, + { id: 3, title: 'Random Quote Generator' }, ]; diff --git a/src/layouts/Header.js b/src/layouts/Header.js index 3ecb364..b197923 100644 --- a/src/layouts/Header.js +++ b/src/layouts/Header.js @@ -1,5 +1,5 @@ export default function Header({ $target }) { - const $header = document.createElement("header"); + const $header = document.createElement('header'); $target.append($header); this.render = () => { diff --git a/src/main.js b/src/main.js index cbd472b..f1e0972 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,5 @@ -import App from "./components/App.js"; +import App from './components/App.js'; -const $target = document.querySelector("#app"); +const $target = document.querySelector('#app'); new App({ $target }); diff --git a/src/pages/HomePage.js b/src/pages/HomePage.js index b3ed3c5..a62d487 100644 --- a/src/pages/HomePage.js +++ b/src/pages/HomePage.js @@ -1,8 +1,8 @@ -import { projectList } from "../data/projectList.js"; +import { projectList } from '../data/projectList.js'; export default function HomePage({ $target }) { - const $page = document.createElement("div"); - $page.className = "home"; + const $page = document.createElement('div'); + $page.className = 'home'; this.state = projectList; @@ -13,9 +13,9 @@ export default function HomePage({ $target }) { .map( (project) => /* html */ `
  • ${project.id}. ${project.title}
    • - ` + `, ) - .join("")} + .join('')} `; diff --git a/src/pages/NotFoundPage.js b/src/pages/NotFoundPage.js index 6b57c54..f04ad5d 100644 --- a/src/pages/NotFoundPage.js +++ b/src/pages/NotFoundPage.js @@ -1,6 +1,6 @@ export default function NotFoundPage({ $target }) { - const $page = document.createElement("div"); - $page.className = "notFound page"; + const $page = document.createElement('div'); + $page.className = 'notFound page'; this.render = () => { $page.innerHTML = /* html */ ` diff --git a/src/styles/project3.css b/src/styles/project3.css index e3bae4b..e1184c1 100644 --- a/src/styles/project3.css +++ b/src/styles/project3.css @@ -1,4 +1,4 @@ -@import url("https://fonts.googleapis.com/css2?family=Caveat&family=Dancing+Script&display=swap"); +@import url('https://fonts.googleapis.com/css2?family=Caveat&family=Dancing+Script&display=swap'); :root .project3 { --background-gradient: radial-gradient(#2b8fb4, #67489f); @@ -7,8 +7,8 @@ --button-hover-color: #138496; --button-font-color: white; --button-border-color: #117a8b; - --font-quote: "Caveat", cursive; - --font-author: "Dancing Script", cursive; + --font-quote: 'Caveat', cursive; + --font-author: 'Dancing Script', cursive; } .project3 { diff --git a/src/styles/style.css b/src/styles/style.css index 54c53f3..24200ef 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -1,6 +1,6 @@ -@import url("./project1.css"); -@import url("./project2.css"); -@import url("./project3.css"); +@import url('./project1.css'); +@import url('./project2.css'); +@import url('./project3.css'); :root { --primary-color: #306ba4; @@ -20,7 +20,7 @@ a { } body { - font-family: "Noto Sans KR", sans-serif; + font-family: 'Noto Sans KR', sans-serif; font-weight: bold; letter-spacing: -1px; } From e9368cebe844ad028d11f6de105ca054e1953292 Mon Sep 17 00:00:00 2001 From: limkhl Date: Wed, 22 Sep 2021 21:51:49 +0900 Subject: [PATCH 3/8] =?UTF-8?q?add:=20project=204=20=EB=A9=94=EC=84=B8?= =?UTF-8?q?=EC=A7=80=20=EB=B3=B4=EB=82=B4=EA=B8=B0=20UI=20=EA=B5=AC?= =?UTF-8?q?=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project4-TheMessage/index.html | 20 ++++++ project4-TheMessage/src/App.js | 23 ++++++ project4-TheMessage/src/Form.js | 25 +++++++ project4-TheMessage/src/main.js | 8 +++ project4-TheMessage/src/style.css | 114 ++++++++++++++++++++++++++++++ src/components/App.js | 5 ++ src/data/projectList.js | 4 ++ src/pages/Project4Page.js | 13 ++++ src/styles/project4.css | 100 ++++++++++++++++++++++++++ src/styles/style.css | 4 +- 10 files changed, 315 insertions(+), 1 deletion(-) create mode 100644 project4-TheMessage/index.html create mode 100644 project4-TheMessage/src/App.js create mode 100644 project4-TheMessage/src/Form.js create mode 100644 project4-TheMessage/src/main.js create mode 100644 project4-TheMessage/src/style.css create mode 100644 src/pages/Project4Page.js create mode 100644 src/styles/project4.css diff --git a/project4-TheMessage/index.html b/project4-TheMessage/index.html new file mode 100644 index 0000000..acc6440 --- /dev/null +++ b/project4-TheMessage/index.html @@ -0,0 +1,20 @@ + + + + + + + ๋ฉ”์„ธ์ง€ ๋ณด๋‚ด๊ธฐ + + + + + + +
    + + + diff --git a/project4-TheMessage/src/App.js b/project4-TheMessage/src/App.js new file mode 100644 index 0000000..52af36d --- /dev/null +++ b/project4-TheMessage/src/App.js @@ -0,0 +1,23 @@ +import Form from './Form.js'; + +export default function App({ $target }) { + const $messageBox = document.createElement('div'); + const $previewBox = document.createElement('p'); + $messageBox.className = 'messageBox'; + $previewBox.className = 'previewBox'; + $target.append($messageBox); + + $messageBox.innerHTML = /* html */ ` +

    ๋ฉ”์‹œ์ง€ ๋ณด๋‚ด๊ธฐ

    +
    + `; + + new Form({ + $target: $messageBox, + onSubmit: (messageContent) => { + $previewBox.textContent = messageContent; + }, + }); + + $messageBox.append($previewBox); +} diff --git a/project4-TheMessage/src/Form.js b/project4-TheMessage/src/Form.js new file mode 100644 index 0000000..140883a --- /dev/null +++ b/project4-TheMessage/src/Form.js @@ -0,0 +1,25 @@ +export default function Form({ $target, onSubmit }) { + const $form = document.createElement('form'); + $target.append($form); + + $form.innerHTML = /* html */ ` + +
    + + +
    + + `; + + $form.addEventListener('submit', (e) => { + e.preventDefault(); + const $input = document.querySelector('#messageInput'); + if (!$input.value) { + alert('ํ•œ ๊ธ€์ž ์ด์ƒ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”.'); + return; + } + const messageContent = $input.value; + $input.value = ''; + onSubmit(messageContent); + }); +} diff --git a/project4-TheMessage/src/main.js b/project4-TheMessage/src/main.js new file mode 100644 index 0000000..ddd8e60 --- /dev/null +++ b/project4-TheMessage/src/main.js @@ -0,0 +1,8 @@ +import App from './App.js'; + +const $target = document.querySelector('main'); +const $page = document.createElement('div'); +$target.append($page); +$page.className = 'project4 page'; + +new App({ $target: $page }); diff --git a/project4-TheMessage/src/style.css b/project4-TheMessage/src/style.css new file mode 100644 index 0000000..dab56c5 --- /dev/null +++ b/project4-TheMessage/src/style.css @@ -0,0 +1,114 @@ +:root .project4 { + --bg-color: linear-gradient(to top, #a8edea 0%, #fed6e3 100%); + --base-font-family: 'Noto Sans KR', sans-serif; + --border-radius: 0.4rem; + --box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.4); + --base-margin: 1.3rem; + --base-padding: 1.6rem; + --base-button-padding: 0.5rem; + --base-button-border: 1px solid gray; + --base-button-color: #d4e1e6; + --base-button-hover-color: #f4d9e4; + --base-line-height: 1.6rem; +} + +.wrap { + width: 100vw; + height: 100vh; +} + +.page { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; +} + +.project4.page { + background-image: var(--bg-color); + padding: 1.6rem; + box-sizing: border-box; + flex-direction: row; + font-weight: bold; +} + +.project4 .messageBox { + font-family: var(--base-font-family); + padding: 0 var(--base-padding); + background-color: white; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); + flex-basis: 500px; + box-sizing: border-box; +} + +.project4 .messageBox h2 { + font-size: 1.5rem; + font-weight: bold; + padding: var(--base-padding); + text-align: center; +} + +.project4 .messageBox hr { + background-color: lightgray; + height: 2px; + border: 0; + margin-top: 0; +} + +.project4 .messageBox label { + display: block; + font-weight: normal; + margin: var(--base-margin) 0; +} + +.project4 .messageBox .inputBox { + display: flex; +} + +.project4 .messageBox .inputBox button { + padding: var(--base-button-padding); + border: var(--base-button-border); + border-right-width: 0; + border-radius: 0; + border-top-left-radius: var(--border-radius); +} + +.project4 .messageBox .inputBox button:hover { + background-color: var(--base-button-hover-color); +} + +.project4 .messageBox #messageInput { + flex-grow: 1; + padding: 0.5rem; + font-family: var(--base-font-family); + border: 1px solid gray; + border-radius: 0; + border-top-right-radius: var(--border-radius); +} + +.project4 .messageBox #messageInput:focus { + outline: none; +} + +.project4 .messageBox .button__submit { + width: 100%; + font-family: var(--base-font-family); + padding: var(--base-button-padding); + border-radius: 0; + border-bottom-left-radius: var(--border-radius); + border-bottom-right-radius: var(--border-radius); + border: var(--base-button-border); + border-top-width: 0; + background-color: var(--base-button-color); +} + +.project4 .messageBox .button__submit:hover { + background-color: var(--base-button-hover-color); +} + +.project4 .messageBox .previewBox { + padding: 1.4rem; + text-align: center; +} diff --git a/src/components/App.js b/src/components/App.js index 7b1ac56..708b931 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -5,6 +5,7 @@ import NotFoundPage from '../pages/NotFoundPage.js'; import Project1Page from '../../project1-colors/src/Project1Page.js'; import Project2Page from '../../project2-HexColorsGradient/src/Project2Page.js'; import Project3Page from '../../project3-RandomQuoteGenerator/src/Project3Page.js'; +import Project4Page from '../pages/Project4Page.js'; export default function App({ $target }) { new Header({ $target }); @@ -17,6 +18,7 @@ export default function App({ $target }) { const project1Page = new Project1Page({ $target: $main }); const project2Page = new Project2Page({ $target: $main }); const project3Page = new Project3Page({ $target: $main }); + const project4Page = new Project4Page({ $target: $main }); this.route = () => { $main.innerHTML = ``; @@ -36,6 +38,9 @@ export default function App({ $target }) { case 3: project3Page.render(); break; + case 4: + project4Page.render(); + break; } } else { notFoundPage.render(); diff --git a/src/data/projectList.js b/src/data/projectList.js index e43441d..e90c7ca 100644 --- a/src/data/projectList.js +++ b/src/data/projectList.js @@ -2,4 +2,8 @@ export const projectList = [ { id: 1, title: 'Colors' }, { id: 2, title: 'Hex Colors Gradient' }, { id: 3, title: 'Random Quote Generator' }, + { id: 4, title: 'The Message' }, + { id: 5, title: 'Counter' }, + { id: 6, title: 'Image Carousel' }, + { id: 7, title: 'Digital Clock' }, ]; diff --git a/src/pages/Project4Page.js b/src/pages/Project4Page.js new file mode 100644 index 0000000..19ed11d --- /dev/null +++ b/src/pages/Project4Page.js @@ -0,0 +1,13 @@ +import App from '../../project4-TheMessage/src/App.js'; + +export default function Project4Page({ $target }) { + const $page = document.createElement('div'); + + $page.className = 'project4 page'; + + new App({ $target: $page }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/src/styles/project4.css b/src/styles/project4.css new file mode 100644 index 0000000..3188472 --- /dev/null +++ b/src/styles/project4.css @@ -0,0 +1,100 @@ +:root .project4 { + --bg-color: linear-gradient(to top, #a8edea 0%, #fed6e3 100%); + --base-font-family: 'Noto Sans KR', sans-serif; + --border-radius: 0.4rem; + --box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.4); + --base-margin: 1.3rem; + --base-padding: 1.6rem; + --base-button-padding: 0.5rem; + --base-button-border: 1px solid gray; + --base-button-color: #d4e1e6; + --base-button-hover-color: #f4d9e4; + --base-line-height: 1.6rem; +} + +.project4.page { + background-image: var(--bg-color); + padding: 1.6rem; + box-sizing: border-box; + flex-direction: row; +} + +.project4 .messageBox { + font-family: var(--base-font-family); + padding: 0 var(--base-padding); + background-color: white; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); + flex-basis: 500px; +} + +.project4 .messageBox h2 { + font-size: 1.5rem; + font-weight: bold; + padding: var(--base-padding); + text-align: center; +} + +.project4 .messageBox hr { + background-color: lightgray; + height: 2px; + border: 0; + margin-top: 0; +} + +.project4 .messageBox label { + display: block; + font-weight: normal; + margin: var(--base-margin) 0; +} + +.project4 .messageBox .inputBox { + display: flex; +} + +.project4 .messageBox .inputBox button { + padding: var(--base-button-padding); + border: var(--base-button-border); + border-right-width: 0; + border-radius: 0; + border-top-left-radius: var(--border-radius); +} + +.project4 .messageBox .inputBox button:hover { + background-color: var(--base-button-hover-color); +} + +.project4 .messageBox #messageInput { + flex-grow: 1; + padding: 0.5rem; + font-family: var(--base-font-family); + border: 1px solid gray; + border-radius: 0; + border-top-right-radius: var(--border-radius); +} + +.project4 .messageBox #messageInput:focus { + outline: none; +} + +.project4 .messageBox .button__submit { + width: 100%; + font-family: var(--base-font-family); + padding: var(--base-button-padding); + border-radius: 0; + border-bottom-left-radius: var(--border-radius); + border-bottom-right-radius: var(--border-radius); + border: var(--base-button-border); + border-top-width: 0; + background-color: var(--base-button-color); +} + +.project4 .messageBox .button__submit:hover { + background-color: var(--base-button-hover-color); +} + +.project4 .messageBox .previewBox { + padding: 1.4rem; + text-align: center; + line-height: var(--base-line-height); +} diff --git a/src/styles/style.css b/src/styles/style.css index 24200ef..76af995 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -1,11 +1,13 @@ @import url('./project1.css'); @import url('./project2.css'); @import url('./project3.css'); +@import url('./project4.css'); :root { --primary-color: #306ba4; --highlight-color: #31d2f7; --border-radius: 1rem; + --base-font-family: 'Noto Sans KR', sans-serif; } * { @@ -20,7 +22,7 @@ a { } body { - font-family: 'Noto Sans KR', sans-serif; + font-family: var(--base-font-family); font-weight: bold; letter-spacing: -1px; } From 67240fba8982c273a26e801fcfad0ad92998de00 Mon Sep 17 00:00:00 2001 From: limkhl Date: Thu, 23 Sep 2021 07:07:54 +0900 Subject: [PATCH 4/8] =?UTF-8?q?add:=20project=205=20=EC=B9=B4=EC=9A=B4?= =?UTF-8?q?=ED=84=B0=20UI=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project5-Counter/index.html | 20 +++++++++ project5-Counter/src/App.js | 30 +++++++++++++ project5-Counter/src/Button.js | 11 +++++ project5-Counter/src/Constants.js | 2 + project5-Counter/src/Count.js | 17 +++++++ project5-Counter/src/main.js | 8 ++++ project5-Counter/src/style.css | 74 +++++++++++++++++++++++++++++++ src/components/App.js | 5 +++ src/pages/Project5Page.js | 13 ++++++ src/styles/project5.css | 62 ++++++++++++++++++++++++++ src/styles/style.css | 1 + 11 files changed, 243 insertions(+) create mode 100644 project5-Counter/index.html create mode 100644 project5-Counter/src/App.js create mode 100644 project5-Counter/src/Button.js create mode 100644 project5-Counter/src/Constants.js create mode 100644 project5-Counter/src/Count.js create mode 100644 project5-Counter/src/main.js create mode 100644 project5-Counter/src/style.css create mode 100644 src/pages/Project5Page.js create mode 100644 src/styles/project5.css diff --git a/project5-Counter/index.html b/project5-Counter/index.html new file mode 100644 index 0000000..7c37130 --- /dev/null +++ b/project5-Counter/index.html @@ -0,0 +1,20 @@ + + + + + + + ์นด์šดํ„ฐ + + + + + + +
    + + + diff --git a/project5-Counter/src/App.js b/project5-Counter/src/App.js new file mode 100644 index 0000000..6f520bf --- /dev/null +++ b/project5-Counter/src/App.js @@ -0,0 +1,30 @@ +import Button from './Button.js'; +import * as feature from './Constants.js'; +import Count from './Count.js'; + +export default function App({ $target }) { + const $container = document.createElement('div'); + $container.className = 'countContainer'; + $target.append($container); + $container.innerHTML = /* html */ ` +

    Counter

    + `; + + const count = new Count({ $target: $container, initialState: 0 }); + + new Button({ + $target: $container, + feature: feature.INCREASE, + onClick: () => { + count.setState(count.state + 1); + }, + }); + + new Button({ + $target: $container, + feature: feature.DECREASE, + onClick: () => { + count.setState(count.state - 1); + }, + }); +} diff --git a/project5-Counter/src/Button.js b/project5-Counter/src/Button.js new file mode 100644 index 0000000..3e2ff37 --- /dev/null +++ b/project5-Counter/src/Button.js @@ -0,0 +1,11 @@ +export default function Button({ $target, feature, onClick }) { + const $button = document.createElement('button'); + $target.append($button); + + $button.textContent = feature; + $button.className = feature; + + $button.addEventListener('click', (e) => { + onClick(); + }); +} diff --git a/project5-Counter/src/Constants.js b/project5-Counter/src/Constants.js new file mode 100644 index 0000000..9df8287 --- /dev/null +++ b/project5-Counter/src/Constants.js @@ -0,0 +1,2 @@ +export const INCREASE = 'Increase'; +export const DECREASE = 'Decrease'; diff --git a/project5-Counter/src/Count.js b/project5-Counter/src/Count.js new file mode 100644 index 0000000..6d63eae --- /dev/null +++ b/project5-Counter/src/Count.js @@ -0,0 +1,17 @@ +export default function Count({ $target, initialState }) { + const $count = document.createElement('p'); + $target.append($count); + + this.state = initialState; + + this.setState = (nextState) => { + this.state = nextState; + this.render(); + }; + + this.render = () => { + $count.textContent = this.state; + }; + + this.render(); +} diff --git a/project5-Counter/src/main.js b/project5-Counter/src/main.js new file mode 100644 index 0000000..d425e6b --- /dev/null +++ b/project5-Counter/src/main.js @@ -0,0 +1,8 @@ +import App from './App.js'; + +const $target = document.querySelector('main'); +const $page = document.createElement('div'); +$target.append($page); +$page.className = 'project5 page'; + +new App({ $target: $page }); diff --git a/project5-Counter/src/style.css b/project5-Counter/src/style.css new file mode 100644 index 0000000..7c1db8d --- /dev/null +++ b/project5-Counter/src/style.css @@ -0,0 +1,74 @@ +:root .project5 { + --bg-color: linear-gradient(to top, #9795f0 0%, #fbc8d4 100%); + --base-font-family: 'Noto Sans KR', sans-serif; + --border-radius: 0.4rem; + --box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.4); + --base-margin: 1.3rem; + --base-padding: 1.6rem; + --button-padding: 0.5rem; + --button-border: 1px solid gray; + --button-color: rgb(52, 58, 64); + --button-bg-color: transparent; + --button-hover-color: purple; + --box-border: 5px solid rebeccapurple; +} + +.wrap { + width: 100vw; + height: 100vh; +} + +.page { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; +} + +.project5 { + background-image: var(--bg-color); + font-weight: bold; +} + +.project5 button { + padding: 10px 15px; + background-color: var(--button-bg-color); + border-radius: var(--border-radius); + cursor: pointer; + outline: 0; + color: var(--button-color); + font-size: 16px; + border: var(--button-border); + transition: all 0.2s; +} + +.project5 button:hover { + color: white; + font-weight: 500; + background-color: var(--button-hover-color); +} + +.project5 button + button { + margin-left: 20px; +} + +.project5 .countContainer { + text-align: center; + background-color: white; + flex-basis: 500px; + padding: var(--base-padding); + box-sizing: border-box; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); + border: var(--box-border); +} + +.project5 .countContainer h2 { + font-size: 2rem; +} + +.project5 .countContainer p { + font-size: 6.5rem; + line-height: 12rem; +} diff --git a/src/components/App.js b/src/components/App.js index 708b931..a68ad0d 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -6,6 +6,7 @@ import Project1Page from '../../project1-colors/src/Project1Page.js'; import Project2Page from '../../project2-HexColorsGradient/src/Project2Page.js'; import Project3Page from '../../project3-RandomQuoteGenerator/src/Project3Page.js'; import Project4Page from '../pages/Project4Page.js'; +import Project5Page from '../pages/Project5Page.js'; export default function App({ $target }) { new Header({ $target }); @@ -19,6 +20,7 @@ export default function App({ $target }) { const project2Page = new Project2Page({ $target: $main }); const project3Page = new Project3Page({ $target: $main }); const project4Page = new Project4Page({ $target: $main }); + const project5Page = new Project5Page({ $target: $main }); this.route = () => { $main.innerHTML = ``; @@ -41,6 +43,9 @@ export default function App({ $target }) { case 4: project4Page.render(); break; + case 5: + project5Page.render(); + break; } } else { notFoundPage.render(); diff --git a/src/pages/Project5Page.js b/src/pages/Project5Page.js new file mode 100644 index 0000000..c2f2d4b --- /dev/null +++ b/src/pages/Project5Page.js @@ -0,0 +1,13 @@ +import App from '../../project5-Counter/src/App.js'; + +export default function Project5Page({ $target }) { + const $page = document.createElement('div'); + + $page.className = 'project5 page'; + + new App({ $target: $page }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/src/styles/project5.css b/src/styles/project5.css new file mode 100644 index 0000000..b0ca9d4 --- /dev/null +++ b/src/styles/project5.css @@ -0,0 +1,62 @@ +:root .project5 { + --bg-color: linear-gradient(to top, #9795f0 0%, #fbc8d4 100%); + --base-font-family: 'Noto Sans KR', sans-serif; + --border-radius: 0.4rem; + --box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.4); + --base-margin: 1.3rem; + --base-padding: 1.6rem; + --button-padding: 0.5rem; + --button-border: 1px solid gray; + --button-color: rgb(52, 58, 64); + --button-bg-color: transparent; + --button-hover-color: purple; + --box-border: 5px solid rebeccapurple; +} + +.project5.page { + background-image: var(--bg-color); + font-weight: bold; + flex-direction: row; +} + +.project5 button { + padding: 10px 15px; + background-color: var(--button-bg-color); + border-radius: var(--border-radius); + cursor: pointer; + outline: 0; + color: var(--button-color); + font-size: 16px; + border: var(--button-border); + transition: all 0.2s; +} + +.project5 button:hover { + color: white; + font-weight: 500; + background-color: var(--button-hover-color); +} + +.project5 button + button { + margin-left: 20px; +} + +.project5 .countContainer { + text-align: center; + background-color: white; + flex-basis: 500px; + padding: var(--base-padding); + box-sizing: border-box; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); + border: var(--box-border); +} + +.project5 .countContainer h2 { + font-size: 2rem; +} + +.project5 .countContainer p { + font-size: 6.5rem; + line-height: 12rem; +} diff --git a/src/styles/style.css b/src/styles/style.css index 76af995..5062a88 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -2,6 +2,7 @@ @import url('./project2.css'); @import url('./project3.css'); @import url('./project4.css'); +@import url('./project5.css'); :root { --primary-color: #306ba4; From 87f39121ca6444808d3c24261438b5ef698c219c Mon Sep 17 00:00:00 2001 From: limkhl Date: Fri, 24 Sep 2021 10:05:06 +0900 Subject: [PATCH 5/8] =?UTF-8?q?add:=20project=206=20=EC=9D=B4=EB=AF=B8?= =?UTF-8?q?=EC=A7=80=20=EC=BA=90=EB=9F=AC=EC=85=80=20UI=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 --- project6-ImageCarousel/index.html | 20 ++++ project6-ImageCarousel/src/App.js | 57 +++++++++++ project6-ImageCarousel/src/Controller.js | 19 ++++ project6-ImageCarousel/src/Dots.js | 11 +++ project6-ImageCarousel/src/Slide.js | 18 ++++ project6-ImageCarousel/src/constants.js | 5 + project6-ImageCarousel/src/main.js | 8 ++ project6-ImageCarousel/src/style.css | 116 +++++++++++++++++++++++ src/components/App.js | 5 + src/pages/Project6Page.js | 13 +++ src/styles/project6.css | 105 ++++++++++++++++++++ src/styles/style.css | 1 + 12 files changed, 378 insertions(+) create mode 100644 project6-ImageCarousel/index.html create mode 100644 project6-ImageCarousel/src/App.js create mode 100644 project6-ImageCarousel/src/Controller.js create mode 100644 project6-ImageCarousel/src/Dots.js create mode 100644 project6-ImageCarousel/src/Slide.js create mode 100644 project6-ImageCarousel/src/constants.js create mode 100644 project6-ImageCarousel/src/main.js create mode 100644 project6-ImageCarousel/src/style.css create mode 100644 src/pages/Project6Page.js create mode 100644 src/styles/project6.css diff --git a/project6-ImageCarousel/index.html b/project6-ImageCarousel/index.html new file mode 100644 index 0000000..2c89d13 --- /dev/null +++ b/project6-ImageCarousel/index.html @@ -0,0 +1,20 @@ + + + + + + + ์ด๋ฏธ์ง€ ์บ๋Ÿฌ์…€ + + + + + + +
    + + + diff --git a/project6-ImageCarousel/src/App.js b/project6-ImageCarousel/src/App.js new file mode 100644 index 0000000..7e7558c --- /dev/null +++ b/project6-ImageCarousel/src/App.js @@ -0,0 +1,57 @@ +import Controller from './Controller.js'; +import Dots from './Dots.js'; +import Slide from './Slide.js'; + +export default function App({ $target }) { + const $container = document.createElement('div'); + const $slideContainer = document.createElement('div'); + $container.className = 'container'; + $slideContainer.className = 'slideContainer'; + $target.append($container); + $container.append($slideContainer); + + this.state = { + imgLength: 7, + slideIndex: 1, + }; + + const { imgLength } = this.state; + let { slideIndex } = this.state; + + for (let i = 1; i <= imgLength; i++) { + new Slide({ + $target: $slideContainer, + initialState: { + curIndex: i, + imgLength, + }, + }); + } + + new Dots({ $target: $container, initialState: { imgLength } }); + + const showSlides = (n) => { + const slides = document.querySelectorAll('.slide'); + const dots = document.querySelectorAll('.dot'); + + if (n > imgLength) { + slideIndex = 1; + } + if (n < 1) { + slideIndex = imgLength; + } + slides.forEach((slide) => (slide.style.display = 'none')); + dots.forEach((dot) => (dot.className = dot.className.replace(' active', ''))); + + const curSlide = slides[slideIndex - 1]; + const curdot = dots[slideIndex - 1]; + curSlide.style.display = 'block'; + curdot.className += ' active'; + }; + + // slide๊ฐ€ ๋ Œ๋”๋˜๊ธฐ ์ „์— showSlides()๊ฐ€ ์‹คํ–‰๋˜๋Š” ๋ฌธ์ œ๊ฐ€ ์žˆ์–ด์„œ + // wep API๋ฅผ ์ด์šฉํ•ด slide ๋ Œ๋” ์ดํ›„์— showSlides()๋ฅผ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๊ฒŒ๋” ํ•จ + setTimeout(() => showSlides(slideIndex), 0); + + new Controller({ $target: $slideContainer, onClick: (n) => showSlides((slideIndex += n)) }); +} diff --git a/project6-ImageCarousel/src/Controller.js b/project6-ImageCarousel/src/Controller.js new file mode 100644 index 0000000..0f9c878 --- /dev/null +++ b/project6-ImageCarousel/src/Controller.js @@ -0,0 +1,19 @@ +export default function Controller({ $target, onClick }) { + const $prevButton = document.createElement('a'); + const $nextButton = document.createElement('a'); + $prevButton.className = 'prev controlButton'; + $prevButton.textContent = 'โฎ'; + $nextButton.className = 'next controlButton'; + $nextButton.textContent = 'โฏ'; + $target.append($prevButton, $nextButton); + + window.addEventListener('click', (e) => { + if (e.target.classList.contains('prev')) { + onClick(-1); + } + + if (e.target.classList.contains('next')) { + onClick(1); + } + }); +} diff --git a/project6-ImageCarousel/src/Dots.js b/project6-ImageCarousel/src/Dots.js new file mode 100644 index 0000000..a28ca48 --- /dev/null +++ b/project6-ImageCarousel/src/Dots.js @@ -0,0 +1,11 @@ +export default function Dots({ $target, initialState }) { + const $dotsContainer = document.createElement('div'); + $dotsContainer.className = 'dotsContainer'; + $target.append($dotsContainer); + + this.state = initialState; + + $dotsContainer.innerHTML = /* html */ ` + ${``.repeat(this.state.imgLength)} + `; +} diff --git a/project6-ImageCarousel/src/Slide.js b/project6-ImageCarousel/src/Slide.js new file mode 100644 index 0000000..f5f7589 --- /dev/null +++ b/project6-ImageCarousel/src/Slide.js @@ -0,0 +1,18 @@ +import { IMG_API_END_POINT, KEYWORDS_FOR_IMAGE } from './constants.js'; + +export default function Slide({ $target, initialState }) { + const $slide = document.createElement('div'); + $slide.className = 'slide fade'; + $target.append($slide); + + this.state = initialState; + + const { curIndex, imgLength } = this.state; + + fetch(`${IMG_API_END_POINT}${KEYWORDS_FOR_IMAGE[curIndex - 1]}`).then((res) => { + $slide.innerHTML = /* html */ ` +
    ${curIndex} / ${imgLength}
    + slide image + `; + }); +} diff --git a/project6-ImageCarousel/src/constants.js b/project6-ImageCarousel/src/constants.js new file mode 100644 index 0000000..88c50bd --- /dev/null +++ b/project6-ImageCarousel/src/constants.js @@ -0,0 +1,5 @@ +export const IMG_API_END_POINT = `https://source.unsplash.com/1600x900/?`; + +// ๊ฐ™์€ api๋ฅผ ํ•œ ๋ฒˆ์— ์—ฌ๋Ÿฌ ๋ฒˆ ํ˜ธ์ถœํ•˜๋ฉด ๊ฐ™์€ ์ด๋ฏธ์ง€๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋Š” ๋ฌธ์ œ๊ฐ€ ์žˆ์–ด +// ๊ฐ๊ฐ ๊ฒ€์ƒ‰ ํ‚ค์›Œ๋“œ๋ฅผ ๋‹ฌ๋ฆฌ ์ง€์ •ํ•ด์คŒ +export const KEYWORDS_FOR_IMAGE = ['nature', 'water', 'beach', 'sea', 'park', 'mountain', 'star']; diff --git a/project6-ImageCarousel/src/main.js b/project6-ImageCarousel/src/main.js new file mode 100644 index 0000000..963f34b --- /dev/null +++ b/project6-ImageCarousel/src/main.js @@ -0,0 +1,8 @@ +import App from './App.js'; + +const $target = document.querySelector('main'); +const $page = document.createElement('div'); +$target.append($page); +$page.className = 'project6 page'; + +new App({ $target: $page }); diff --git a/project6-ImageCarousel/src/style.css b/project6-ImageCarousel/src/style.css new file mode 100644 index 0000000..93697ac --- /dev/null +++ b/project6-ImageCarousel/src/style.css @@ -0,0 +1,116 @@ +.wrap { + width: 100vw; + height: 100vh; +} + +.page { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; +} + +.project6 { + box-sizing: border-box; + padding: 1rem; + background-image: var(--bg-color); + font-weight: bold; +} + +.project6 .container { + width: 70%; + position: relative; + overflow: hidden; +} + +.project6 .slideContainer { + position: relative; +} + +.project6 .slideContainer .slide { + display: none; +} + +.project6 .slideContainer .slideImg { + width: 100%; +} + +.project6 .slideContainer .numberText { + color: #f2f2f2; + font-size: 16px; + padding: 8px 12px; + position: absolute; + top: 0; + background-color: rgba(0, 0, 0, 0.4); + border-radius: 1rem; + margin-top: 10px; + margin-left: 10px; +} + +.project6 .fade { + animation-name: fade; + animation-duration: 1.5s; +} + +.project6 .controlButton { + cursor: pointer; + position: absolute; + top: 50%; + margin-top: -22px; + padding: 16px; + color: white; + font-weight: bold; + font-size: 18px; + transition: 0.6s ease; + border-radius: 0 3px 3px 0; +} + +.project6 .controlButton:hover { + background-color: rgba(0, 0, 0, 0.8); +} + +.project6 .controlButton.next { + right: 0; + border-radius: 3px 0 0 3px; +} + +.project6 .dotsContainer { + padding: 1rem; + text-align: center; +} + +.project6 .dotsContainer .dot { + height: 10px; + width: 10px; + margin: 0 5px; + background-color: #bbb; + border-radius: 50%; + display: inline-block; + transition: background-color 0.6s ease; +} + +.project6 .dotsContainer .dot.active { + background-color: #717171; +} + +@keyframes fade { + from { + opacity: 0.4; + } + to { + opacity: 1; + } +} + +@media (max-width: 800px) { + .project6 .container { + width: 100%; + } +} + +@media (min-width: 1400px) { + .project6 .container { + width: 60%; + } +} diff --git a/src/components/App.js b/src/components/App.js index a68ad0d..47dfde6 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -7,6 +7,7 @@ import Project2Page from '../../project2-HexColorsGradient/src/Project2Page.js'; import Project3Page from '../../project3-RandomQuoteGenerator/src/Project3Page.js'; import Project4Page from '../pages/Project4Page.js'; import Project5Page from '../pages/Project5Page.js'; +import Project6Page from '../pages/Project6Page.js'; export default function App({ $target }) { new Header({ $target }); @@ -21,6 +22,7 @@ export default function App({ $target }) { const project3Page = new Project3Page({ $target: $main }); const project4Page = new Project4Page({ $target: $main }); const project5Page = new Project5Page({ $target: $main }); + const project6Page = new Project6Page({ $target: $main }); this.route = () => { $main.innerHTML = ``; @@ -46,6 +48,9 @@ export default function App({ $target }) { case 5: project5Page.render(); break; + case 6: + project6Page.render(); + break; } } else { notFoundPage.render(); diff --git a/src/pages/Project6Page.js b/src/pages/Project6Page.js new file mode 100644 index 0000000..dc7babd --- /dev/null +++ b/src/pages/Project6Page.js @@ -0,0 +1,13 @@ +import App from '../../project6-ImageCarousel/src/App.js'; + +export default function Project6Page({ $target }) { + const $page = document.createElement('div'); + + $page.className = 'project6 page'; + + new App({ $target: $page }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/src/styles/project6.css b/src/styles/project6.css new file mode 100644 index 0000000..4666638 --- /dev/null +++ b/src/styles/project6.css @@ -0,0 +1,105 @@ +.project6 { + box-sizing: border-box; + padding: 1rem; + background-image: var(--bg-color); + font-weight: bold; +} + +.project6 .container { + width: 70%; + position: relative; + overflow: hidden; +} + +.project6 .slideContainer { + position: relative; +} + +.project6 .slideContainer .slide { + display: none; +} + +.project6 .slideContainer .slideImg { + width: 100%; +} + +.project6 .slideContainer .numberText { + color: #f2f2f2; + font-size: 16px; + padding: 8px 12px; + position: absolute; + top: 0; + background-color: rgba(0, 0, 0, 0.4); + border-radius: 1rem; + margin-top: 10px; + margin-left: 10px; + letter-spacing: 0; +} + +.project6 .fade { + animation-name: fade; + animation-duration: 1.5s; +} + +.project6 .controlButton { + cursor: pointer; + position: absolute; + top: 50%; + margin-top: -22px; + padding: 16px; + color: white; + font-weight: bold; + font-size: 18px; + transition: 0.6s ease; + border-radius: 0 3px 3px 0; + width: auto; +} + +.project6 .controlButton:hover { + background-color: rgba(0, 0, 0, 0.8); +} + +.project6 .controlButton.next { + right: 0; + border-radius: 3px 0 0 3px; +} + +.project6 .dotsContainer { + padding: 1rem; + text-align: center; +} + +.project6 .dotsContainer .dot { + height: 10px; + width: 10px; + margin: 0 5px; + background-color: #bbb; + border-radius: 50%; + display: inline-block; + transition: background-color 0.6s ease; +} + +.project6 .dotsContainer .dot.active { + background-color: #717171; +} + +@keyframes fade { + from { + opacity: 0.4; + } + to { + opacity: 1; + } +} + +@media (max-width: 800px) { + .project6 .container { + width: 100%; + } +} + +@media (min-width: 1400px) { + .project6 .container { + width: 60%; + } +} diff --git a/src/styles/style.css b/src/styles/style.css index 5062a88..e7ba378 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -3,6 +3,7 @@ @import url('./project3.css'); @import url('./project4.css'); @import url('./project5.css'); +@import url('./project6.css'); :root { --primary-color: #306ba4; From 808c18c50886b43593ef18e567ea309360256043 Mon Sep 17 00:00:00 2001 From: limkhl Date: Fri, 24 Sep 2021 10:26:02 +0900 Subject: [PATCH 6/8] =?UTF-8?q?fix:=20SPA=20=ED=8E=98=EC=9D=B4=EC=A7=80?= =?UTF-8?q?=EC=97=90=EC=84=9C=20project=206=20=ED=8E=98=EC=9D=B4=EC=A7=80?= =?UTF-8?q?=20=EC=A7=84=EC=9E=85=20=EC=8B=9C=20=EB=B2=84=EA=B7=B8=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project6-ImageCarousel/src/App.js | 10 +++++++--- src/pages/Project6Page.js | 3 ++- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/project6-ImageCarousel/src/App.js b/project6-ImageCarousel/src/App.js index 7e7558c..3c679c4 100644 --- a/project6-ImageCarousel/src/App.js +++ b/project6-ImageCarousel/src/App.js @@ -49,9 +49,13 @@ export default function App({ $target }) { curdot.className += ' active'; }; - // slide๊ฐ€ ๋ Œ๋”๋˜๊ธฐ ์ „์— showSlides()๊ฐ€ ์‹คํ–‰๋˜๋Š” ๋ฌธ์ œ๊ฐ€ ์žˆ์–ด์„œ - // wep API๋ฅผ ์ด์šฉํ•ด slide ๋ Œ๋” ์ดํ›„์— showSlides()๋ฅผ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๊ฒŒ๋” ํ•จ - setTimeout(() => showSlides(slideIndex), 0); + this.init = () => { + // slide๊ฐ€ ๋ Œ๋”๋˜๊ธฐ ์ „์— showSlides()๊ฐ€ ์‹คํ–‰๋˜๋Š” ๋ฌธ์ œ๊ฐ€ ์žˆ์–ด์„œ + // wep API๋ฅผ ์ด์šฉํ•ด slide ๋ Œ๋” ์ดํ›„์— showSlides()๋ฅผ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๊ฒŒ๋” ํ•จ + setTimeout(() => showSlides(slideIndex), 0); + }; + + this.init(); new Controller({ $target: $slideContainer, onClick: (n) => showSlides((slideIndex += n)) }); } diff --git a/src/pages/Project6Page.js b/src/pages/Project6Page.js index dc7babd..29dd35c 100644 --- a/src/pages/Project6Page.js +++ b/src/pages/Project6Page.js @@ -5,9 +5,10 @@ export default function Project6Page({ $target }) { $page.className = 'project6 page'; - new App({ $target: $page }); + const app = new App({ $target: $page }); this.render = () => { $target.append($page); + app.init(); }; } From c91f69b6ef64033a09b92e619c56cf8f2a5bf157 Mon Sep 17 00:00:00 2001 From: limkhl Date: Fri, 24 Sep 2021 11:45:19 +0900 Subject: [PATCH 7/8] =?UTF-8?q?add:=20project=207=20=EB=94=94=EC=A7=80?= =?UTF-8?q?=ED=84=B8=20=EC=8B=9C=EA=B3=84=20UI=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project6-ImageCarousel/src/style.css | 1 - project7-DigitalClock/index.html | 20 ++++++++++++ project7-DigitalClock/src/App.js | 5 +++ project7-DigitalClock/src/Clock.js | 35 ++++++++++++++++++++ project7-DigitalClock/src/main.js | 8 +++++ project7-DigitalClock/src/style.css | 49 ++++++++++++++++++++++++++++ src/components/App.js | 5 +++ src/pages/Project7Page.js | 13 ++++++++ src/styles/project7.css | 35 ++++++++++++++++++++ src/styles/style.css | 1 + 10 files changed, 171 insertions(+), 1 deletion(-) create mode 100644 project7-DigitalClock/index.html create mode 100644 project7-DigitalClock/src/App.js create mode 100644 project7-DigitalClock/src/Clock.js create mode 100644 project7-DigitalClock/src/main.js create mode 100644 project7-DigitalClock/src/style.css create mode 100644 src/pages/Project7Page.js create mode 100644 src/styles/project7.css diff --git a/project6-ImageCarousel/src/style.css b/project6-ImageCarousel/src/style.css index 93697ac..65552ff 100644 --- a/project6-ImageCarousel/src/style.css +++ b/project6-ImageCarousel/src/style.css @@ -14,7 +14,6 @@ .project6 { box-sizing: border-box; padding: 1rem; - background-image: var(--bg-color); font-weight: bold; } diff --git a/project7-DigitalClock/index.html b/project7-DigitalClock/index.html new file mode 100644 index 0000000..22f14e6 --- /dev/null +++ b/project7-DigitalClock/index.html @@ -0,0 +1,20 @@ + + + + + + + ๋””์ง€ํ„ธ ์‹œ๊ณ„ + + + + + + +
    + + + diff --git a/project7-DigitalClock/src/App.js b/project7-DigitalClock/src/App.js new file mode 100644 index 0000000..143a67f --- /dev/null +++ b/project7-DigitalClock/src/App.js @@ -0,0 +1,5 @@ +import Clock from './Clock.js'; + +export default function App({ $target }) { + new Clock({ $target }); +} diff --git a/project7-DigitalClock/src/Clock.js b/project7-DigitalClock/src/Clock.js new file mode 100644 index 0000000..e43cd04 --- /dev/null +++ b/project7-DigitalClock/src/Clock.js @@ -0,0 +1,35 @@ +export default function Clock({ $target }) { + const $clock = document.createElement('div'); + $clock.className = 'clock'; + $target.append($clock); + + const getTime = () => { + const date = new Date(); + const days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']; + const dayNum = date.getDay(); + const addZero = (time) => (time < 10 ? '0' + time : time); + const hours = addZero(date.getHours() ? date.getHours() % 12 : '12'); + const minutes = addZero(date.getMinutes()); + const seconds = addZero(date.getSeconds()); + const ampm = date.getHours() < 12 ? 'AM' : 'PM'; + $clock.textContent = `${days[dayNum]} ${hours}:${minutes}:${seconds} ${ampm}`; + }; + + const setBgColor = () => { + if (new Date().getHours() < 11) { + $target.className += ' dawn'; + } else if (new Date().getHours() > 19) { + $target.className += ' night'; + } else { + $target.className += ' day'; + } + }; + + this.init = () => { + getTime(); + setBgColor(); + setInterval(getTime, 1000); + }; + + this.init(); +} diff --git a/project7-DigitalClock/src/main.js b/project7-DigitalClock/src/main.js new file mode 100644 index 0000000..3ed760a --- /dev/null +++ b/project7-DigitalClock/src/main.js @@ -0,0 +1,8 @@ +import App from './App.js'; + +const $target = document.querySelector('main'); +const $page = document.createElement('div'); +$target.append($page); +$page.className = 'project7 page'; + +new App({ $target: $page }); diff --git a/project7-DigitalClock/src/style.css b/project7-DigitalClock/src/style.css new file mode 100644 index 0000000..e12172b --- /dev/null +++ b/project7-DigitalClock/src/style.css @@ -0,0 +1,49 @@ +:root .project7 { + --clock-bg-color: rgba(0, 0, 0, 0.5); + --bg-dawn-color: linear-gradient(-225deg, #2cd8d5 0%, #c5c1ff 56%, #ffbac3 100%); + --bg-day-color: linear-gradient(to right, #f83600 0%, #f9d423 100%); + --bg-night-color: linear-gradient(to top, #0250c5 0%, #d43f8d 100%); + --base-font-family: 'Noto Sans KR', sans-serif; + --base-font-size: 3.3rem; + --base-padding: 2rem; +} + +.wrap { + width: 100vw; + height: 100vh; +} + +.page { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + font-weight: bold; +} + +.project7.dawn { + background-image: var(--bg-dawn-color); +} + +.project7.day { + background-image: var(--bg-day-color); +} + +.project7.night { + background-image: var(--bg-night-color); +} + +.project7 .clock { + background-color: var(--clock-bg-color); + font-family: var(--base-font-family); + color: white; + font-size: var(--base-font-size); + padding: var(--base-padding); +} + +@media (max-width: 500px) { + .project7 .clock { + font-size: 2rem; + } +} diff --git a/src/components/App.js b/src/components/App.js index 47dfde6..e2915f2 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -8,6 +8,7 @@ import Project3Page from '../../project3-RandomQuoteGenerator/src/Project3Page.j import Project4Page from '../pages/Project4Page.js'; import Project5Page from '../pages/Project5Page.js'; import Project6Page from '../pages/Project6Page.js'; +import Project7Page from '../pages/Project7Page.js'; export default function App({ $target }) { new Header({ $target }); @@ -23,6 +24,7 @@ export default function App({ $target }) { const project4Page = new Project4Page({ $target: $main }); const project5Page = new Project5Page({ $target: $main }); const project6Page = new Project6Page({ $target: $main }); + const project7Page = new Project7Page({ $target: $main }); this.route = () => { $main.innerHTML = ``; @@ -51,6 +53,9 @@ export default function App({ $target }) { case 6: project6Page.render(); break; + case 7: + project7Page.render(); + break; } } else { notFoundPage.render(); diff --git a/src/pages/Project7Page.js b/src/pages/Project7Page.js new file mode 100644 index 0000000..49a0b3a --- /dev/null +++ b/src/pages/Project7Page.js @@ -0,0 +1,13 @@ +import App from '../../project7-DigitalClock/src/App.js'; + +export default function Project6Page({ $target }) { + const $page = document.createElement('div'); + + $page.className = 'project7 page'; + + new App({ $target: $page }); + + this.render = () => { + $target.append($page); + }; +} diff --git a/src/styles/project7.css b/src/styles/project7.css new file mode 100644 index 0000000..bef9b67 --- /dev/null +++ b/src/styles/project7.css @@ -0,0 +1,35 @@ +:root .project7 { + --clock-bg-color: rgba(0, 0, 0, 0.5); + --bg-dawn-color: linear-gradient(-225deg, #2cd8d5 0%, #c5c1ff 56%, #ffbac3 100%); + --bg-day-color: linear-gradient(to right, #f83600 0%, #f9d423 100%); + --bg-night-color: linear-gradient(to top, #0250c5 0%, #d43f8d 100%); + --base-font-family: 'Noto Sans KR', sans-serif; + --base-font-size: 3.3rem; + --base-padding: 2rem; +} + +.project7.dawn { + background-image: var(--bg-dawn-color); +} + +.project7.day { + background-image: var(--bg-day-color); +} + +.project7.night { + background-image: var(--bg-night-color); +} + +.project7 .clock { + background-color: var(--clock-bg-color); + font-family: var(--base-font-family); + color: white; + font-size: var(--base-font-size); + padding: var(--base-padding); +} + +@media (max-width: 500px) { + .project7 .clock { + font-size: 2rem; + } +} diff --git a/src/styles/style.css b/src/styles/style.css index e7ba378..1ca2369 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -4,6 +4,7 @@ @import url('./project4.css'); @import url('./project5.css'); @import url('./project6.css'); +@import url('./project7.css'); :root { --primary-color: #306ba4; From e11310a3930e3dc61c76a4dc89dce11119070258 Mon Sep 17 00:00:00 2001 From: limkhl Date: Fri, 24 Sep 2021 12:14:44 +0900 Subject: [PATCH 8/8] =?UTF-8?q?fix:=20project=207=20=EC=8B=9C=EA=B0=84=20?= =?UTF-8?q?=ED=91=9C=EA=B8=B0=20=EC=98=A4=EB=A5=98=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project7-DigitalClock/src/Clock.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/project7-DigitalClock/src/Clock.js b/project7-DigitalClock/src/Clock.js index e43cd04..d0434c9 100644 --- a/project7-DigitalClock/src/Clock.js +++ b/project7-DigitalClock/src/Clock.js @@ -8,7 +8,7 @@ export default function Clock({ $target }) { const days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']; const dayNum = date.getDay(); const addZero = (time) => (time < 10 ? '0' + time : time); - const hours = addZero(date.getHours() ? date.getHours() % 12 : '12'); + const hours = addZero(date.getHours() % 12 ? date.getHours() % 12 : '12'); const minutes = addZero(date.getMinutes()); const seconds = addZero(date.getSeconds()); const ampm = date.getHours() < 12 ? 'AM' : 'PM';