HALF WORK!

1 files changed, 49 insertions, 0 deletions

diff --git a/www-2/src/components/Friend.astro b/www-2/src/components/Friend.astro
new file mode 100644
index 0000000..d0de0ab
--- /dev/null
+++ b/www-2/src/components/Friend.astro
@@ -0,0 +1,49 @@
+---
+import githubIcon from "../assets/img/github.png";
+
+interface Props {
+    name: string;
+    url?: string;
+    githubUrl: string;
+    avatarUrl: string;
+    tag?: string;
+}
+
+const { name, githubUrl, url = githubUrl, avatarUrl, tag } = Astro.props;
+---
+
+<div class="friend">
+    <a rel="noopener noreferrer" href={url}>
+        <img
+            class="friend-avatar"
+            alt={`Friend ${name}'s avatar`}
+            src={avatarUrl}
+            width="80"
+            height="80"
+        /><br />{name}</a
+    >
+    <a rel="noopener noreferrer" href={githubUrl}>
+        <img class="friend-github" src={githubIcon.src} />
+    </a><br />
+    {tag && <span class="friend-tag">{tag}</span>}
+</div>
+
+<style>
+.friend a {
+  font-family: unset;
+}
+
+.friend-avatar {
+  object-fit: cover;
+}
+
+.friend-github {
+  width: 1em;
+  vertical-align: middle;
+  margin-right: -0.5em;
+}
+
+.friend-tag {
+  font-size: 0.8em;
+}
+</style>
\ No newline at end of file