Improved branding

Rice-Tech · Jan 28, 2024 · 385969f · 385969f
1 parent d438a2f
commit 385969f
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 14 deletions.
diff --git a/index.html b/index.html
@@ -1,10 +1,10 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" type="image/svg+xml" href="/Logo.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
+    <title>Tumblewords</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/public/Logo.svg b/public/Logo.svg
diff --git a/src/components/QRCode.tsx b/src/components/QRCode.tsx
@@ -5,7 +5,7 @@ import { Button } from "./ui/button";
 const qrCode = new QRCodeStyling({
   width: 300,
   height: 300,
-  image: "../TumbleWorksLogo.svg",
+  image: "../Logo.svg",
   dotsOptions: {
     color: "#slate",
     type: "rounded",
@@ -27,10 +27,10 @@ export default function QRCode({ url }: Props) {
       return;
     }
     qrCode.append(ref.current);
-    const codeCanvas = ref.current.querySelector("canvas")
-    if(!codeCanvas){
-      console.log("No Canvas")
-      return
+    const codeCanvas = ref.current.querySelector("canvas");
+    if (!codeCanvas) {
+      console.log("No Canvas");
+      return;
     }
     codeCanvas.setAttribute("width", "");
     codeCanvas.setAttribute("height", "");
@@ -50,11 +50,8 @@ export default function QRCode({ url }: Props) {
           {url}
         </a>
       </Button>
-
 
       <div className=" flex justify-around w-full" ref={ref} />
     </div>
   );
 }
-
-
diff --git a/src/routes/Home.tsx b/src/routes/Home.tsx
@@ -47,9 +47,15 @@ const Home = () => {
   };
   return (
     <>
-      <h1 className="text-center text-4xl font-semibold leading-none tracking-tight">
-        Tumblewords
-      </h1>
+      <div className="inline-flex items-center justify-around w-full">
+        <span className="inline-flex items-center">
+        <img src="Logo.svg" alt="Tumblewords logo" className="w-12 h-12 mr-2 " />
+        <h1 className="text-4xl font-semibold leading-none tracking-tight">
+          Tumblewords
+        </h1>
+        </span>
+      </div>
+
       <div className=" flex-col w-1/3 aspect-square m-auto justify-around">
         <Card>
           <CardHeader>

diff --git a/src/routes/Root.tsx b/src/routes/Root.tsx
@@ -13,6 +13,11 @@ const Root = () => {
       <AuthProvider>
         <NavigationMenu>
           <NavigationMenuList>
+            <NavigationMenuItem>
+              <Link to={"/"} className={navigationMenuTriggerStyle()}>
+                <img src="Logo.svg" alt="Tumblewords Logo" width="30px"></img>
+              </Link>
+            </NavigationMenuItem>
             <NavigationMenuItem>
               <Link to={"/"} className={navigationMenuTriggerStyle()}>
                 Home