프리티어 해결

Author: g1nya2

src/scripts/components/card-component.ts

@@ -22,25 +22,22 @@ class CardComponent extends HTMLElement {
     const description = this.getAttribute('description') || '';
 
     this.innerHTML = `
-  <div class="card">
-    <a href="${href}" class="card-link">
-      ${imgSrc
-        ? `<div class="card-icon">
-             <img class="card-img" src="${imgSrc}" alt="${title}" />
-           </div>`
-        : ''
-      }
-      <div class="card-content">
-        <p class="card-description">
-          <strong class="card-title">${title}</strong><br>
-          ${description}
-        </p>
+      <div class="card">
+        <a href="${href}" class="card-link">
+          ${imgSrc
+            ? `<div class="card-icon">
+                <img class="card-img" src="${imgSrc}" alt="${title}" />
+              </div>`
+            : ''}
+          <div class="card-content">
+            <p class="card-description">
+              <strong class="card-title">${title}</strong><br />
+              ${description}
+            </p>
+          </div>
+        </a>
       </div>
-    </a>
-  </div>
-`;
-
-
+    `;
   }
 }
 

src/styles/style.css

@@ -30,8 +30,6 @@
     @apply min-w-0 bg-white rounded-md border border-gray-200 px-4 py-3 mb-4 transition duration-200 hover:border-gray-300 hover:shadow h-full flex flex-col;
   }
 
-  
-
   .card-link {
     @apply flex items-start gap-4 no-underline;
   }
@@ -56,3 +54,22 @@
     @apply text-base font-semibold text-gray-700;
   }
 }
+
+/* 전역 스타일 */
+body {
+  font-family: 'Noto Sans KR', Arial, sans-serif;
+  background: #f8fafc;
+  color: #222;
+  margin: 0;
+  padding: 0;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 700;
+  margin-top: 1.5em;
+  margin-bottom: 0.5em;
+}
+
+p {
+  margin: 0 0 1em 0;
+}