simple new blog

src/components/profile.ts

@@ -0,0 +1,18 @@
+import type { Profile } from '../types.js'
+
+export function renderProfile(profile: Profile): string {
+  return `
+    <div class="profile">
+      ${profile.avatar ? `<img src="${profile.avatar}" alt="avatar" class="profile-avatar">` : ''}
+      <div class="profile-info">
+        <h1 class="profile-name">${profile.displayName || profile.handle}</h1>
+        <p class="profile-handle">@${profile.handle}</p>
+        ${profile.description ? `<p class="profile-desc">${profile.description}</p>` : ''}
+      </div>
+    </div>
+  `
+}
+
+export function mountProfile(container: HTMLElement, profile: Profile): void {
+  container.innerHTML = renderProfile(profile)
+}