Merge pull request #69 from DaleStudy/revert-49-sam/48

Revert "feat : made hero component responsive"

components/hero/hero.css

@@ -0,0 +1,4 @@
+.hero-description {
+  font-size: 5rem;
+  font-weight: medium;
+}

components/hero/hero.js

@@ -0,0 +1,17 @@
+const template = document.createElement('template');
+template.innerHTML = `
+  <link rel="stylesheet" href="./components/hero/hero.css">
+  <p class="hero-description">
+    <slot></slot>
+  </p>
+`;
+
+class Hero extends HTMLElement {
+  constructor() {
+    super();
+    this.attachShadow({ mode: 'open' });
+    this.shadowRoot.appendChild(template.content.cloneNode(true));
+  }
+}
+
+window.customElements.define('hero-component', Hero);

index.html

@@ -270,8 +270,6 @@
 
     <div id="review-container">
       <div class="hero">
-        <ds-hero>코드리뷰를 통해 새로운 관점을 배울 수 있어요</ds-hero>
-        <link-button size="big" variant="secondary" href="https://discord.gg/43UkheRV">디스코드 참여하기</link-button>
         <p>코드리뷰를 통해 새로운 관점을 배울 수 있어요</p>
         <link-button
           size="big"

main.js

@@ -1,6 +1,6 @@
 import "./components/footer-link/footer-link.js";
-import "./components/header.js"
-import "./components/hero.js";
+import "./components/header.js";
+import "./components/hero/hero.js";
 import "./components/link-button/link-button.js";
 import "./components/review-item/review-item.js";
 import "./components/seo-meta-tag/seo-meta-tag.js";