Added logo

app/components/header.tsx

@@ -2,6 +2,7 @@ import { Separator, Surface, Typography } from "@heroui/react";
 import { Tabs } from "@heroui/react";
 import { Button } from "@heroui/react";
 import { useNavigate, useLocation } from "react-router";
+import porning from "../images/porning.svg";
 
 export function Header() {
     const location = useLocation();
@@ -39,19 +40,7 @@ export function Header() {
                     </Tabs.ListContainer>
                 </Tabs>
                 <div className="absolute flex left-1/2 -translate-x-1/2">
-                <Typography.Heading
-                    level={2}
-                    align="center"
-                >
-                    Porning
-                </Typography.Heading>
-                <Separator orientation="vertical" variant="tertiary" className="bg-white mx-4"/>
-                <Typography.Heading
-                    level={2}
-                    align="center"
-                >
-                    CS2
-                </Typography.Heading>
+                <img className="h-12" src={porning} alt="Porning logo" />
                 </div>
                <Button>Login</Button>
             </Surface>