new logo + favicon

MediaComem · Dec 6, 2022 · bdfb939 · bdfb939
1 parent 31ff44d
commit bdfb939
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 10 deletions.
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/src/assets/logo.svg b/src/assets/logo.svg
diff --git a/src/components/layout/ByteSimHeader.tsx b/src/components/layout/ByteSimHeader.tsx
@@ -6,7 +6,9 @@ import { setName } from "../../features/project/projectSlice";
 import ButtonWithIconCustom from "./ButtonWithIconCustom";
 import SaveProjectButton from "../project/SaveProjectButton";
 import { useNavigate } from "react-router-dom";
+import { ReactComponent as Logo } from "../../assets/logo.svg";
 import UploadButton from "../project/UploadButton";
+import { css } from "@emotion/css";
 
 export default function BytesimeHeader() {
   const projectName = useAppSelector((state) => state.project.name);
@@ -21,13 +23,16 @@ export default function BytesimeHeader() {
       borderBottom="1px solid lightgray"
       id="header"
     >
-      <Flex p={2} gap={2} align="center">
-        <Heading size={"md"}>
-          ■ ByteSim{" "}
-          <Badge colorScheme="yellow" variant="outline">
-            Version alpha
-          </Badge>
-        </Heading>
+      <Flex p={2} gap={4} align="center">
+        <Flex align={"flex-end"} gap={2}>
+          <Logo className={css({ height: "40px", width: "auto" })} />
+          <div>
+            <Badge colorScheme="orange" variant="outline" fontSize={"2xs"}>
+              Beta
+            </Badge>
+            <Heading size={"md"}>ByteSim</Heading>
+          </div>
+        </Flex>
         <Heading size={"md"} fontWeight={"light"}>
           <Input
             variant={"flushed"}
@@ -40,7 +45,6 @@ export default function BytesimeHeader() {
           />
         </Heading>
         <SaveProjectButton />
-
         <UploadButton />
       </Flex>
       <ButtonWithIconCustom

diff --git a/src/components/project/SaveProjectButton.tsx b/src/components/project/SaveProjectButton.tsx
@@ -9,6 +9,7 @@ export default function SaveProjectButton() {
       <Button
         onClick={onOpen}
         size={'sm'}
+        variant='outline'
       >
         Save project
       </Button>

diff --git a/src/components/project/UploadButton.tsx b/src/components/project/UploadButton.tsx
@@ -1,6 +1,5 @@
 import {
   Button,
-  Input,
   Modal,
   ModalBody,
   ModalContent,
@@ -30,7 +29,7 @@ export default function UploadButton() {
 
   return (
     <>
-      <Button onClick={onOpen} size={"sm"}>
+      <Button onClick={onOpen} size={"sm"} variant='outline'>
         Import an Artwork
       </Button>
       <Modal isOpen={isOpen} onClose={onClose}>