Merge pull request #143 from Kusitms-29th-ASAP/fix/#140

[Fix] 수정사항 반영
Kusitms-29th-ASAP · Sep 2, 2024 · 7cbede0 · 7cbede0
2 parents 20491b0 + a3fd47b
commit 7cbede0
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 6 deletions.
diff --git a/src/components/common/ListBox.tsx b/src/components/common/ListBox.tsx
@@ -190,7 +190,7 @@ const StyledListBox = styled.div<ListBoxProps>`
 `;
 
 const Content = styled.div`
-  width: calc(100% - 61px);
+  width: calc(100% - 100px);
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
@@ -263,7 +263,7 @@ const Delete = styled.div`
 
 const Time = styled.div<{ $language: string }>`
   display: inline-flex;
-  width: 61px;
+  width: 65px;
   height: 100%;
   padding: 16.5px 12px 16.5px 12px;
   justify-content: center;

diff --git a/src/components/home/MealTablePopup.tsx b/src/components/home/MealTablePopup.tsx
@@ -154,7 +154,7 @@ const Week = styled.div`
 `;
 
 const Card = styled.div`
-  height: 50px;
+  height: auto;
   display: flex;
   flex-direction: row;
   padding: 10px 12px;

diff --git a/src/components/home/Todo.tsx b/src/components/home/Todo.tsx
@@ -17,6 +17,8 @@ import {
   noTodoMessage,
 } from "@/data/todoData";
 import { addTodoToast } from "@/data/toastMessagesData";
+import { useSelector } from "react-redux";
+import { RootState } from "@/redux/store";
 
 interface Todo {
   todoId: number;
@@ -37,6 +39,10 @@ const Todo = () => {
   const week = ["일", "월", "화", "수", "목", "금", "토"];
   const [language, setLanguage] = useState<string>("ko");
 
+  const audio = useSelector((state: RootState) => state.audio.audio);
+
+  useEffect(() => {}, [audio]);
+
   /* 날짜를 yyyy-mm-dd 형식으로 변환하는 함수 */
   const formatDate = (date: Date) => {
     return date.toISOString().split("T")[0];
@@ -194,7 +200,7 @@ const Todo = () => {
 
   return (
     <>
-      <TodoContainer ref={containerRef}>
+      <TodoContainer ref={containerRef} $audio={audio}>
         오늘 할 일 잊지마세요!
         <Row>
           <DateLine>
@@ -295,7 +301,7 @@ const Todo = () => {
 
 export default Todo;
 
-const TodoContainer = styled.div`
+const TodoContainer = styled.div<{ $audio: boolean }>`
   width: 100%;
   padding: 16px;
   gap: 10px;
@@ -304,7 +310,7 @@ const TodoContainer = styled.div`
   box-shadow: 0px 0px 64px 0px rgba(30, 41, 59, 0.1);
   ${(props) => props.theme.fonts.body2_b};
   color: ${theme.colors.b700};
-  z-index: 1000;
+  z-index: ${({ $audio }) => ($audio ? "2000" : "300")};
   letter-spacing: -0.28px;
 `;