From 176e675dd619c6c13f85a2fd43526bd0169f09c8 Mon Sep 17 00:00:00 2001 From: d0dam Date: Tue, 5 Sep 2023 11:10:59 +0900 Subject: [PATCH] =?UTF-8?q?refactor:=20layout=20shift=20=EC=B5=9C=EC=86=8C?= =?UTF-8?q?=ED=99=94=EB=A5=BC=20=EC=9C=84=ED=95=9C=20reflow=20=EC=9E=91?= =?UTF-8?q?=EC=97=85=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Home/components/CustomCursor/CustomCursor.tsx | 3 +-- src/pages/Search/components/GifItem/GifItem.module.css | 3 ++- src/pages/Search/components/HelpPanel/HelpPanel.module.css | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pages/Home/components/CustomCursor/CustomCursor.tsx b/src/pages/Home/components/CustomCursor/CustomCursor.tsx index 4c6ad7b3..fd86a261 100644 --- a/src/pages/Home/components/CustomCursor/CustomCursor.tsx +++ b/src/pages/Home/components/CustomCursor/CustomCursor.tsx @@ -14,8 +14,7 @@ const CustomCursor = ({ text = '' }: CustomCursorProps) => { useEffect(() => { if (cursorRef.current) { - cursorRef.current.style.top = `${mousePosition.pageY}px`; - cursorRef.current.style.left = `${mousePosition.pageX}px`; + cursorRef.current.style.transform = `translate(${mousePosition.pageX}px, ${mousePosition.pageY}px)`; } }, [mousePosition]); diff --git a/src/pages/Search/components/GifItem/GifItem.module.css b/src/pages/Search/components/GifItem/GifItem.module.css index 1eea2746..661be34c 100644 --- a/src/pages/Search/components/GifItem/GifItem.module.css +++ b/src/pages/Search/components/GifItem/GifItem.module.css @@ -14,7 +14,8 @@ } .gifItem:hover { - top: -0.75rem; + /* top: -0.75rem; */ + transform: translateY(-0.75rem); } .gifImage { diff --git a/src/pages/Search/components/HelpPanel/HelpPanel.module.css b/src/pages/Search/components/HelpPanel/HelpPanel.module.css index f44a0aaf..5adfb7f1 100644 --- a/src/pages/Search/components/HelpPanel/HelpPanel.module.css +++ b/src/pages/Search/components/HelpPanel/HelpPanel.module.css @@ -24,7 +24,7 @@ } .selectedItemContainer.showSheet { - right: 0; + transform: translateX(-320px); opacity: 1; }