From 80dd91149154010d6f7d1d8470eb80c88c096262 Mon Sep 17 00:00:00 2001 From: hwigyeompark Date: Sat, 15 Jun 2024 17:19:17 -0400 Subject: [PATCH] parent ec8f8b5bca46365a84157975585aaabbce789e5a author hwigyeompark 1718486357 -0400 committer hwigyeompark 1720166697 -0400 refactor: refine to more semantic refactor: modify minor styles based on figma refactor: combine CSS in JS remove: separated CSS file rename: move JS file to /components fix: add style tag refactor: align depth of HTML fix : adjust the new component writting styles and apply feedback provided refactor: modified code structures according to the pr feedback Revert "refactor: modify review item component" feat: add review item component responsive design remove: separated CSS, JS file chore: update file paths in main.js refactor: modify component based on updated new pattern style: add colors remove: unnecessary media query refactor: rename attributes for clarity chore: add comment about future removal of .review-card-list styles Add footer-icon Format document fix typo in footer-icon.js Fix component name in accordance with the code pattern Simplify footer-icon.js Co-authored-by: Evan Suhyeong Lee Add icon files fix icon name Open in new window Co-authored-by: Evan Suhyeong Lee <37020415+sounmind@users.noreply.github.com> Update components/footer-icon.js Co-authored-by: Evan Suhyeong Lee <37020415+sounmind@users.noreply.github.com> Extension check for various length of extension feat: Add font weight variables for Spoqa Han Sans Neo Fix footer-icon validateAttributes feature: add step text link component and re-design step component feat: re-design step component style: modify some of styles style: add color feat: add step component responsive refactor: Remove duplicate code by extracting common functionality into BaseElement refactor: rename BaseElement to BaseStepElement style: format StepTextLink HTML for better readability fix: restore accidentally removed text in ds-review-item style: Remove unused style code from index.html style: add large media query in Step component fix: remove unnecessary spacing delete unused component add work-break property to hero's h2 feat: implement intro section component feat: add favicon --- components/footer-icon.js | 63 +++++ components/hero.js | 1 + components/hero/hero.css | 4 - components/hero/hero.js | 17 -- components/image.js | 53 ++++ components/intro-section.js | 114 ++++++++ components/review-item.js | 134 +++++++++ components/review-item/review-item.css | 34 --- components/review-item/review-item.js | 46 --- components/step.js | 134 +++++---- global-styles.css | 8 + images/favicon-16x16.png | Bin 0 -> 750 bytes images/favicon-32x32.png | Bin 0 -> 1241 bytes images/favicon.ico | Bin 0 -> 15086 bytes images/human_color.png | Bin 0 -> 11093 bytes images/icon-blogger.svg | 42 +++ images/icon-github.svg | 8 + images/icon-linkedin.svg | 12 + images/icon-youtube.svg | 13 + images/icon_step1.png | Bin 401 -> 518 bytes images/icon_step2.png | Bin 1009 -> 1847 bytes images/icon_step3.png | Bin 573 -> 787 bytes index.html | 372 ++++++++++--------------- main.js | 7 +- 24 files changed, 682 insertions(+), 380 deletions(-) create mode 100644 components/footer-icon.js delete mode 100644 components/hero/hero.css delete mode 100644 components/hero/hero.js create mode 100644 components/image.js create mode 100644 components/intro-section.js create mode 100644 components/review-item.js delete mode 100644 components/review-item/review-item.css delete mode 100644 components/review-item/review-item.js create mode 100644 images/favicon-16x16.png create mode 100644 images/favicon-32x32.png create mode 100644 images/favicon.ico create mode 100644 images/human_color.png create mode 100644 images/icon-blogger.svg create mode 100644 images/icon-github.svg create mode 100644 images/icon-linkedin.svg create mode 100644 images/icon-youtube.svg diff --git a/components/footer-icon.js b/components/footer-icon.js new file mode 100644 index 0000000..9c8d262 --- /dev/null +++ b/components/footer-icon.js @@ -0,0 +1,63 @@ +import { css, html } from "../html-css-utils.js"; + +class FooterIcon extends HTMLElement { + constructor() { + super(); + + this.validateAttributes(); + this.render(); + } + + validateAttributes() { + const attributes = ["href", "width", "height", "iconSrc", "iconAlt"]; + + for (let i = 0; i < attributes.length; i++) { + if (!this.hasAttribute(attributes[i])) { + throw new Error(`The "${attributes[i]}" attribute is required.`); + } + } + + const iconSrc = this.getAttribute("iconSrc"); + const validExtensions = [".svg", ".png", ".jpg", ".jpeg"]; + const extension = iconSrc.slice(iconSrc.lastIndexOf(".")).toLowerCase(); + + if (!validExtensions.includes(extension)) { + throw new Error(`The "iconSrc" attribute must end with one of the following extensions: ${validExtensions.join(", ")}.`); + } + } + + render() { + this.attachShadow({ mode: "open" }); + this.shadowRoot.innerHTML = this.createCss() + this.createHtml(); + } + + createCss() { + const width = this.getAttribute("width"); + const height = this.getAttribute("height"); + + return css` + a { + display: block; + } + + img { + width: ${width}; + height: ${height}; + } + `; + } + + createHtml() { + const href = this.getAttribute("href"); + const iconSrc = this.getAttribute("iconSrc"); + const iconAlt = this.getAttribute("iconAlt"); + + return html` + + ${iconAlt} + + `; + } +} + +customElements.define("ds-footer-icon", FooterIcon); diff --git a/components/hero.js b/components/hero.js index 048d96c..6da813e 100644 --- a/components/hero.js +++ b/components/hero.js @@ -20,6 +20,7 @@ class Hero extends HTMLElement { h2 { font-weight: inherit; font-size: 30px; + word-break: keep-all; } @media only screen and (min-width: 768px) { diff --git a/components/hero/hero.css b/components/hero/hero.css deleted file mode 100644 index a94d1e5..0000000 --- a/components/hero/hero.css +++ /dev/null @@ -1,4 +0,0 @@ -.hero-description { - font-size: 5rem; - font-weight: medium; -} diff --git a/components/hero/hero.js b/components/hero/hero.js deleted file mode 100644 index 391a468..0000000 --- a/components/hero/hero.js +++ /dev/null @@ -1,17 +0,0 @@ -const template = document.createElement('template'); -template.innerHTML = ` - -

