From 0472640a50bd920b927b43496193c3199ae9bd4b Mon Sep 17 00:00:00 2001 From: "rnjsals0905@gmail.com" <rnjsals0905@ajou.ac.kr> Date: Sat, 9 Dec 2023 21:49:00 +0900 Subject: [PATCH] [EDIT] meeting info from option selection --- .../src/components/MeetingInfoForm.js | 31 ++++++++++++------- react-whenMeet/src/styles/MeetingInfo.css | 4 +++ 2 files changed, 24 insertions(+), 11 deletions(-) diff --git a/react-whenMeet/src/components/MeetingInfoForm.js b/react-whenMeet/src/components/MeetingInfoForm.js index 34cfe38..7c6f0cf 100644 --- a/react-whenMeet/src/components/MeetingInfoForm.js +++ b/react-whenMeet/src/components/MeetingInfoForm.js @@ -94,7 +94,11 @@ function MeetingInfoForm() { <h1>약속 일정 만들기</h1> <div className="purpose"> <h2 className="not-enter">약속 목적 </h2> - <select className="purpose-selector" value={meetingPurpose} onChange={handleOnChange}> + <select + className="purpose-selector" + value={meetingPurpose} + onChange={handleOnChange} + > <option value="선택">선택</option> <option value="스터디">스터디</option> <option value="회의">회의</option> @@ -106,10 +110,18 @@ 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"> <h2>추가 설정</h2> <div className="num-of-people"> - <h2>투표 인원수</h2> + <h2> + 투표 인원수<span className="selection">(선택)</span> + </h2> <Input classname="voteNumber" type="number" @@ -118,19 +130,16 @@ function MeetingInfoForm() { placeholder="인원수" /> </div> - <div className="timeStartEnd"> - <h2>투표 가능 시간</h2> - <TimeInput onTimeChange={handleStartTimeChange} /> - ~ - <TimeInput onTimeChange={handleEndTimeChange} /> - </div> <div className="end-time"> - <h2 className="not-enter">투표 종료 시간</h2> + <h2 className="not-enter"> + 투표 종료 시간<span className="selection">(선택)</span> + </h2> <Input - classname= "vote-end" + classname="vote-end" type="datetime-local" value={endVote} - onChange={handleVoteEnd} /> + onChange={handleVoteEnd} + /> </div> </div> <Button type="submit" text="시작하기" /> diff --git a/react-whenMeet/src/styles/MeetingInfo.css b/react-whenMeet/src/styles/MeetingInfo.css index 59ff1c1..fc2610f 100644 --- a/react-whenMeet/src/styles/MeetingInfo.css +++ b/react-whenMeet/src/styles/MeetingInfo.css @@ -9,6 +9,10 @@ body { padding: 0px; } +span.selection { + color: gray; +} + .center-container2 { display: flex; flex-direction: column; /* 세로 방향으로 정렬 */ -- GitLab