Commit 4c74350f authored by jang dong hyeok's avatar jang dong hyeok
Browse files

div 사이즈 통일

parent 514ebfde
...@@ -23,6 +23,8 @@ export const Question = ({ ...@@ -23,6 +23,8 @@ export const Question = ({
const [question, setQuestion] = useState(element); const [question, setQuestion] = useState(element);
const isEditing = question.isEditing; const isEditing = question.isEditing;
const [questions, setQuestions] = useState();
async function handleEditComplete() { async function handleEditComplete() {
question.content.choices.map((choice) => { question.content.choices.map((choice) => {
if (choice.text.trim() === "") { if (choice.text.trim() === "") {
...@@ -84,11 +86,12 @@ export const Question = ({ ...@@ -84,11 +86,12 @@ export const Question = ({
const dropResult = monitor.getDropResult<DropResult>(); const dropResult = monitor.getDropResult<DropResult>();
if (item && dropResult) { if (item && dropResult) {
alert(`You dropped ${item.name}`); alert(`You dropped ${item.name}`);
} else {
alert("you dropped wrong place");
} }
}, },
collect: (monitor) => ({ collect: (monitor) => ({
isDragging: monitor.isDragging(), isDragging: monitor.isDragging(),
handlerId: monitor.getHandlerId(),
}), }),
})); }));
...@@ -98,19 +101,22 @@ export const Question = ({ ...@@ -98,19 +101,22 @@ export const Question = ({
isOver: monitor.isOver(), isOver: monitor.isOver(),
canDrop: monitor.canDrop(), canDrop: monitor.canDrop(),
}), }),
hover(item, monitor) {
if (!isDragging) {
return;
}
},
})); }));
// //
return ( return (
<div ref={drop} className="flex w-full h-full justify-center"> <div
ref={drop}
className="flex w-4/5 h-full justify-center"
style={{
border: isOver ? "dotted" : "",
}}
>
<div <div
ref={drag} ref={drag}
style={{ borderColor: isEditing ? "red" : "#0A8A8A" }} style={{
borderColor: isEditing ? "red" : "#0A8A8A",
}}
className={ className={
"flex flex-col container w-full h-auto border-2 items-center m-3 py-2 rounded-lg cursor-move " "flex flex-col container w-full h-auto border-2 items-center m-3 py-2 rounded-lg cursor-move "
} }
......
...@@ -42,50 +42,52 @@ export const SurveyTitleAndComment = ({ ...@@ -42,50 +42,52 @@ export const SurveyTitleAndComment = ({
}; };
return ( return (
<div <div className="flex w-4/5 h-full justify-center">
className={`flex flex-col container w-4/5 h-auto border-2 items-center m-3 py-2 rounded-lg ${ <div
disabled ? "border-themeColor" : "border-red-500" className={`flex flex-col container w-full h-auto border-2 items-center m-3 py-2 rounded-lg ${
}`} disabled ? "border-themeColor" : "border-red-500"
> }`}
<input >
type="text" <input
name="title" type="text"
className="w-11/12 md:w-1/2 font-bold text-4xl text-center m-2 border-b-2" name="title"
placeholder="설문지 제목" className="w-11/12 md:w-1/2 font-bold text-4xl text-center m-2 border-b-2"
autoComplete="on" placeholder="설문지 제목"
value={state.title} autoComplete="on"
disabled={disabled} value={state.title}
onChange={handleChange} disabled={disabled}
/> onChange={handleChange}
<input />
type="text" <input
name="comment" type="text"
className="w-11/12 md:w-1/2 font-bold text-1xl text-center m-2 border-b-2 resize-none" name="comment"
placeholder="설문조사에 대한 설명을 입력해주세요" className="w-11/12 md:w-1/2 font-bold text-1xl text-center m-2 border-b-2 resize-none"
autoComplete="on" placeholder="설문조사에 대한 설명을 입력해주세요"
size={50} autoComplete="on"
value={state.comment} size={50}
disabled={disabled} value={state.comment}
onChange={handleChange} disabled={disabled}
/> onChange={handleChange}
/>
<div className="flex w-11/12 justify-end"> <div className="flex w-11/12 justify-end">
{disabled ? ( {disabled ? (
<> <>
<button type="button" className="px-1" onClick={onEdit}> <button type="button" className="px-1" onClick={onEdit}>
수정 수정
</button> </button>
</> </>
) : ( ) : (
<> <>
<button type="button" className="px-1" onClick={onCancel}> <button type="button" className="px-1" onClick={onCancel}>
취소 취소
</button> </button>
<button type="button" className="px-1" onClick={handleConfirm}> <button type="button" className="px-1" onClick={handleConfirm}>
확인 확인
</button> </button>
</> </>
)} )}
</div>
</div> </div>
</div> </div>
); );
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment