improvements with blur and stuff

components/Modals/ShortcutHelpModal.tsx

@@ -225,15 +225,16 @@ export default function ShortcutHelpModal() {
                 </span>
 
                 <span className="flex flex-col ml-2 items-end">
-                  <span className="text-lg text-gray-500">Join a Room</span>
+                  <span className="text-lg text-gray-500">
+                    Create a Meeting Room
+                  </span>
                   <span className={`text-md text-gray-300 text-right`}>
                     Click on the{" "}
                     <button className="inline bg-gray-300 bg-opacity-25 p-1 rounded hover:bg-opacity-40">
                       <FaPlus className="text-md text-white" />
                     </button>{" "}
-                    to create a <br></br>
+                    to create a formal <FcGoogle className="inline text-lg" />{" "}
-                    <FcGoogle className="inline text-lg" /> Meet (if your team
+                    Meet.
-                    has GSuite).
                   </span>
                   <span className={`text-md text-teal-600 text-right`}>
                     Spontaneous, scheduled, or recurring rooms.

components/RoomCard.tsx

@@ -350,7 +350,7 @@ export default function RoomCard(props: IRoomCardProps) {
     <span
       className={`flex flex-col ${
         isUserInRoom ? " bg-white bg-opacity-80" : "bg-gray-300 bg-opacity-25"
-      }  rounded-lg justify-between w-96 m-2 shrink-0 h-[14rem]`}
+      }  rounded-lg justify-between w-96 m-2 shrink-0 h-[14rem] shadow-md`}
     >
       {/* header */}
       <span className="flex flex-row justify-between items-start space-x-1 p-5 h-full">

pages/index.js

@@ -65,7 +65,7 @@ export default function Home() {
 
             {currUser ? (
               <>
-                <span className="text-gray-500">Welcome back,</span>
+                <span className="text-gray-500">Welcome back!</span>
                 <button
                   onClick={() => window.open("/teams", "_self")}
                   className="rounded font-semibold bg-gray-200 p-2 text-teal-600 shadow-lg flex flex-row items-center space-x-2"

styles/globals.css

@@ -34,6 +34,10 @@ main {
   background-size: cover;
 }
 
+section {
+  @apply backdrop-blur-md;
+}
+
 .font-satisfy {
   font-family: "Satisfy", cursive;
 }