From 35cc723b6874316ca722977e47d282d57721d1ed Mon Sep 17 00:00:00 2001
From: "rnjsals0905@gmail.com" <rnjsals0905@ajou.ac.kr>
Date: Sun, 10 Dec 2023 11:36:29 +0900
Subject: [PATCH] =?UTF-8?q?[EDIT]=20meeting=20info=ED=8E=98=EC=9D=B4?=
=?UTF-8?q?=EC=A7=80=20css=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../src/components/MeetingInfoForm.js | 24 +++++++++----------
react-whenMeet/src/styles/HomeMake.css | 4 ++--
react-whenMeet/src/styles/MeetingInfo.css | 13 +++++++++-
3 files changed, 26 insertions(+), 15 deletions(-)
diff --git a/react-whenMeet/src/components/MeetingInfoForm.js b/react-whenMeet/src/components/MeetingInfoForm.js
index a88b6a4..547140c 100644
--- a/react-whenMeet/src/components/MeetingInfoForm.js
+++ b/react-whenMeet/src/components/MeetingInfoForm.js
@@ -15,8 +15,8 @@ function MeetingInfoForm() {
const [endVote, setEndVote] = useState("");
const [startTime, setStartTime] = useState("");
const [endTime, setEndTime] = useState("");
- const [startNum,setStartNum] = useState();
- const [endNum,setEndNum] = useState();
+ const [startNum, setStartNum] = useState();
+ const [endNum, setEndNum] = useState();
const navigate = useNavigate();
const location = useLocation();
const { title, password } = location.state;
@@ -41,12 +41,12 @@ function MeetingInfoForm() {
};
const handleStartTimeChange = (selectedHour, selectedMinute) => {
- setStartNum(selectedHour*2 + selectedMinute/30)
+ setStartNum(selectedHour * 2 + selectedMinute / 30);
setStartTime(`${selectedHour}:${selectedMinute}:00`);
};
const handleEndTimeChange = (selectedHour, selectedMinute) => {
- setEndNum(selectedHour*2 + selectedMinute/30)
+ setEndNum(selectedHour * 2 + selectedMinute / 30);
setEndTime(`${selectedHour}:${selectedMinute}:00`);
};
@@ -116,16 +116,16 @@ function MeetingInfoForm() {
<div className="calendar-month">
<Calendar usingDate={usingDate} setUsingDate={setUsingDate} />
</div>
- <div className="timeStartEnd">
- <h2>투표 가능 시간</h2>
- <TimeInput onTimeChange={handleStartTimeChange} />
- ~
- <TimeInput onTimeChange={handleEndTimeChange} />
- </div>
<div className="form-input">
+ <div className="timeStartEnd">
+ <h2 className="availableVote">투표 가능 시간</h2>
+ <TimeInput onTimeChange={handleStartTimeChange} />
+ ~
+ <TimeInput onTimeChange={handleEndTimeChange} />
+ </div>
<h2>추가 설정</h2>
<div className="num-of-people">
- <h2>
+ <h2 className="numVoter">
투표 인원수<span className="selection">(선택)</span>
</h2>
<Input
@@ -148,7 +148,7 @@ function MeetingInfoForm() {
/>
</div>
</div>
- <Button type="submit" text="시작하기" disabled={!isFormValid}/>
+ <Button type="submit" text="시작하기" disabled={!isFormValid} />
</div>
</form>
);
diff --git a/react-whenMeet/src/styles/HomeMake.css b/react-whenMeet/src/styles/HomeMake.css
index d2114b5..f6f5b1e 100644
--- a/react-whenMeet/src/styles/HomeMake.css
+++ b/react-whenMeet/src/styles/HomeMake.css
@@ -1,5 +1,5 @@
body {
- background-color:white;
+ background-color: white;
margin: 0;
padding: 0;
}
@@ -7,7 +7,7 @@ body {
form {
width: 50%;
padding: 20px;
- margin:auto;
+ margin: auto;
text-align: center;
}
diff --git a/react-whenMeet/src/styles/MeetingInfo.css b/react-whenMeet/src/styles/MeetingInfo.css
index fc2610f..2883bd9 100644
--- a/react-whenMeet/src/styles/MeetingInfo.css
+++ b/react-whenMeet/src/styles/MeetingInfo.css
@@ -38,8 +38,19 @@ h2 {
font-size: 16px;
padding: 5px;
}
-
+.availableVote {
+ width: 40%;
+ text-align: left;
+ white-space: nowrap;
+}
+.numVoter {
+ width: 50%;
+ text-align: left;
+ white-space: nowrap;
+}
.not-enter {
+ width: 50%;
+ text-align: left;
white-space: nowrap;
}
--
GitLab