feat: add collection for authors

docs/src/components/Author.astro

@@ -0,0 +1,41 @@
+---
+import { Icon } from '@astrojs/starlight/components';
+
+interface Props {
+	name: string;
+	twitter?: string;
+    linkedin?: string;
+    github?: string;
+}
+
+const { name, twitter, linkedin, github } = Astro.props;
+
+---
+
+<p class="author">
+    Created by {name}
+    {twitter && <a href={twitter}><Icon class='icon' name="twitter" size="0.75rem" /></a>}
+    {linkedin && <a href={linkedin}><Icon class='icon' name="linkedin" size="0.75rem" /></a>}
+    {github && <a href={github}><Icon class='icon' name="github" size="0.75rem" /></a>}
+
+</p>
+
+<style>
+    .author {
+        display: flex;
+        gap: 0.5rem;
+        align-items: center;
+        margin-top: -1rem;
+        font-size: var(--sl-text-xs);
+        color: var(--sl-color-gray-3);
+    }
+    
+    .icon {
+        vertical-align: middle;
+        color: var(--sl-color-gray-3);
+
+        &:hover {
+            color: var(--sl-color-accent-high)
+        }
+    }
+</style>

docs/src/components/Content.astro

@@ -1,15 +1,18 @@
 ---
-import ChallengeFooter from './ChallengeFooter.astro'
-import CommentSection from './CommentSection.astro'
-import type { Props } from '@astrojs/starlight/props';
 import Default from '@astrojs/starlight/components/MarkdownContent.astro';
+import type { Props } from '@astrojs/starlight/props';
+import { getEntry } from 'astro:content';
+import Author from './Author.astro';
+import ChallengeFooter from './ChallengeFooter.astro';
+import CommentSection from './CommentSection.astro';
 
-const {challengeNumber, author} = Astro.props.entry.data;
+const {challengeNumber} = Astro.props.entry.data;
+const author = Astro.props.entry.data.author ? await getEntry(Astro.props.entry.data.author) : null;
 const renderCommentSection = !Astro.props.entry.data.noCommentSection;
 
 ---
 
-{ challengeNumber && author && <p class="author">Created by {author}</p> }
+{ challengeNumber && author && <Author {...author.data}/> }
 
 <Default {...Astro.props}><slot /></Default>
 

docs/src/components/VideoButton.astro

@@ -1,5 +1,11 @@
 ---
 
+interface Props {
+	link: string;
+	alt: string;
+	flag?: 'FR';
+}
+
 const { link, alt, flag } = Astro.props;
 const isFR = flag === 'FR';
 ---