- -

-`; - -class Hero extends HTMLElement { - constructor() { - super(); - this.attachShadow({ mode: 'open' }); - this.shadowRoot.appendChild(template.content.cloneNode(true)); - } -} - -window.customElements.define('hero-component', Hero); diff --git a/components/image.js b/components/image.js new file mode 100644 index 0000000..44aedec --- /dev/null +++ b/components/image.js @@ -0,0 +1,53 @@ +import { css, html } from "../html-css-utils.js"; + +class Image extends HTMLElement { + constructor() { + super(); + + this.validateAttributes(); + this.render(); + } + + validateAttributes() { + if (!this.hasAttribute("alt")) { + throw new Error('The "alt" attribute is required.'); + } + } + + render() { + this.attachShadow({ mode: "open" }); + this.shadowRoot.innerHTML = this.createCss() + this.createHtml(); + } + + createCss() { + return css` + img { + display: block; + max-width: 100%; + } + `; + } + + createHtml() { + const src = this.getAttribute("src") || ""; + const alt = this.getAttribute("alt") || ""; + const width = this.getAttribute("width"); + const height = this.getAttribute("height"); + + let imgHtml = `${alt}`; + + return imgHtml; + } +} + +customElements.define("ds-image", Image); diff --git a/components/intro-section.js b/components/intro-section.js new file mode 100644 index 0000000..e587aef --- /dev/null +++ b/components/intro-section.js @@ -0,0 +1,114 @@ +import { css, html } from "../html-css-utils.js"; + +class IntroSection extends HTMLElement { + constructor() { + super(); + + this.render(); + } + + render() { + this.attachShadow({ mode: "open" }); + this.shadowRoot.innerHTML = this.createCss() + this.createHtml(); + } + + createCss() { + return css` + section { + display: flex; + justify-content: center; + align-items: center; + + height: 100vh; + background: linear-gradient( + 0deg, + rgba(251, 250, 255, 0) -10%, + rgba(251, 250, 255, 1) 25% + ), + linear-gradient( + 90deg, + rgba(36, 234, 202, 0.8) 0%, + rgba(132, 109, 233, 0.8) 100% + ); + } + + .inner-container { + display: flex; + flex-direction: column; + row-gap: 30px; + + /* NOTE: Requires accurate policy settings */ + margin: 0 7.5%; + } + + @media only screen and (min-width: 768px) { + /* NOTE: Requires accurate policy settings */ + .inner-container { + row-gap: 50px; + margin: 0 9%; + } + } + + @media only screen and (min-width: 1024px) { + .inner-container { + position: relative; + flex-direction: row-reverse; + row-gap: unset; + /* NOTE: Requires accurate policy settings */ + margin: 0; + width: 80%; + } + } + + article { + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: flex-start; + /* NOTE: Requires accurate policy settings */ + row-gap: -4.9px; + + width: 70%; + } + + @media only screen and (min-width: 768px) { + article { + /* NOTE: Requires accurate policy settings */ + row-gap: -3.2px; + } + } + + @media only screen and (min-width: 1024px) { + article { + row-gap: unset; + width: 40%; + } + } + + @media only screen and (min-width: 1024px) { + aside { + width: 60%; + } + } + `; + } + + createHtml() { + return html` +
+
+ + +
+ + +
+
+
+ `; + } +} + +customElements.define("ds-intro-section", IntroSection); diff --git a/components/review-item.js b/components/review-item.js new file mode 100644 index 0000000..31458b8 --- /dev/null +++ b/components/review-item.js @@ -0,0 +1,134 @@ +import { css, html } from "../html-css-utils.js"; + +class ReviewItem extends HTMLElement { + constructor() { + super(); + + this.validateAttributes(); + this.render(); + } + + validateAttributes() { + if (!this.hasAttribute("authorImgSrc")) { + throw new Error('The "authorImgSrc" attribute is required.'); + } + + if (!this.hasAttribute("content")) { + throw new Error('The "content" attribute is required.'); + } + + if (!this.hasAttribute("author")) { + throw new Error('The "author" attribute is required.'); + } + } + + render() { + this.attachShadow({ mode: "open" }); + this.shadowRoot.innerHTML = this.createCss() + this.createHtml(); + } + + createCss() { + return css` + .review-item { + display: flex; + flex-direction: column; + align-items: center; + border-radius: 10px; + padding: 39px 20px; + background-color: var(--bg-300); + color: var(--text-900); + } + .review-item blockquote, + figure { + margin: 0; + } + .review-img { + width: 104px; + height: 104px; + flex-shrink: 0; + object-fit: cover; + } + .review-img figure > img { + width: 100%; + height: 100%; + padding-top: 7px; + border-radius: 48%; + background-color: #ffffff; + } + .review-content { + display: flex; + flex-direction: column-reverse; + align-items: center; + text-align: center; + margin-top: 10px; + } + .review-content blockquote { + font-size: 14px; + margin-top: 17px; + word-break: keep-all; + } + .review-content figcaption { + width: 100%; + font-size: 16px; + text-align: center; + } + + /* Medium devices such as tablets (768px and up) */ + @media only screen and (min-width: 768px) { + .review-item { + padding: 37px 20px; + } + .review-content blockquote { + margin-top: 16px; + } + } + + /* Large devices such as laptops (1024px and up) */ + @media only screen and (min-width: 1024px) { + .review-item { + padding: 41px 51px 31px; + flex-direction: row; + align-items: flex-start; + } + .review-img { + margin-right: 31px; + } + .review-content { + flex-direction: column; + margin-top: 0; + text-align: left; + } + .review-content blockquote { + margin-top: 0; + margin-bottom: 14px; + word-break: unset; + } + .review-content figcaption { + text-align: right; + } + } + `; + } + + createHtml() { + const authorImgSrc = this.getAttribute("authorImgSrc"); + const content = this.getAttribute("content"); + const author = this.getAttribute("author"); + + return html` +
+
+
+ Author profile image +
+
+
+
${content}
+
${author}
+
+
+ `; + } +} + +customElements.define("ds-review-item", ReviewItem); diff --git a/components/review-item/review-item.css b/components/review-item/review-item.css deleted file mode 100644 index 2a9e74a..0000000 --- a/components/review-item/review-item.css +++ /dev/null @@ -1,34 +0,0 @@ -.review-item { - display: flex; - flex-direction: column; - align-items: center; - border-radius: 10px; - padding: 41px 51px 31px; - background-color: #efefef; - max-width: 568px; -} -.review-img-text-container { - display: flex; - align-items: center; -} -.review-img { - width: 104px; - height: 104px; - flex-shrink: 0; - margin-right: 31px; -} -.review-img img { - width: 100%; - height: 100%; - padding-top: 7px; - border-radius: 50%; - background-color: #ffffff; -} -.review-text { - font-size: 14px; -} -.review-name { - width: 100%; - margin-top: 14px; - text-align: right; -} diff --git a/components/review-item/review-item.js b/components/review-item/review-item.js deleted file mode 100644 index 88757e9..0000000 --- a/components/review-item/review-item.js +++ /dev/null @@ -1,46 +0,0 @@ -class ReviewItem extends HTMLElement { - constructor() { - super(); - } - - // initial render in here to ensure the element is fully connected to the DOM. - connectedCallback() { - this.attachShadow({ mode: "open" }); - this.render(); - } - - // getter to make it clean to access the attribute value and ensure a default empty string if the attribute is missing. - get text() { - return this.getAttribute("text") || ""; - } - - get name() { - return this.getAttribute("name") || ""; - } - - get img() { - return this.getAttribute("img") || ""; - } - - render() { - try { - this.shadowRoot.innerHTML = ` - -
-
-
- Reviewer -
-
${this.text}
-
-
${this.name}
-
- `; - } catch (error) { - // log any rendering errors. - console.error("Error during render:", error); - } - } -} - -customElements.define("review-item", ReviewItem); diff --git a/components/step.js b/components/step.js index 3b1730e..9c9bcbb 100644 --- a/components/step.js +++ b/components/step.js @@ -1,100 +1,132 @@ import { css, html } from "../html-css-utils.js"; -class Step extends HTMLElement { +class BaseStepElement extends HTMLElement { constructor() { super(); - this.attachShadow({ mode: "open" }); this.validateAttributes(); this.render(); } - connectedCallback() { - this.updateLink(); - } - validateAttributes() { - const status = this.getAttribute("status"); - const validStatuses = ["1", "2", "3"]; - if (status && !validStatuses.includes(status)) { - throw new Error( - `The "status" attribute must be one of ${validStatuses.join(", ")}.` - ); - } + this.requiredAttributes.forEach((attr) => { + if (!this.hasAttribute(attr)) { + throw new Error(`The "${attr}" attribute is required.`); + } + }); } - updateLink() { - const slot = this.shadowRoot.querySelector("slot"); - const nodes = slot.assignedNodes({ flatten: true }); - const linkText = this.getAttribute("linkText"); - const link = this.getAttribute("link"); - const linkHtml = `${linkText}`; + render() { + this.attachShadow({ mode: "open" }); + this.shadowRoot.innerHTML = this.createCss() + this.createHtml(); + } +} - nodes.forEach((node) => { - if (node.nodeType === Node.TEXT_NODE) { - const tempDiv = document.createElement("div"); - tempDiv.innerHTML = node.textContent.split(linkText).join(linkHtml); - while (tempDiv.firstChild) { - node.parentNode.insertBefore(tempDiv.firstChild, node); - } - node.remove(); - } else if (node.nodeType === Node.ELEMENT_NODE) { - node.innerHTML = node.innerHTML.split(linkText).join(linkHtml); - } - }); +class Step extends BaseStepElement { + get requiredAttributes() { + return ["step", "iconSrc"]; } createCss() { return css` + h3, + ::slotted(p) { + margin: 0; + padding: 0; + } .step { display: flex; flex-direction: column; align-items: center; + justify-content: center; background: white; - border: 1px solid #000000; border-radius: 10px; padding: 106px 53px; text-align: center; - max-width: 375px; - max-height: 627px; + border: 5px solid transparent; + background-clip: padding-box, border-box; + background-origin: padding-box, border-box; + background-image: linear-gradient(white, white), + linear-gradient(135deg, #24eaca, #846de9); } .step-title h3 { - font-size: 36px; - margin-bottom: 50px; + font-size: 24px; + font-weight: var(--font-weight-medium); } - .step-icon { - width: 60px; - height: 60px; - margin-bottom: 50px; + width: 40px; + height: 40px; + margin: 20px 0; } - .step-content { - font-size: 24px; + font-size: 16px; + font-weight: var(--font-weight-regular); word-break: keep-all; } + + /* Medium devices such as tablets (768px and up) */ + @media only screen and (min-width: 768px) { + .step-title h3 { + font-size: 36px; + } + .step-icon { + width: 60px; + height: 60px; + margin: 50px 0; + } + .step-content { + font-size: 24px; + } + } + + /* Large devices such as desktops and laptops (1024px and up) */ + @media only screen and (min-width: 1024px) { + .step { + min-height: 627px; + } + } `; } createHtml() { - const status = this.getAttribute("status") ?? "1"; + const step = this.getAttribute("step"); const iconSrc = this.getAttribute("iconSrc"); return html` -
-
-

Step ${status}

-
- step ${status} icon +
+
+

Step ${step}

+
+ Step icon
- +
`; } +} - render() { - this.shadowRoot.innerHTML = this.createCss() + this.createHtml(); +class StepTextLink extends BaseStepElement { + get requiredAttributes() { + return ["link"]; + } + + createCss() { + return css` + .step-text-link, + .step-text-link:hover { + text-decoration: underline; + } + `; + } + + createHtml() { + const link = this.getAttribute("link"); + + return html` + + `; } } customElements.define("ds-step", Step); +customElements.define("ds-step-text-link", StepTextLink); diff --git a/global-styles.css b/global-styles.css index 9e7c42c..fda83ef 100644 --- a/global-styles.css +++ b/global-styles.css @@ -5,6 +5,10 @@ --bg-200: #fbfaff; --bg-300: #eee8fe; --text-900: #160b46; + --font-weight-light: 300; + --font-weight-regular: 400; + --font-weight-medium: 500; + --font-weight-bold: 700; } * { @@ -21,6 +25,10 @@ html { scroll-behavior: smooth; } +body { + margin: 0; +} + a { text-decoration: none; color: inherit; diff --git a/images/favicon-16x16.png b/images/favicon-16x16.png new file mode 100644 index 0000000000000000000000000000000000000000..a023279445e1fa75a50b2a3c53204400ba8090cf GIT binary patch literal 750 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!63?wyl`GbKJOS+@4BLl<6e(pbstU$g(vPY0F z14ES>14Ba#1H&(%P{RubhEf9thF1v;3|2E37{m+a>C*deKmPsu_y7Oj|F3`kUi;$B)Vt3=eE(Ck^YNkEpVl3H zxA*j?_aFcK|M&mH?>{R)ye@luf70V;*FSwb@#J&$?nm#x{(1E3=Y|9C7p{7H^yrr_ zpZ{L`@g?xdwUWp8u73XZ`_I2WfB#Q9^L+7z*MI)}fAsvl81b6U@x1A36TB*-uL*uTGO={fs=T*f4CcNZgvOFk!n9L@rd$YKTt zZeb8+WSBKa0w~B{;_2(k{(?=ISBn2~s#iNusNd7YF+}2Waza9i8&eMtkIxy6hR#Mw z-Ung{iLM+QHf}85P*_y>`9lNijf$T?SZ}blwz#?+JyJPC@`j4a(j}=!QlCB%6`49E zv_hgH^y(E;ldW4ykCcA>!pqYuF=K0wug}>tx;mw6*W~7uI<{@o>z zOmq#*bPX*-42`Xf%&ZJewG9lc3=C={1FBIpZ(KQXf(Fu4*ohl}B34zEF%Ag<#l+l_LQ{_^F(kkE) z4_dHM4vS(0HAPYD(NZHyK@2g4kYIq2yd+NoImrF;(&wM;OlNlYJNw=F%+Bm=RdP~H zpns@803a|fmPExA|2}7XW0mwvbvGtH1zQuh0w6dWfaK14Kg^4zCIV2p6aY>o08Y%} zXaV?+005i=0I?2$U>5JUluZEO(BvJdWVhS%pFrFm)a^0b-7T*sYrAw3mDPiKOin}u zS+cK>6kJohh3!_m8$moM>Y1=Qcw@Tra>#+8ygoRsS$5{B#_mMhUre=j=~b}PdIop2v|e@l>9kts9JSkjgdvJ_aKr0? z>^H+#Ct$V3`TM9boiAev#&jl^-h@2vH=VqyVOA+QT&UxL0n)gXPW$<3b^N$w-LNQU zMAimR>g-O33$1>kPPsn(bC1qA<9<0XQ`-!eR;o`{YdbqkI*sf5Y31i*y({0oIs%QW z><-1WJ@?*7R-3$EW$}1C1|uTqG?X2Nii@C|%?6jt(`_>q>f}U)h$s^kDC9TcNtM;n zCeu^er6rG*MjN6xBHf~y`fKkF{{S7W&@^1q4~p$p#NA^tS3u)2Lz4CV18D=&b8n#` zqt)zi7YoNJZBo8OKk?4d{%oq^3bemUS$0a@(l#ZP+HE$}#Gk+zN*rlx>iXWioE-X|=X2`n z7KVgm8ojprevJ6jLTGb1O?=Mjz@NMheh7`Jlu#F+bGbISwf4l>-CL4lX+GO<8y~gS zJ@DZ!UcO{SSj4i|UmR=RQjwMtmq|`Lokq&uwzDQCD<*^T8NU*@??FY=IYHHpg(BYr z0SOU{_I{GJvCJ>#&iqENgUbqnGu9oNJFhWp^OMJiX_@5WayR1bb^KV9e{}S-Kf{W* zBx$NnRiD8{lJ-m}gXUj2zu2EjeIs5K)j=zvmHc|3$SlnyOU(iPHPs36x%w~+Zj!5U%+-df@D5d8;_c^}0r)fF9 z&N4fHmv4UgaKkwqK(8kRw}h(&*tM6i$uu@Sm(3vN6)`XYQG}?~D+p^>L~clpTt$pp zON?9-K_Czbgz|;SW&Z-cVbTlpOa31SBxzq@Kt^dQjZMuxgl82o^9%Pe@az&617FBu z=K)a6n=pMa``h&J@V_X%eQ|0k@D2-DnHLZg7L;&dfp-v|#994}?j6>Vitm+5UJCn! hp9=kYIkAoLD*+rlk8O%xQ;V$tapWY@t>~O%{{U^Pmev3O literal 0 HcmV?d00001 diff --git a/images/favicon.ico b/images/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..49436d30669db18258b224c6d1a7054240f7a549 GIT binary patch literal 15086 zcmeHO`Eyg(6;>wv0r?a7Azfy=(abbSDVeloCg~(81PT<$&`BsMkWR~57GsDZlmWtG zdkVn~Wiem^*eu3&l8G@G@B-c>S+ccR+tXq_?fYtdJ@?5nMzRfJ@zUxI*H`bod++(q zcJF=n97LiQL@$bF%n(sMUG&xWM50$kBGL5egZD3qL|S_G64mVes%aw89%}GIYC~N_ zA5vk@h3n;1HT*9I2BuM2N<~H`K?Re%FpS+)80Iu~+a$+4l1v$9#)D)EVo&qK^bnuI z_@^@Vv<~w12H%ZfN34&~ zZ-jT_;b%mi*?KH&L&V=lSb&hL2deKDqxbsnp}aO9UVVe`JllS#pUZ-{yFaBLVXSfD zL!gyFB&Y*#EQh-NBUn_W0xtux5RCV?6aM$0xH1RkmVHRZquDk@V|Y61z?B!kb*BnZ ztDf4$Ngzxn&w~#l$o?fF2>8S>84jSgYXQ2O--NVr7R<_nLvnQKYM`i@1I5+%p{ZSt zh)bKT1BSo72HMi)&=;=+cWg5pwWks8>p?OSPVwNnyI1+IWJe~&V^qV1*z6DA9 z>yWh06!0rr7r@C~rgn@$AnNC!ssA(Kp9^Kxe7Jh)9X)?Yu5=$z-zWKRg}!tZ^aobK zutWpU zHyA%#1JmwJ;E$ES-*^*oo==U6Zkmfu%?xxXeu6IfE0FcP1-))7 zJkEN=qs~G3WQuek4j2|ez62{AL|7w(v*sKurA099+yGPI z2AB)Cz_$MYyw_?G({ljxkuiBlQWF+NCz;{&?HB*PtzAgq(aQF99Bk^*p_tp!)K4wgOJ;W~d75v7va z&>F(7F>QaCJcim0@(~onXx>Hs`!>x#uR`4R8f0y=p_Q$H+ggW2#GO4h!E>u>Nd60< zI{!!Lsy;!~WfK@MpS>dW_IsUrG2EL49@!+_IV!etPHYz6t#o ztD!6Y3-kw9fh+k399K@zJkI)wT^4C^;jF3gn;KM7ehpp}?!g|^G;m+hs;3I}a)H4cxnva7{80t0( z^4FYN3dg+)!PW*se!+LM_7<5m#^s(E8I?{F_Kq`9my-{iTnuB?X2kuDlpl=RCr5jD zp5xGZ6LlNml3s?Z>oVNpYQ(*dvkpxz9t1lfHBAnCnMAUAp0<-8dyIJ@Zv&&xnR(gd zWs|poybU~-4NT=2FvHGb@Kbf2V7U)02V&~xZzPlH92BO9sggg#a($N4Sv>9`hz(A1zQt;iJIm9WPUY8BhVry1mn-ukea)uQNreul#?9Xutqv-T zHmfIUo?*1<&}zcyPbBS$l6ju)#M#?3ko^S4zUiDK;?=?;Ek?ie7{xBe>%4~@2quNI z=2);Fn#L9Az4k6V+HbSYZCJb^6~7wm?Co*q8#))FX*m||hr?V2UU!NxMA0uVBl_>a z)V!O{NF&2^nt-SCYdQn|8gbWPe2<+i#17F0KN8Ww!XHJCVlE_Izl5@T8O6lUAQm(~=u1t#x|qOU*>N~3bhx;T6j<7|;M)X^bll?6s`+oym5BXa< zCQswA`A1*72I_N5;8Wic=sO$FQS9hrn92$S`;XZMF+UdF;TYI&CJ#F24so#QkHexa z75sm={P_0cP?b|0vEh&~7r0ug;B5Q~F+OdxDVYxMll$+~7(!fgcfQ z#Y#l@K8iz843}~cM)$K!9&@?R0#&r|CPkPT9WTN%scSHSAJQp&X{+`_D1QWAtbXNO^ie zj|5Kb6>u#@l$R6|@{q!ug7#39_cJ1{1fo$6yuAWC)kgH|%7pJR{mpd<@wBg{b>H1` z6@2AU_?s!m&`!B!Y%d_#HRV=DBZh-!3f8!Pa~@;&XI3(#?!VBty;^3nGI@!~hN!uZ`bB!X^4c_ZAnuEKfoGy+Xc z81M&Dya*VmF}YYgYKNo03f8_OLOxa^>;d;}A?@LA!_{;dzP1~*Z)P$ex+BVxjYDQd zxm+x_kNtMbYv7hvQ=Ti!VWamW_8Z;5*>__yM&BpnHwWZO>uG#|^?fS;&72Q%z5g#3 C%skcr literal 0 HcmV?d00001 diff --git a/images/human_color.png b/images/human_color.png new file mode 100644 index 0000000000000000000000000000000000000000..7bff6d5e6aac52e77fe1e1a953cfd1eed4e8966d GIT binary patch literal 11093 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 + + + + + diff --git a/images/icon-github.svg b/images/icon-github.svg new file mode 100644 index 0000000..11440e8 --- /dev/null +++ b/images/icon-github.svg @@ -0,0 +1,8 @@ + + + diff --git a/images/icon-linkedin.svg b/images/icon-linkedin.svg new file mode 100644 index 0000000..1fbe482 --- /dev/null +++ b/images/icon-linkedin.svg @@ -0,0 +1,12 @@ + + + diff --git a/images/icon-youtube.svg b/images/icon-youtube.svg new file mode 100644 index 0000000..d18284b --- /dev/null +++ b/images/icon-youtube.svg @@ -0,0 +1,13 @@ + + + + + + + \ No newline at end of file diff --git a/images/icon_step1.png b/images/icon_step1.png index c3ecd966a925cb551737605521ce95d83a31528f..090e486d5aa1109b535e474ddccc26b56111cbda 100644 GIT binary patch delta 442 zcmV;r0Y(0i1BL{UR)3pGL_t(|0qxpBPJ=)c2H^K-n;O~$8=EdM@c?=QSlD#w5x7B* zAl|^9K#$;3>q2@0djnZ&-LQ}*N@N^rYBXVD15C`DzONfPbP9jM%mXqATNw04qO5(H z&JZ-Jb6g7y#lfiIVAOoiF0OOxtln1>MDzp*4`^A)bDqAWcYjx#hIO#v-q_7s`Mun9 zfwtJ{SpHLT6R(5GdhrPKLv6%%$3AZD_f7%?48R;tCbG9yzk7HozYM`3SbS8sE!1%x zqlSY~!@;QGVAL2JtgYIi`$bJtRCi8%DN?h0W2`BI{wOSKU%t*l&`5hQ5OAj06M{xO z#;D<7)Nn9rxPL&GQ5D}`MD@OPig>*OtuDSz^$npS9%IySFly>e9th`u{zf%PY}2;} z)V(<6zy6=c7&RP>8V*Jc7wF0~7h)Cd!F0bERpBv4jk)U;ja_ntfDsr*W?EPR#T*PH zgH6$KJg1v=9|Q;&3?M_r&*|-fl_XJuALthiKwOalJ2U8iZT~Rrje{KXiF}+t0zwcm kl2_c^Zrc}ea-9@ypA!UYnb3XWApigX07*qoM6N<$g6pxz_y7O^ delta 324 zcmV-K0lWT&1d#)fR(~c*L_t(|0qvT>5rQxfMHjUIjvgtEPQVhZz*5i(v;*q!gvlTb z2f{!|kiY&nvm78m-axXD*+k~iIQAzJ7w`KXL@5+QgJNh5#ZnW6iAvhpXc#V<$T9c6 zPZRlA!^}h-xszK&{dMW7ci!Qpa_LdpN0^Hq?2vj}v73prD1XC#nlz#i<}oxVh6csZ zpcooz#ZD8)VlUK$V)V<2uOb?MImSX!F5Dl4so$1RlgCf4&oPDu#n7M_8cfg*O7W)* z)Mk{m2|D(gq<0@U#?YV`8f$08%ZxU~igUf;Zwnd}LxW;yPz;SN))k{BVi#K^=-4np zt3a)o>XM_o=sn|Q#U7%MtKHc8K3lxF$D&H#Ld>2_l$OqREw;rHX5A6WGC=GTDwzYk4ZBb)O@~-?(9ILW7-9$a zZx%)m8^^KvPk-sx9B9JOAtuG;GItM8GY}7$D0K^yspn>?dVZjDqw+CiWC1Z9S1b$=R$2l-z7*m!P*&{>m-=O0V8 z^Ao=xeMNmL{dxyOiDd`@2ma=ww4bAMIZ+0XkG|fke;xp0b{9=ozSU)&O3(fQ;miYP zxZi!;+z!T@9@!3b0q&v4etT#-J-6I#0-Dj71k#aIg-905O(e(H{ND9s^3@g-Yz4wm zyeb{ebbpSa1=9DfmQSI}EaJe6m!*T5Fq)~!*$t%o5l=th;EHvq7t_hK9i(t%2wMY7 z2$8`smhK~|+71g!R2K;cym@tfxN-lh*1;;8E)=`M<@Lc!7%`+LDcmCkQU@jUS?i?V zX?3|z87wP21cbn(K@3nAbw`oZEZ54btzX(K zUn;kL=fI+Xw7w2KSZmLyT~|GXB;1{Z1abSW^}0xLl`!hGi9d)O-80Qn2!rEpSPex zZwT&i9m9_>F;Tw^F$3<|c@1)hnhLnCH-@X;EuA}5P^J|$qDzloUP)BwL?`gDuz#ku z3NZkM)H*3M0xsM!9XW+{n&M8r?%S`^KaE_&qjsiN6ieqG%-R$h#|GYkCeYtK8YT0x z%*8-UsZsXGD^N(rZ<04T(1(f4pAK8>NxZRUcG|7B=LZ2$@Xlqmv{JDvld0!f@E4m# zb+S=(=`>{w=F+L}mnTx+eJodhAAeZbN(|#Ws9v9kh}BtY6}hgQNqu%#LJBI!B)GBo z_ow%HNz=U`XyYRb)QC5h7%TRYts#G*QmbT|x%2s6yR6#FUiWHePt&iDd|q&`rHW?W zHIzG_97gdf z?s6jXUriTwJYOB_<6BgBhOignOhW|pb=7f*4R*m1V1b<1k?P*b6prx3B9y=(>ZeNuS7yW+=KuDW~gAaS$L7#q= zp|UO2tiw7VRDrfShX<{iUK<=VUo$~lEwGn0HSx`f;Tp8+?KX4FubT*M_{H_@nN3Hh z@>>OZ1g<#gljtkX;pfYL4^D!A4gmS^q`g}kbv%%-jyAoQ)fg=I{7{LH2V0HDWKV-eiY_AyJi3;NKf%7$aa`IFX^$&1 z-5^zjX=csTZAvR5LM0ga9}t?1JGdxoIt}~Ed3DUtZ&!PMDY$25CP4y>@(TDDA>|~`d0%%krqahYq$uJ!{DB3XSDjH z^-28uEdi(?I~*Wln4&BSFHy8d^Y<%1$atNJCF-&uF~k8z&d!i0i21QSYV!5#T<#VB Y0lBp1tPGUUZU6uP07*qoM6N<$g1)LzssI20 delta 938 zcmV;b16BOD4)F(&ReuA9NklN<5Qe`v1w_Z(f)4BwP=Y%MQ-Rfil?v<* z$PS!aj&yFh*{Og^1$HV>xTZ9wWRct@_<;P)>{yn71%6=hr1XJtai#gv&bO~GYVX%s zZ|%9XU!^^kcF&37OS>tpC~XsHd1(o68!8$WrCpcyM7Y={OMj^vH43H>d@Kqsn305O z1s{t5$AmblR^LQm1yu)(j%S!jYiPS+M6Q5M#P+}lp??i*PQZ#G#h;4kLB+=&-fiL+ z^yC8AoUr9>;yyOK?@Iegd#lO5`uFzlXQpFU?waC@ZsQ$=_9>qGnyYzqF;STSYw|P_RJPiW+Ats&OWjOQ`0IwxQ#w zdS_YM-PSzqBM?X~d8vU&H+M(a~u8D(ZWjYbPtiMqg?$Iy&+H_-M zS*x#_(rdBWt~E)N}eqXRL={Ky1osdIklAb$;YFcThohwX)XVaO6UJw@vw)*G0 zjMigaOug=~Kg3wo9puK$Vlm9{)~hEmUw5$V;XtBfPVp)BIv0md7CoHI750wmNlu@- zrpFxSH2180R?yy(3FG1j|B`|`=GZqRuCI{^-G2>`ZheKW_X}R1rR9VP-q3L~oYUQ# z4t=Oew4~VZjPtnJcNN-{@tS?{+9l9oCr2+xV|SWD+m?uW*lSjTAN0ec7d2SpOQNRU zJiK0BbrhJ;pMqgTuQ0GQI7*IGa<>vV`jZhZx}XP5_w7#&>18wH8SVs^5hhyd>F9w} zzJF=n0q{;#0=EhszjI^ape}+9#`fsvptpuCZj8 zd@1c4{mHOL)prK!?K&dHdJGI9Gn69}S;EMy&{rsgOj$<3gxB5<-3B9sOyOUa+*vL^ zSF|@k2w98YoCt1!9L)_7!m$mM2=+us!XxX+>XtC1N2M{FzPTL4e`YckKys7#CjbBd M07*qoM6N<$f)_{LEdT%j diff --git a/images/icon_step3.png b/images/icon_step3.png index b282b18edc22aa9242b854767c2e69401a05c58e..6415a5703324103d723d5534aebf55bbbddff348 100644 GIT binary patch delta 714 zcmV;*0yX`;1d|4kReu7gNklY@}F@RqiDx5Ee$3+(0}5 z-XMB|S;z#LIM4U6q3{pMVDUO(rhf~H8D34*eDz*;f88Ju zzSs5QS=G)gd^GNL{Iryg^j9B>MStj2oc1^xhI1k6wZl(P zJP{UzZpA$)-LF0AAz%-RiR_$qz@jIau!V?sakT7{2+5#FP*fv;H!qAW=IBzTVo zV6eg33t)s*2!-ln*0oxQ6JUf@h*^1dtY0v^X`NX!o(u=T2&)iL6h!y~+t-O`920~L;kH%On%@qaF(8LatYTc3>gwfjw7_e@`8~dG>QtHUG%wgrF zvx5T%@%8xIFn}$OR#{YqoKCA6aILzQqRBwwqk_MHrwtTja@{9AgmNr zyEsXg9YKf?ga|>15QGRptaYD7!&&Vc78Nr?F-PMJ3XYkfpy#!`YEnJdJp&&Ki0O*W zyXskH4S8jChVok}+^BVWDW?70{~PyLTs(8j?nCjSC(7yxHqB6+o<-^iLWCeh2ttG) wLj{pDw07*qoM6N<$f>P8_P5=M^ delta 498 zcmV2E7E3Reu4}NklEctuhZnJOafNBKn4z2=lV{%Y-hT|^r16WtfH)u#L?Vbp z5Q!jvCE~cQS))V$Z^fzBGZq=zTlydU|G=EQUTYC;5^DWF;*f-h9NiZ~OT-}w5h3?F z)`&yn=e4ahVzk(yg3ZRD@=2^kYyytm!Vqf_F9F9s!WheB=}TgPZsju;$@CE!)KJyP zQ7@-!l)Xc&Mt|x^66G@mR6g5~2r`Eq{W#yy0urobbl*J%lf{8yD{|B6hO8 zMVSb9=)TUV#){_{3iGPrzv(BOck!o$Way8nhzxP|Q~f#nmRC~|D-18;7!T-&sfcs) zL6_K}AC2dY)ll^n`5S|eO??EB2okHI`giLT%?Kh9L~A05L=cG}dYFv(8DYAAkSJR( z;u+$whthSgVXRS9jbzY6={0gp=Why2RBrNEuL<^n$D55$eFTvRA`wI)h(wTBSvj;i ogfjTJH6w^b5Q!iXK_r5F0w}J + + + + @@ -28,13 +42,6 @@ @@ -236,25 +195,25 @@ -
-
- 해외취업을 위한 커뮤니티 기반 알고리즘 스터디 - 디스코드 참여하기 -
+ + + 해외취업을 위한 커뮤니티 기반 알고리즘 스터디 + + + 디스코드 참여하기 + -
- # -
-
+ +
- # +
지역에 관계없이 다양한 언어로 참여할 수 있어요 @@ -279,72 +238,73 @@ >
- +
참가자 후기
- - - - - - - - - - + + + + +
스터디 참여방법
- -

현재 스터디 1기가 진행중이에요. (2024년 4/21~8/10) 다음 기수 스터디 참여를 원한다면 여기에서 신청할 수 있어요.

+ +

+ 현재 스터디 1기가 진행중이에요. (2024년 4/21~8/10) 다음 기수 스터디 참여를 원한다면 + + 여기 + + 에서 신청할 수 있어요. +

- -

답안 제출과 확인은 깃허브를 통해 이루어져요. 스터디 전체 진행상황을 알고 싶다면 프로젝트 보드를 통해 파악할 수 있어요.

+ +

+ 답안 제출과 확인은 깃허브를 통해 이루어져요. 스터디 전체 진행상황을 알고 싶다면 + + 프로젝트 보드 + + 를 통해 파악할 수 있어요. +

- -

매주 스터디 멤버들끼리 디스코드에서 간단한 모임을 가져요. 멤버 간의 친밀감도 쌓고 해외 취업 관련한 유용한 정보도 공유하고 있어요.

+ +

+ 매주 스터디 멤버들끼리 + + 디스코드 + + 에서 간단한 모임을 가져요. 멤버 간의 친밀감도 쌓고 해외 취업 관련한 유용한 정보도 공유하고 있어요. +

@@ -358,75 +318,35 @@ " > FAQ -
- - - - - - - - - - - - - - - - - - - - - - - - +
+ + + +
diff --git a/main.js b/main.js index 8c95229..8515a1d 100644 --- a/main.js +++ b/main.js @@ -1,7 +1,10 @@ +import "./components/button-link.js"; +import "./components/footer-icon.js"; import "./components/footer-link/footer-link.js"; import "./components/header.js"; import "./components/hero.js"; -import "./components/button-link.js"; -import "./components/review-item/review-item.js"; +import "./components/image.js"; +import "./components/intro-section.js"; +import "./components/review-item.js"; import "./components/seo-meta-tag/seo-meta-tag.js"; import "./components/step.js";