Added initial landing page

src/Components/Buttons/Button.tsx

@@ -0,0 +1,64 @@
+import React, { useState } from "react";
+import styles from "../styles";
+import { colors } from "../styles";
+
+export interface props {
+  onClick: React.MouseEventHandler<HTMLButtonElement>;
+  label?: string;
+  type: "light" | "dark";
+  children?: React.ReactNode;
+}
+export default function Button(props: props) {
+  const [clicked, setClicked] = useState(false);
+  return (
+    <div>
+      <button
+        onMouseDown={() => {
+          if (!clicked) {
+            props.onClick;
+            setClicked(true);
+          }
+        }}
+        onMouseUp={() => setClicked(false)}
+        onMouseLeave={() => setClicked(false)}
+        style={{
+          borderRadius: 24,
+          minWidth: "15vw",
+          borderColor: colors.button_border,
+          borderStyle: "solid",
+          borderWidth: 2,
+          paddingBottom: "2vh",
+          paddingTop: "2vh",
+          paddingRight: "5vw",
+          paddingLeft: "5vw",
+          marginBottom: "0.5vh",
+          marginTop: "0.5vh",
+          backgroundColor:
+            props.type == "light"
+              ? clicked
+                ? colors.button_dark
+                : colors.button_light
+              : clicked
+              ? colors.button_light
+              : colors.button_dark,
+        }}
+      >
+        <p
+          style={{
+            ...(props.type == "light"
+              ? clicked
+                ? styles.text_light
+                : styles.text_dark
+              : clicked
+              ? styles.text_dark
+              : styles.text_light),
+            ...styles.text_M,
+          }}
+        >
+          {props.label}
+        </p>
+        {props.children}
+      </button>
+    </div>
+  );
+}

src/Components/Plugins/Redux/Store/Store.tsx

@@ -0,0 +1,12 @@
+import { configureStore } from "@reduxjs/toolkit";
+
+const store = configureStore({
+  reducer: {},
+});
+
+export default store;
+
+// Infer the `RootState` and `AppDispatch` types from the store itself
+export type RootState = ReturnType<typeof store.getState>;
+// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
+export type AppDispatch = typeof store.dispatch;

src/Components/styles.tsx

@@ -0,0 +1,69 @@
+export const colors = {
+  background: "#FFFFFF",
+  header_color: "#141762",
+  font_dark: "#141762",
+  font_light: "#FFFFFF",
+  button_dark: "#141762",
+  button_light: "#FFFFFF",
+  button_border: "#141762",
+  red: "#a44141",
+  orange: "#c57331",
+  green: "#80b28a",
+};
+const styles: { [key: string]: React.CSSProperties } = {
+  background: {
+    backgroundColor: colors.background,
+    position: "fixed",
+    top: 0,
+    left: 0,
+    height: "100%",
+    width: "100%",
+    minHeight: "100%",
+    minWidth: "100%",
+  },
+  text_dark: {
+    color: colors.font_dark,
+    fontWeight: "bold",
+  },
+  text_light: {
+    color: colors.font_light,
+    fontWeight: "bold",
+  },
+  text_red: {
+    color: colors.red,
+    fontWeight: "bold",
+  },
+  text_orange: {
+    color: colors.orange,
+    fontWeight: "bold",
+  },
+  text_green: {
+    color: colors.green,
+    fontWeight: "bold",
+  },
+  text_XL: {
+    fontSize: "clamp(1vw, 4rem, 2vw)",
+  },
+  text_L: {
+    fontSize: "clamp(1vw, 2rem, 2vw)",
+  },
+  text_M: {
+    fontSize: "clamp(1vw, 1rem, 2vw)",
+  },
+  text_S: {
+    fontSize: "clamp(1vw, 0.5rem, 2vw)",
+  },
+  text_XS: {
+    fontSize: "clamp(1vw, 0.2rem, 2vw)",
+  },
+  flex_row: {
+    display: "flex",
+    flexDirection: "row",
+  },
+  flex_column: {
+    display: "flex",
+    flexDirection: "column",
+  },
+};
+
+export default styles;