diff --git a/web/src/components/general/Logo.tsx b/web/src/components/general/Logo.tsx
index c6a1a49..1d83414 100644
--- a/web/src/components/general/Logo.tsx
+++ b/web/src/components/general/Logo.tsx
@@ -58,3 +58,28 @@ export const Logo = () => {
);
};
+
+export const LogoIcon = ({ face }: { face?: "left" | "right" }) => {
+ return (
+
+ );
+};
diff --git a/web/src/components/general/logo.module.scss b/web/src/components/general/logo.module.scss
index 4d339fd..0f70ce5 100644
--- a/web/src/components/general/logo.module.scss
+++ b/web/src/components/general/logo.module.scss
@@ -10,4 +10,17 @@
svg {
width: 100%;
}
+}
+
+.logoIcon {
+ color: currentColor;
+ width: 3rem;
+
+ svg {
+ width: 100%;
+ }
+
+ &.right {
+ transform: scaleX(-1);
+ }
}
\ No newline at end of file
diff --git a/web/src/components/layout/Header.tsx b/web/src/components/layout/Header.tsx
index 4cb5512..8e076fc 100644
--- a/web/src/components/layout/Header.tsx
+++ b/web/src/components/layout/Header.tsx
@@ -3,7 +3,7 @@ import { useState, useEffect, useRef } from "react";
import { usePathname } from "next/navigation";
import Link from "next/link";
import styles from "./header.module.scss";
-import { Logo } from "../general/Logo";
+import { Logo, LogoIcon } from "@/components/general/Logo";
export const Header = () => {
const [showMenu, setShowMenu] = useState(false);
@@ -87,64 +87,67 @@ export const Header = () => {
>
-
+
);
diff --git a/web/src/components/layout/header.module.scss b/web/src/components/layout/header.module.scss
index a02f272..47b0011 100644
--- a/web/src/components/layout/header.module.scss
+++ b/web/src/components/layout/header.module.scss
@@ -84,12 +84,16 @@
background: var(--color-chateauBlue);
color: var(--color-betongGray);
padding: var(--spacing-sitepadding);
- display: flex;
- flex-direction: column;
- justify-content: center;
- font-size: 1.4rem;
transition: all var(--transition-easing);
+
+ ul {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ font-size: 1.4rem;
+ padding: var(--spacing-sitepadding) 0;
+ }
}
.menuItemLarge {