Commit 69f157f6 authored by jang dong hyeok's avatar jang dong hyeok
Browse files

UI 수정

parent 88e6bd35
......@@ -53,7 +53,7 @@ export const AQuestion = ({ question, answerQuestion, addFiles }: Props) => {
return (
<div className="flex flex-col container w-4/5 h-auto border-2 border-themeColor items-center m-3 py-4">
<div className="flex flexgi-row my-1 w-11/12 place-content-between items-center">
<div className="flex my-1 w-11/12 place-content-between items-center">
<div className="text-xl font-bold">{question.title}</div>
{question.isRequired ? (
<div className="text-xs text-red-600">* 필수질문</div>
......
......@@ -29,7 +29,7 @@ export const MySurveyCard = ({ data }: Props) => {
};
const copyLink = () => {
navigator.clipboard.writeText(`http://localhost:8080/surveys/${data._id}`);
navigator.clipboard.writeText(`http://localhost:8080/survey/${data._id}`);
alert("설문조사의 링크가 클립보드에 저장되었습니다.");
};
......@@ -52,9 +52,9 @@ export const MySurveyCard = ({ data }: Props) => {
}
return (
<div className="w-52 h-60 rounded border-2 hover:border-2 hover:border-themeColor">
<div className="w-40 h-48 md:w-52 md:h-60 rounded border-2 hover:border-2 hover:border-themeColor">
<button className="w-full" onClick={editSurvey}>
<div className="h-36 p-5">
<div className="h-24 md:h-36 p-3">
<p className="text-gray-700">
{data.comment ? data.comment : "설명없는 설문조사"}
</p>
......@@ -70,14 +70,14 @@ export const MySurveyCard = ({ data }: Props) => {
</p>
</div>
</button>
<div className="flex justify-end pt-1">
<div className="flex justify-end pt-1 pr-1">
<label className="pt-1">링크복사</label>
<button className="" onClick={copyLink}>
<img src={CopyImg} alt="copy"></img>
</button>
<button
type="button"
className="bg-themeColor rounded text-white py-1 px-1.5 ml-1"
className="bg-themeColor rounded text-white py-1 px-1.5 ml-1 "
onClick={deleteSurvey}
>
삭제
......
......@@ -36,12 +36,12 @@ export const Profile = () => {
return (
<div className="flex flex-col items-center">
<div className="mt-10 text-xl font-bold">나의 설문조사</div>
<div className="grid grid-cols-1 md:grid-cols-4 sm:grid-cols-2 gap-4 mt-6">
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mt-6">
<button
onClick={createSurvey}
className="flex h-60 w-52 items-center border-2 border-themeColor font-bold bg-gray-200 hover:bg-themeColor rounded-lg "
className="flex w-40 h-48 md:h-60 md:w-52 items-center border-2 border-themeColor font-bold bg-gray-200 hover:bg-themeColor rounded-lg "
>
<div className="text-center px-6 py-6 font-bold text-gray-500 place-items-center hover:text-white">
<div className="text-center md:px-6 md:py-6 font-xs md:font-bold text-gray-500 place-items-center hover:text-white">
CREATE NEW SURVEY!
</div>
</button>
......
......@@ -38,11 +38,11 @@ export const RatingForm = ({ element, handleQuestion, save }: Props) => {
return (
<>
<div className="flex place-content-between items-center p-5">
<div className="flex place-content-between items-center w-full p-5 overflow-x-scroll">
<input
name="minRateDescription"
className="border-b-2 text-center"
size={10}
size={3}
placeholder="비동의"
value={element.content.minRateDescription}
onChange={handleContent}
......@@ -64,7 +64,7 @@ export const RatingForm = ({ element, handleQuestion, save }: Props) => {
<input
name="maxRateDescription"
className="border-b-2 text-center"
size={10}
size={3}
placeholder="동의"
value={element.content.maxRateDescription}
onChange={handleContent}
......
......@@ -16,7 +16,11 @@ const Accordion = ({ title, content }: AccordionProps) => {
return (
<div className="p-1">
<div onClick={HandleOpening}>
<div className={"bg-themeColor p-4 flex justify-between text-white"}>
<div
className={
"bg-themeColor rounded-r-lg p-4 flex justify-between text-white"
}
>
<h4 className="font-semibold">{title}</h4>
{isOpened ? "" : ""}
</div>
......
......@@ -21,32 +21,54 @@ export const EditResultButton = () => {
style={({ isActive }) =>
isActive
? {
width: "140px",
color: "white",
backgroundColor: "#58ACFA",
borderTopLeftRadius: "25px",
borderBottomLeftRadius: "25px",
textAlign: "center",
fontWeight: "bold",
fontSize: "20px",
}
: {
borderBottomWidth: "1px",
width: "140px",
borderWidth: "1px",
borderColor: "#58ACFA",
borderTopLeftRadius: "25px",
borderBottomLeftRadius: "25px",
textAlign: "center",
fontSize: "18px",
}
}
>
<div className="text-xl m-3 ">설문지 수정</div>
<div className="m-3 ">설문지 수정</div>
</NavLink>
<NavLink
to={`/surveys/${surveyId}/result`}
style={({ isActive }) =>
isActive
? {
width: "140px",
color: "white",
backgroundColor: "#58ACFA",
borderTopRightRadius: "25px",
borderBottomRightRadius: "25px",
textAlign: "center",
fontWeight: "bold",
fontSize: "20px",
}
: {
borderBottomWidth: "1px",
width: "140px",
borderWidth: "1px",
borderColor: "#58ACFA",
borderTopRightRadius: "25px",
borderBottomRightRadius: "25px",
textAlign: "center",
fontSize: "18px",
}
}
>
<div className="text-xl m-3">응답결과</div>
<div className="m-3">응답결과</div>
</NavLink>
</div>
<Outlet />
......
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