back. WiP

graph package (reactflow), updates. assets, some of the SEO. started with some basic components, login, navbar, etc.

src/pages/Landing/Landing.module.css

@@ -0,0 +1,27 @@
+.app_header {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+}
+
+.app_logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .app_logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

src/pages/Landing/index.jsx

@@ -0,0 +1,28 @@
+import React, { useEffect } from "react"
+import { useSearchParams } from "react-router-dom";
+import styles from "./Landing.module.css"
+import logo from '../../assets/icons/logo.svg';
+import { showSuccessToastNotification } from "../../components/ToastNotification";
+
+
+const Landing = () => {
+	// eslint-disable-next-line no-unused-vars
+	const [searchParams, setSearchParams] = useSearchParams();
+	useEffect(() => {
+		if (searchParams.get("login") === "success") {
+			showSuccessToastNotification("Logged in!");
+		}
+	}, [searchParams]);
+	return (
+		<header className={styles.app_header}>
+			<img src={logo} className={styles.app_logo} alt="logo" />
+			<h1>Organize your Spotify playlists as a graph.</h1>
+			<h5>Features:</h5>
+			<ul>
+				<li>blah 1</li>
+			</ul>
+		</header>
+	)
+}
+
+export default Landing