1 files changed, 34 insertions, 0 deletions

diff --git a/src/ui/components/Logo.tsx b/src/ui/components/Logo.tsx
new file mode 100644
index 0000000..a9ec9be
--- /dev/null
+++ b/src/ui/components/Logo.tsx
@@ -0,0 +1,34 @@
+import type { HTMLAttributes } from "corvos/plugins/jsx.ts";
+
+import site from "@/corvos.config.ts";
+
+export type Props = HTMLAttributes<"a"> & {
+        size?: "sm" | "lg";
+        variant?: "static-black" | "static-white";
+};
+
+export const Logo = async ({ size, variant, class: cls, ...props }: Props) => {
+        const symbols = await site.load("assets/symbols.svg");
+
+        return (
+                <a
+                        aria-label="Home"
+                        class:list={[
+                                "c-logo",
+                                {
+                                        [`c-logo--${size}`]: size,
+                                        [`c-logo--${variant}`]: variant,
+                                },
+                                cls,
+                        ]}
+                        href={site.$.url()}
+                        rel="home"
+                        {...props}
+                >
+                        <svg class="c-logo__img">
+                                <title>Logo</title>
+                                <use href={`${symbols.url}#logo${size === "sm" ? "-sm" : ""}`} />
+                        </svg>
+                </a>
+        );
+};