From 646c64c7d9177652697ba6b1a35d88400abbde6c Mon Sep 17 00:00:00 2001
From: MikeBaier5 <mike.baier91@icloud.com>
Date: Mon, 8 May 2023 01:46:31 +0200
Subject: [PATCH] Hovering tile finished

---
 .DS_Store                         | Bin 0 -> 8196 bytes
 .idea/.gitignore                  |   5 +++
 .idea/anwendungsprojekt.iml       |  12 ++++++
 .idea/modules.xml                 |   8 ++++
 .idea/vcs.xml                     |   6 +++
 anwendung/src/components/tile.jsx |  67 ++++++++++++++++++++++++++++++
 anwendung/src/styles/globals.css  |   1 +
 7 files changed, 99 insertions(+)
 create mode 100644 .DS_Store
 create mode 100644 .idea/.gitignore
 create mode 100644 .idea/anwendungsprojekt.iml
 create mode 100644 .idea/modules.xml
 create mode 100644 .idea/vcs.xml
 create mode 100644 anwendung/src/components/tile.jsx

diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..26c6e92ac975d6905db8de302ec2e8b75e439f69
GIT binary patch
literal 8196
zcmeHMzmF0@6n?{T#}dwjLK7OzCKfh$?w#iua}6RESJ=2l3pEG_a_cQS1Qsa>3AI*M
zhT4J{3tRsI6a5FQsjaovH$Q;cg#~ObhMP%dzGddUot^K!nYV8N0FrN4b^$T~U|?mK
zPGK{ruyIyrN=)`#K_sXTZf(~-ruD{*r0&oRXa+O`ngPv#X5fEe0An^QMnv2fqq@}$
zXa>$D1MGY-u`<j_><i>a2R1wfK#XHIFL<417l@|BoW#CB9Kk|_Dxy#&GQ}W59s5lw
zmy_5RDAa+-<b%kWiOf(4pB?XSa&aIzfx6WUXa;5(V7Yr7cAy3h_-g)64sP$MV|7|6
zlwDfJKHO^k&2O=<cZ1`Vh2xEr>9+xLI6_rOLJ2(RKo#2xw6U!nx%61h!ZtFSVdoDo
zOktizxzlP$jW6Yf>$H5!`axnF@y)G-kuXxmbNhsLY`^5UTlrG+Df{(^Qnx(5E|niU
z)lM;e@gDX3lH*mIT*0YSQRLYZ$E(mzp0>S8i|g8Az(^X&Vmj09?pym=^Oj}xvS#<r
zo|QHCZyxk|N#oMh8;1{zr*7S&Z}_tVkw+I?5Wgqw+xaU~tpViYulZ7{U4CZ<F=>}M
z+}7#TLW?C;Tfqi@&N=scZ8tradNmwpD@&ub+VB#5w5J2EuqRxHBeZRm**Ij|&#0r?
zcB%fFSbFI?19mqOgH^ayz2L*ocVjPDI+yAb|DqT05QE3urE`V+Wg80U6)p6Y8t(i^
zKOvVxeiEq{;BELlfqId$Dqo+P@5g*Cke}|IRpbNw3`h7Vkbnj>fx;_X^(pwl-9XqG
zpzel{^qTm7XjK7=rM9lkvZUH+@L+Pfh3=zzakNyxCfnR+L-z@JD6`r+7jd#fhUNeF
zqrd;JGX;8Wnt^lA0ErjuLLO-tzo3R0VY#-6^#xW|m|R~VSHXs-<A^*RN1Xg&h}R~H
yGM${nzCi53a^@cb_`9eYS5}GVYJ^!uJ`ih$Beu{`tkLm5m~VoP|IACyto#MaT0+7A

literal 0
HcmV?d00001

diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..b58b603
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
diff --git a/.idea/anwendungsprojekt.iml b/.idea/anwendungsprojekt.iml
new file mode 100644
index 0000000..24643cc
--- /dev/null
+++ b/.idea/anwendungsprojekt.iml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..da0c51c
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/anwendungsprojekt.iml" filepath="$PROJECT_DIR$/.idea/anwendungsprojekt.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..35eb1dd
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/anwendung/src/components/tile.jsx b/anwendung/src/components/tile.jsx
new file mode 100644
index 0000000..55a7af2
--- /dev/null
+++ b/anwendung/src/components/tile.jsx
@@ -0,0 +1,67 @@
+import React from 'react';
+
+const Tile = () => {
+    const [isHovered, setIsHovered] = React.useState(false);
+    const [cursorPosition, setCursorPosition] = React.useState({ x: 0, y: 0 });
+    const tileRef = React.useRef(null);
+
+    const handleMouseEnter = () => {
+        setIsHovered(true);
+    };
+
+    const handleMouseLeave = () => {
+        setIsHovered(false);
+    };
+
+    const handleMouseMove = (event) => {
+        if (tileRef.current) {
+            const rect = tileRef.current.getBoundingClientRect();
+            setCursorPosition({
+                x: event.clientX - rect.left,
+                y: event.clientY - rect.top,
+            });
+        }
+    };
+
+    return (
+        <div
+            ref={tileRef}
+            onMouseEnter={handleMouseEnter}
+            onMouseLeave={handleMouseLeave}
+            onMouseMove={handleMouseMove}
+            style={{
+                backgroundColor: 'rgba(255,0,0,0.89)',
+                width: '250px',
+                height: '150px',
+                margin: '10px',
+                transition: 'transform 0.2s',
+                transform: isHovered ? 'translateY(-5px)' : 'none',
+                position: 'relative',
+                borderRadius: '10px',
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+            }}
+        >
+            <span style = {{ color: 'white', fontWeight: 'bold'}}>Kalender</span>
+
+
+            {isHovered && (
+                <div
+                    style={{
+                        position: 'absolute',
+                        top: cursorPosition.y - 10,
+                        left: cursorPosition.x - 10,
+                        width: '20px',
+                        height: '20px',
+                        borderRadius: '50%',
+                        background:
+                            'radial-gradient(circle at center, rgba(255, 255, 255) 0%, rgba(255,255,255,0) 70%)',
+                    }}
+                />
+            )}
+        </div>
+    );
+};
+
+export default Tile;
diff --git a/anwendung/src/styles/globals.css b/anwendung/src/styles/globals.css
index 6ae40b4..ec7cbc8 100644
--- a/anwendung/src/styles/globals.css
+++ b/anwendung/src/styles/globals.css
@@ -298,3 +298,4 @@ Calender View
   cursor: default;
   pointer-events: none;
 }
+