From 179eb32470830e28e596b52a5e3b7db26f4ac840 Mon Sep 17 00:00:00 2001
From: Mathias Wagner <germannewsmaker@gmail.com>
Date: Sun, 9 Jul 2023 02:41:20 +0200
Subject: [PATCH] Created the Terms.jsx page

---
 src/pages/Terms/Terms.jsx | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)
 create mode 100644 src/pages/Terms/Terms.jsx

diff --git a/src/pages/Terms/Terms.jsx b/src/pages/Terms/Terms.jsx
new file mode 100644
index 0000000..6607c9a
--- /dev/null
+++ b/src/pages/Terms/Terms.jsx
@@ -0,0 +1,26 @@
+import {Stack, Typography, useMediaQuery, useTheme} from "@mui/material";
+import TermsImage from "@/common/assets/images/legal/terms.svg";
+
+export const Terms = () => {
+    const theme = useTheme();
+    const isMobile = useMediaQuery(theme.breakpoints.down("lg"));
+
+    return (
+        <Stack direction="column" justifyContent="center"
+               sx={{mt: 15, ml: {lg: "auto", xs: "0"}, mr: {lg: "auto", xs: "0"}, width: {lg: "80%", xs: "100%"}}}>
+            <Stack direction="row" justifyContent="space-between">
+                <Stack direction="column" justifyContent="center" sx={{width: "40rem", overflow: "hidden",
+                    textOverflow: "ellipsis"}}>
+                    <Typography fontWeight={700} noWrap variant={isMobile ? "h5" : "h3"}>Nutzungsbedingungen</Typography>
+                    <Typography fontWeight={400} sx={{mt: 2}} variant={isMobile ? "h7" : "h5"}>
+                        Die Nutzung dieser Website ist nur unter Einhaltung der folgenden Nutzungsbedingungen zulässig.
+                        Durch die Nutzung dieser Website erklären Sie sich mit diesen Nutzungsbedingungen einverstanden.
+                    </Typography>
+                </Stack>
+
+                {!isMobile && <img src={TermsImage} alt="Terms" height={400}/>}
+            </Stack>
+
+        </Stack>
+    )
+}
\ No newline at end of file