design: 답변 수정 디자인 조정
This commit is contained in:
parent
1f60d52842
commit
e9e8798800
@ -42,23 +42,25 @@ export default function ArticleDetailAnswerInput({ onSubmit, initialAnswer = '',
|
|||||||
return (
|
return (
|
||||||
<form
|
<form
|
||||||
onSubmit={handleSubmit}
|
onSubmit={handleSubmit}
|
||||||
className={styles.answer}
|
className={styles.answerWrapper}
|
||||||
>
|
>
|
||||||
<textarea
|
<div className={styles.answer}>
|
||||||
maxLength={1000}
|
<textarea
|
||||||
value={answer}
|
maxLength={1000}
|
||||||
onChange={handleInput}
|
value={answer}
|
||||||
ref={textareaRef}
|
onChange={handleInput}
|
||||||
placeholder="답변 작성하기"
|
ref={textareaRef}
|
||||||
className={styles.input}
|
placeholder="답변 작성하기"
|
||||||
/>
|
className={styles.input}
|
||||||
{answer && answer.length > 999 && <div className={styles.textLength}>최대 1000글자까지 작성할 수 있습니다.</div>}
|
/>
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
className={styles.button}
|
className={styles.button}
|
||||||
>
|
>
|
||||||
<SendIcon />
|
<SendIcon />
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
|
{answer && answer.length > 999 && <span>최대 1000글자까지 작성할 수 있습니다.</span>}
|
||||||
</form>
|
</form>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1,3 +1,13 @@
|
|||||||
|
.answerWrapper {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
|
|
||||||
|
& > span {
|
||||||
|
align-self: end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.answer {
|
.answer {
|
||||||
border: 1px solid var(--border-color);
|
border: 1px solid var(--border-color);
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
@ -17,6 +27,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.button {
|
.button {
|
||||||
|
align-self: end;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
Loading…
Reference in New Issue
Block a user