Index page updates

src/components/Dropdown.tsx

@@ -0,0 +1,22 @@
+import React, {useState} from 'react';
+
+type DropdownProps = {
+    name: string,
+    content: React.JSX.Element[]
+}
+
+export default function Dropdown(props: DropdownProps) {
+    const [active, setActive] = useState(false)
+    return (
+        <>
+            <div className="relative flex py-5 items-center hover:cursor-pointer" onClick={() => active ? setActive(false) : setActive(true)}>
+                <span className="flex-shrink mx-4 text-gray-400">{props.name}</span>
+                <div className="flex-grow border-t border-gray-400"></div>
+            </div>
+
+            <div className={`${active ? "block" : "hidden"} inline-block`}>
+                {props.content}
+            </div>
+        </>
+    )
+}

src/components/ProjectsCard.tsx

@@ -0,0 +1,23 @@
+import Link from "next/link"
+
+type ProjectCardProps = {
+    name: string,
+    key: string,
+    description: string,
+    urlTo: string
+}
+
+export default function ProjectCard(props: ProjectCardProps) {
+    return (
+        <Link href={props.urlTo} target="_blank" rel="noreferrer">
+            <div className="inline">
+                <div key={props.key} className="w-1/2 rounded-lf relative">
+                    <div className="top-0 left-0 p-2 bg-gray-500">
+                        <p className="font-bold">{props.name}</p>
+                        <p className="text-sm">{props.description}</p>
+                    </div>
+                </div>  
+            </div>
+        </Link>
+    )
+}

src/components/footer.tsx

@@ -10,6 +10,9 @@ export default function Footer() {
                         alex@alexavfrantz.com
                     </Link>
                 </p>
+                <p className="text-center">
+                    All music, game, TV and movie covers are owned by their respective authors.
+                </p>
                 <p className="text-center">
                     &copy; Alex Frantz, 2023
                 </p>