Infrastructure/pingvin-share
0
Fork 0
mirror of https://github.com/stonith404/pingvin-share.git synced 2025-01-29 01:28:59 -05:00
Code Issues Activity

feat: extract logo to component

Browse source
This commit is contained in:
Elias Schneider 2022-10-14 14:19:32 +02:00
parent a33b5b37d9
commit 58efc48ffa
2 changed files with 36 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
frontend/src/components/Logo.tsx Normal file
View file

@ -0,0 +1,34 @@
const Logo = ({ height, width }: { height: number; width: number }) => {
return (
<svg
id="Layer_1"
data-name="Layer 1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 943.11 911.62"
height={height}
width={width}
>
<ellipse cx="471.56" cy="454.28" rx="471.56" ry="454.28" fill="#46509e" />
<ellipse cx="471.56" cy="390.28" rx="233.66" ry="207" fill="#37474f" />
<path
d="M705.22,849c-36.69,21.14-123.09,64.32-240.64,62.57A469.81,469.81,0,0,1,237.89,849V394.76H705.22Z"
fill="#37474f"
/>
<path
d="M658.81,397.7V873.49a478.12,478.12,0,0,1-374.19,0V397.7c0-95.55,83.78-173,187.1-173S658.81,302.15,658.81,397.7Z"
fill="#fff"
/>
<polygon
points="565.02 431.68 471.56 514.49 378.09 431.68 565.02 431.68"
fill="#46509e"
/>
<ellipse cx="378.09" cy="369.58" rx="23.37" ry="20.7" fill="#37474f" />
<ellipse cx="565.02" cy="369.58" rx="23.37" ry="20.7" fill="#37474f" />
<path
d="M658.49,400.63c0-40-36.6-72.45-81.79-72.45s-81.78,32.41-81.78,72.45a64.79,64.79,0,0,0,7.9,31.05H440.29a64.79,64.79,0,0,0,7.9-31.05c0-40-36.59-72.45-81.78-72.45s-81.79,32.41-81.79,72.45l-46.73-10.35c0-114.31,104.64-207,233.67-207s233.66,92.69,233.66,207Z"
fill="#37474f"
/>
</svg>
);
};
export default Logo;

9
frontend/src/components/navBar/NavBar.tsx
View file

@ -5,7 +5,6 @@ import {
createStyles,
Group,
Header,
Image,
Paper,
Stack,
Text,
@ -16,6 +15,7 @@ import { NextLink } from "@mantine/next";
import getConfig from "next/config";
import { ReactNode, useEffect, useState } from "react";
import useUser from "../../hooks/user.hook";
import Logo from "../Logo";
import ActionAvatar from "./ActionAvatar";
const { publicRuntimeConfig } = getConfig();
@ -180,12 +180,7 @@ const NavBar = () => {
<Container className={classes.header}>
<NextLink href="/">
<Group>
<Image
src="/img/logo.svg"
alt="Pinvgin Share Logo"
height={35}
width={35}
/>
<Logo height={35} width={35} />
<Text weight={600}>Pingvin Share</Text>
</Group>
</NextLink>