From e836f04381139f705be87de46bfac0f78cfd8383 Mon Sep 17 00:00:00 2001
From: jhkang0516 <jhkang0516@ajou.ac.kr>
Date: Sat, 9 Dec 2023 16:53:39 +0900
Subject: [PATCH] [EDIT] CalendarWeek, media query update
---
react-whenMeet/package.json | 2 +-
react-whenMeet/src/components/CalendarWeek.jsx | 2 +-
react-whenMeet/src/styles/ResultEnd.css | 14 ++++++++++++--
react-whenMeet/src/styles/ResultMake.css | 6 +++++-
4 files changed, 19 insertions(+), 5 deletions(-)
diff --git a/react-whenMeet/package.json b/react-whenMeet/package.json
index 600f87f..3f1a4cc 100644
--- a/react-whenMeet/package.json
+++ b/react-whenMeet/package.json
@@ -19,7 +19,7 @@
"web-vitals": "^2.1.4"
},
"scripts": {
- "start": "export PORT=3001 && react-scripts start",
+ "start": " react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
diff --git a/react-whenMeet/src/components/CalendarWeek.jsx b/react-whenMeet/src/components/CalendarWeek.jsx
index 604d8f0..3a675e1 100644
--- a/react-whenMeet/src/components/CalendarWeek.jsx
+++ b/react-whenMeet/src/components/CalendarWeek.jsx
@@ -21,7 +21,7 @@ const CalendarWeek = ({
const parseTime = (time) => {
// 자정("00:00:00")을 확인하여 48을 반환
if (time === "00:00:00") {
- return 48;
+ return 0;
}
const [hours, minutes] = time.split(":").map(Number);
diff --git a/react-whenMeet/src/styles/ResultEnd.css b/react-whenMeet/src/styles/ResultEnd.css
index 02692e2..b2e2c2e 100644
--- a/react-whenMeet/src/styles/ResultEnd.css
+++ b/react-whenMeet/src/styles/ResultEnd.css
@@ -44,12 +44,22 @@
align-items: center;
}
@media screen and (max-width: 768px) {
+ .flex-bottom-container {
+ display: flex;
+ justify-content: space-between;
+ width: 100%;
+
+ bottom: 0;
+ left: 0;
+ }
+
+ .mostTime,
.possible {
- position: static;
+ position: relative;
width: 40%;
margin: 200px 20px;
+ height: 40%;
}
-
.flex-row {
flex-direction: column;
width: 100%;
diff --git a/react-whenMeet/src/styles/ResultMake.css b/react-whenMeet/src/styles/ResultMake.css
index 482917b..fcc270a 100644
--- a/react-whenMeet/src/styles/ResultMake.css
+++ b/react-whenMeet/src/styles/ResultMake.css
@@ -55,6 +55,10 @@
}
@media screen and (max-width: 768px) {
+ .mostTime {
+ position: relative;
+ top: 200px;
+ }
.flex-bottom-container {
display: flex;
justify-content: space-between;
@@ -64,11 +68,11 @@
left: 0;
}
- .mostTime,
.possible {
position: static;
width: 40%;
margin: 200px 20px;
+ height: 40%;
}
.flex-row {
flex-direction: column;
--
GitLab