feat(app): improve header (#382)

Author: AdiPol1359

apps/app/src/components/Header/Header.tsx

@@ -5,10 +5,10 @@ import { HeaderNavigation } from "./HeaderNavigation";
 import { ActiveNavigationLink } from "./ActiveNagivationLink";
 
 export const Header = () => (
-	<div className="bg-violet-600">
+	<div className="bg-primary">
 		<Container
 			as="header"
-			className="flex h-16 items-center justify-between border-b border-violet-500 text-white"
+			className="flex h-16 items-center justify-between border-b border-violet-600 text-white"
 		>
 			<Link href="/">
 				<div className="h-10 w-24 sm:w-36">

apps/app/src/components/Header/HeaderNavigation.tsx

@@ -19,7 +19,7 @@ export const HeaderNavigation = ({ children }: { children: ReactNode }) => {
 			<nav
 				id="header-navigation"
 				className={twMerge(
-					"fixed top-0 left-0 z-10 h-full w-full flex-col items-center justify-center gap-5 bg-violet-600 text-sm uppercase",
+					"fixed top-0 left-0 z-10 h-full w-full flex-col items-center justify-center gap-10 bg-primary text-xl uppercase sm:gap-5 sm:text-sm",
 					"sm:relative sm:flex sm:h-fit sm:w-fit sm:flex-row",
 					isOpen ? "flex" : "hidden",
 				)}