jichoi / lms_front star
정다정 2024-10-21
241021 정다정 상세메뉴 링크 수정
@81f0934564c65eeb9840d4b7daa88d0c767a3d38
client/views/pages/main/MyPlan.vue
--- client/views/pages/main/MyPlan.vue
+++ client/views/pages/main/MyPlan.vue
@@ -1,44 +1,68 @@
 <template>
-    <div style="height: 100%;">
-        <div class="myplan mypage flex" style="height: 100%; padding: 50px;">
-            <div class="textbook book-purple"
-                style="background-color: white; width: 50%; height: 100%; text-align: center;">
+    <div style="height: 100%">
+        <div class="myplan mypage flex" style="height: 100%; padding: 50px">
+            <div
+                class="textbook book-purple"
+                style="background-color: white; width: 50%; height: 100%; text-align: center"
+            >
                 <div class="text">
-                    <p class="title1" style="color: #fff;">스케줄</p>
+                    <p class="title1" style="color: #fff">스케줄</p>
                 </div>
                 <div class="purple-scroll" style="overflow: auto; height: 85%; margin: 5px">
-                    <div style="padding: 10px 20px;">
-                        <p style="text-align: right;cursor: pointer;text-decoration: underline;padding-bottom: 5px;"
-                            class="title2" @click="goToPage2('MyPlan2')">학습 일정 변경하기</p>
+                    <div style="padding: 10px 20px">
+                        <p
+                            style="text-align: right; cursor: pointer; text-decoration: underline; padding-bottom: 5px"
+                            class="title2"
+                            @click="goToPage2('MyPlan2')"
+                        >
+                            학습 일정 변경하기
+                        </p>
                         <p class="title1" v-if="!schedules || schedules.length === 0">오늘 학습할 내용이 없습니다.</p>
 
-                        <div class="flex-column " style="gap: 20px" v-else v-for="(schedule, index) in schedules"
-                            :key="index">
+                        <div
+                            class="flex-column"
+                            style="gap: 20px"
+                            v-else
+                            v-for="(schedule, index) in schedules"
+                            :key="index"
+                        >
                             <div class="flex justify-between align-center" style="gap: 70px">
-                                <div class="wrap cs-pt planBox" :class="{ 'cs-pt-clicked': isClicked }"
-                                    style="width: 100%; background-color: #f1eaff;"
-                                    @click="goToPage('Dashboard', schedule.schdl_id)">
-                                    <div class="text-lf flex justify-between align-center" style="width: 100%;">
-                                        <p class="title2" s>grade 3</p><button type="button" class="popup-close-btn"
-                                            @click="deleteSchedule(schedule.schdl_id)" style="flex-basis: 25px">
+                                <div
+                                    class="wrap cs-pt planBox"
+                                    :class="{ 'cs-pt-clicked': isClicked }"
+                                    style="width: 100%; background-color: #f1eaff"
+                                    @click="goToPage('Dashboard', schedule.schdl_id)"
+                                >
+                                    <div class="text-lf flex justify-between align-center" style="width: 100%">
+                                        <p class="title2" s>grade 3</p>
+                                        <button
+                                            type="button"
+                                            class="popup-close-btn"
+                                            @click="deleteSchedule(schedule.schdl_id)"
+                                            style="flex-basis: 25px"
+                                        >
                                             <svg-icon type="mdi" :path="mdiWindowClose" class="close-btn"></svg-icon>
                                         </button>
                                     </div>
                                     <div class="text-lf flex justify-between align-center">
                                         <div style="flex-basis: 40rem">
-                                            <div class="flex align-center mb10" style="gap: 10px;">
+                                            <div class="flex align-center mb10" style="gap: 10px">
                                                 <p class="title2">
-                                                    <em class="gray-bd"
-                                                        style="background-color: #9528b7; color: white; font-size: 18px;">{{
-                                                            schedule.schdl_unit }}교시</em>
+                                                    <em
+                                                        class="gray-bd"
+                                                        style="background-color: #9528b7; color: white; font-size: 18px"
+                                                        >{{ schedule.schdl_unit }}교시</em
+                                                    >
                                                 </p>
                                                 <p class="title1">{{ schedule.schedule_time }}</p>
                                             </div>
-                                            <div class="title-box mb10" style="display: flex;">
-                                                <span class="title" style="font-size: 28px;">{{ schedule.unit_nm
-                                                    }}</span>
-                                                <p class="title2" style="margin: auto 0;margin-left: 1em;">{{
-                                                    schedule.book_nm }}</p>
+                                            <div class="title-box mb10" style="display: flex">
+                                                <span class="title" style="font-size: 28px">{{
+                                                    schedule.unit_nm
+                                                }}</span>
+                                                <p class="title2" style="margin: auto 0; margin-left: 1em">
+                                                    {{ schedule.book_nm }}
+                                                </p>
                                             </div>
                                         </div>
                                         <!-- <button v-if="schedule.finish == 'T'" type="button" title="바로가기" class="yellow-btn"
@@ -46,15 +70,18 @@
                                     <button v-else type="button" title="바로가기" class="yellow-btn"
                                         @click="goToPage('Dashboard', schedule.schdl_id)"
                                         style="flex-basis: 18rem">바로가기</button> -->
-                                        <div style="flex-basis: 100px"><img src="../../../resources/img/img214_19s.png"
-                                                alt="" style="height: 100px; width: 100px" /></div>
-
+                                        <div style="flex-basis: 100px">
+                                            <img
+                                                src="../../../resources/img/img214_19s.png"
+                                                alt=""
+                                                style="height: 100px; width: 100px"
+                                            />
+                                        </div>
                                     </div>
                                 </div>
                             </div>
                         </div>
                     </div>
-
                 </div>
             </div>
             <!-- <div class="yellow-box mt30">
@@ -68,50 +95,56 @@
                     </div>
                 </div> -->
 
-            <div style="width: 50%;margin-left: 3em;">
+            <div style="width: 50%; margin-left: 3em">
                 <div class="flex">
-                    <div style="display: flex;">
-                        <img src="../../../resources/img/new_img/plan/course_text.png" style="margin: auto 0;">
+                    <div style="display: flex">
+                        <img src="../../../resources/img/new_img/plan/course_text.png" style="margin: auto 0" />
                     </div>
-                    <div style="justify-content: right; width: 100%; display: flex;"
-                        v-for="(ai_learning, index) in aiLearningList" :key="index">
-                        <div style="margin-right: 2em;"
-                            @click="goToPage2('AIDashboard', aiLearningList[index].unit_id); recommendLearning();">
-                            <img src="../../../resources/img/new_img/plan/ai_course_1.png">
+                    <div
+                        style="justify-content: right; width: 100%; display: flex"
+                        v-for="(ai_learning, index) in aiLearningList"
+                        :key="index"
+                    >
+                        <div
+                            style="margin-right: 2em"
+                            @click="
+                                goToPage2('AIDashboard', aiLearningList[index].unit_id);
+                                recommendLearning();
+                            "
+                        >
+                            <img src="../../../resources/img/new_img/plan/ai_course_1.png" />
                         </div>
-                        <div style="margin-right: 2em;"
-                            @click="goToPage2('AIDashboard', aiLearningList[index].unit_id)">
-                            <img src="../../../resources/img/new_img/plan/ai_course_2.png">
+                        <div style="margin-right: 2em" @click="goToPage2('AIDashboard', aiLearningList[index].unit_id)">
+                            <img src="../../../resources/img/new_img/plan/ai_course_2.png" />
                         </div>
                         <div @click="goToPage2('AIDashboard', aiLearningList[index].unit_id)">
-                            <img src="../../../resources/img/new_img/plan/ai_course_3.png">
+                            <img src="../../../resources/img/new_img/plan/ai_course_3.png" />
                         </div>
                     </div>
-
                 </div>
 
-                <div class="flex" style="margin-top: 3em;">
-                    <div style="display: flex;">
-                        <img src="../../../resources/img/new_img/plan/menu_text.png" style="margin: auto 0;">
+                <div class="flex" style="margin-top: 3em">
+                    <div style="display: flex">
+                        <img src="../../../resources/img/new_img/plan/menu_text.png" style="margin: auto 0" />
                     </div>
                     <div class="mpcontainer">
-                        <div class="mpbox" @click="goToPage2('PhotoBook')" style="margin-right: 2em; cursor: pointer;">
-                            <img src="../../../resources/img/new_img/icon/correct_icon.png">
+                        <div class="mpbox" @click="goToPage2('PreviewNote')" style="margin-right: 2em; cursor: pointer">
+                            <img src="../../../resources/img/new_img/icon/correct_icon.png" />
                             <p>채점결과</p>
                         </div>
 
-                        <div class="mpbox" @click="goToPage2('PhotoBook')" style="margin-right: 2em; cursor: pointer;">
-                            <img src="../../../resources/img/new_img/icon/mypage_icon.png">
+                        <div class="mpbox" @click="goToPage2('MyPage')" style="margin-right: 2em; cursor: pointer">
+                            <img src="../../../resources/img/new_img/icon/mypage_icon.png" />
                             <p>생활기록부</p>
                         </div>
 
-                        <div class="mpbox" @click="goToPage2('PhotoBook')" style="margin-right: 2em; cursor: pointer;">
-                            <img src="../../../resources/img/new_img/icon/qNa_icon.png">
+                        <div class="mpbox" @click="goPopupOpen" style="margin-right: 2em; cursor: pointer">
+                            <img src="../../../resources/img/new_img/icon/qNa_icon.png" />
                             <p>내문제질문</p>
                         </div>
 
-                        <div class="mpbox" @click="goToPage2('PhotoBook')" style="cursor: pointer;">
-                            <img src="../../../resources/img/new_img/icon/photobook_icon.png">
+                        <div class="mpbox" @click="goToPage2('PhotoBook')" style="cursor: pointer">
+                            <img src="../../../resources/img/new_img/icon/photobook_icon.png" />
                             <p>포토북</p>
                         </div>
                     </div>
@@ -127,36 +160,39 @@
                     </div>
                 </div> -->
 
-
-
-                <div class="mypage" style="display:flex;height: 50%;gap: 10px;margin-top: 4em;">
-                    <div class="textbook book-green"
-                        style="background-color: white; width: 50%; height: 100%; text-align: center;">
+                <div class="mypage" style="display: flex; height: 50%; gap: 10px; margin-top: 4em">
+                    <div
+                        class="textbook book-green"
+                        style="background-color: white; width: 50%; height: 100%; text-align: center"
+                    >
                         <div class="text">
-                            <p class="title1" style="color: #fff;">오늘의 뉴스</p>
+                            <p class="title1" style="color: #fff">오늘의 뉴스</p>
                         </div>
-                        <div class="green-scroll" style="overflow: auto; height: 73%; margin: 5px;">
-                            <div style=" padding: 10px;">
+                        <div class="green-scroll" style="overflow: auto; height: 73%; margin: 5px">
+                            <div style="padding: 10px">
                                 <div v-for="(news, index) in schedules" :key="index">
-                                    <div style="display: flex;">
+                                    <div style="display: flex">
                                         <div>
                                             <img src="../../../resources/img/img16_s.png" alt="" />
                                         </div>
-                                        <p style="margin-left: 5px; font-size: 18px;">{{ name }}님이 {{ unit }}을 다 끝냈습니다.
+                                        <p style="margin-left: 5px; font-size: 18px">
+                                            {{ name }}님이 {{ unit }}을 다 끝냈습니다.
                                         </p>
                                     </div>
-                                    <hr style="margin: 10px 0;">
+                                    <hr style="margin: 10px 0" />
                                 </div>
                             </div>
                         </div>
                     </div>
 
-                    <div class="textbook book-blue"
-                        style="background-color: white; width: 50%; height: 100%; text-align: center;">
-                        <div class="text ">
-                            <p class="title1" style="color: #fff;">학습 현황</p>
+                    <div
+                        class="textbook book-blue"
+                        style="background-color: white; width: 50%; height: 100%; text-align: center"
+                    >
+                        <div class="text">
+                            <p class="title1" style="color: #fff">학습 현황</p>
                         </div>
-                        <div style="overflow: hidden; height: 75%;">
+                        <div style="overflow: hidden; height: 75%">
                             <div class="flex justify-center">
                                 <Dounutchart />
                             </div>
@@ -164,17 +200,44 @@
                     </div>
                 </div>
             </div>
-
+        </div>
+        <!-- 질문하기 팝업 -->
+        <div class="popup-wrap" v-if="this.popupOpen === true" style="z-index: 100">
+            <div class="question-popup">
+                <div class="flex justify-between align-center">
+                    <p class="question-text mt20">선생님께 질문하기</p>
+                    <img
+                        class="look-btn"
+                        @click="goPopupClose"
+                        src="../../../resources/img/btn25_93t_normal.png"
+                        alt=""
+                    />
+                </div>
+                <p style="color: #8c8c8c; font-size: 20px; margin: 40px 0px">선생님! 질문있어요!!</p>
+                <div class="memo mt25">
+                    <p class="title1 memo-text">내용</p>
+                    <textarea name="" id="" placeholder="궁금한 것을 적어보세요." v-model="question"></textarea>
+                </div>
+                <div class="questionBtn-box flex justify-end" style="gap: 15px">
+                    <button style="border-color: #eaedf4; color: #8c8c8c" @click="goPopupClose">취소하기</button>
+                    <button
+                        @click="updateQuestion"
+                        style="border-color: #6327b9; color: white; background-color: #6327b9"
+                    >
+                        질문하기
+                    </button>
+                </div>
+            </div>
         </div>
     </div>
 </template>
 
 <script>
-import axios from "axios";
-import SvgIcon from "@jamescoyle/vue-icon";
-import { mdiMagnify, mdiWindowClose } from "@mdi/js";
-import { mapActions } from "vuex";
-import { mapGetters } from "vuex";
+import axios from 'axios';
+import SvgIcon from '@jamescoyle/vue-icon';
+import { mdiMagnify, mdiWindowClose } from '@mdi/js';
+import { mapActions } from 'vuex';
+import { mapGetters } from 'vuex';
 import Dounutchart from './chDounutchart.vue';
 export default {
     data() {
@@ -184,45 +247,45 @@
             showModal: false,
             searchOpen: false,
             schedules: [],
-            stdId: "2",
+            stdId: '2',
             timeList: [
-                { label: "1교시", time: "08:00 ~ 09:00", value: "1" },
-                { label: "2교시", time: "09:00 ~ 10:00", value: "2" },
-                { label: "3교시", time: "10:00 ~ 11:00", value: "3" },
-                { label: "4교시", time: "11:00 ~ 12:00", value: "4" },
-                { label: "5교시", time: "13:00 ~ 14:00", value: "5" },
-                { label: "6교시", time: "14:00 ~ 15:00", value: "6" },
+                { label: '1교시', time: '08:00 ~ 09:00', value: '1' },
+                { label: '2교시', time: '09:00 ~ 10:00', value: '2' },
+                { label: '3교시', time: '10:00 ~ 11:00', value: '3' },
+                { label: '4교시', time: '11:00 ~ 12:00', value: '4' },
+                { label: '5교시', time: '13:00 ~ 14:00', value: '5' },
+                { label: '6교시', time: '14:00 ~ 15:00', value: '6' },
             ],
 
             aiLearningList: [],
 
             news: [],
+            popupOpen: false,
+            question: null,
         };
     },
     methods: {
-        ...mapActions(["updateSchdlId", "updateBookId", "updateUnitId"]),
+        ...mapActions(['updateSchdlId', 'updateBookId', 'updateUnitId']),
 
-        fetchNews() {
-
-        },
+        fetchNews() {},
         goToPage(page, scheduleId) {
             const startScheduleIndex = this.schedules.findIndex((schedule) => schedule.schdl_id === scheduleId);
 
             if (startScheduleIndex === -1) {
-                console.error("해당 스케줄을 찾을 수 없습니다.");
+                console.error('해당 스케줄을 찾을 수 없습니다.');
                 return;
             }
 
             const updates = [];
             const currentSchedule = this.schedules[startScheduleIndex];
-            if (currentSchedule.finish === null || currentSchedule.finish === "T") {
+            if (currentSchedule.finish === null || currentSchedule.finish === 'T') {
                 updates.push(
                     axios.post(
-                        "/schedule/scheduleUpdate.json",
-                        { scheduleId: currentSchedule.schdl_id, finish: "F" },
+                        '/schedule/scheduleUpdate.json',
+                        { scheduleId: currentSchedule.schdl_id, finish: 'F' },
                         {
                             headers: {
-                                "Content-Type": "application/json; charset=UTF-8",
+                                'Content-Type': 'application/json; charset=UTF-8',
                             },
                         }
                     )
@@ -231,14 +294,14 @@
 
             for (let i = startScheduleIndex + 1; i < this.schedules.length; i++) {
                 const nextSchedule = this.schedules[i];
-                if (nextSchedule.finish === "T") {
+                if (nextSchedule.finish === 'T') {
                     updates.push(
                         axios.post(
-                            "/schedule/scheduleUpdate.json",
-                            { scheduleId: nextSchedule.schdl_id, finish: "F" },
+                            '/schedule/scheduleUpdate.json',
+                            { scheduleId: nextSchedule.schdl_id, finish: 'F' },
                             {
                                 headers: {
-                                    "Content-Type": "application/json; charset=UTF-8",
+                                    'Content-Type': 'application/json; charset=UTF-8',
                                 },
                             }
                         )
@@ -252,7 +315,7 @@
 
                     // 대시보드 위치 저장
                     this.$store.dispatch('updateCurrentDashboard', 'Learning');
-                    
+
                     // this.$router.push({
                     //     name: page,
                     //     query: {
@@ -262,39 +325,44 @@
                     //     }
                     // });
                     // 상태 업데이트가 완료된 후 라우팅
-                    Promise.all([this.updateSchdlId(schedule.schdl_id), this.updateBookId(schedule.book_id), this.updateUnitId(schedule.unit_id)])
+                    Promise.all([
+                        this.updateSchdlId(schedule.schdl_id),
+                        this.updateBookId(schedule.book_id),
+                        this.updateUnitId(schedule.unit_id),
+                    ])
                         .then(() => {
-                            console.log("Book ID:", this.getBookId);
-                            console.log("Unit ID:", this.getUnitId);
+                            console.log('Book ID:', this.getBookId);
+                            console.log('Unit ID:', this.getUnitId);
 
                             this.$router.push({ name: page });
                         })
                         .catch((error) => {
-                            console.error("상태 업데이트 중 오류 발생:", error);
+                            console.error('상태 업데이트 중 오류 발생:', error);
                         });
                 })
                 .catch((error) => {
-                    console.error("Error updating schedules:", error);
-                    alert("학습 계획을 업데이트하는 중 오류가 발생했습니다.");
+                    console.error('Error updating schedules:', error);
+                    alert('학습 계획을 업데이트하는 중 오류가 발생했습니다.');
                 });
         },
 
         goToPage2(page, unit_id) {
             this.$store.dispatch('updateCurrentDashboard', 'AI');
             this.$router.push({
-                name: page, query: {
+                name: page,
+                query: {
                     unit_id: unit_id,
                 },
             });
         },
         showConfirm(type) {
-            let message = "";
-            if (type === "cancel") {
-                message = "삭제하시겠습니까?";
-            } else if (type === "reset") {
-                message = "초기화하시겠습니까?";
-            } else if (type === "save") {
-                message = "등록하시겠습니까?";
+            let message = '';
+            if (type === 'cancel') {
+                message = '삭제하시겠습니까?';
+            } else if (type === 'reset') {
+                message = '초기화하시겠습니까?';
+            } else if (type === 'save') {
+                message = '등록하시겠습니까?';
             }
 
             if (confirm(message)) {
@@ -313,11 +381,11 @@
         fetchSchedules() {
             axios
                 .post(
-                    "/schedule/selectSchedule.json",
+                    '/schedule/selectSchedule.json',
                     { stdId: this.stdId },
                     {
                         headers: {
-                            "Content-Type": "application/json; charset=UTF-8",
+                            'Content-Type': 'application/json; charset=UTF-8',
                         },
                     }
                 )
@@ -326,89 +394,118 @@
                         const matchingTime = this.timeList.find((time) => time.value === schedule.schdl_unit);
                         return {
                             ...schedule,
-                            schedule_time: matchingTime ? matchingTime.time : "시간 정보 없음",
+                            schedule_time: matchingTime ? matchingTime.time : '시간 정보 없음',
                         };
                     });
                     console.log(this.schedules);
                 })
                 .catch((error) => {
-                    console.error("fetchUnits - error:", error);
-                    alert("단원 목록을 불러오는 중 오류가 발생했습니다.");
+                    console.error('fetchUnits - error:', error);
+                    alert('단원 목록을 불러오는 중 오류가 발생했습니다.');
                 });
         },
         deleteSchedule(scheduleId) {
             axios
                 .post(
-                    "/schedule/scheduleDelete.json",
+                    '/schedule/scheduleDelete.json',
                     { scheduleId: scheduleId },
                     {
                         headers: {
-                            "Content-Type": "application/json; charset=UTF-8",
+                            'Content-Type': 'application/json; charset=UTF-8',
                         },
                     }
                 )
                 .then((response) => {
-                    alert("학습일정이 삭제되었습니다.");
+                    alert('학습일정이 삭제되었습니다.');
                     window.location.reload();
                 })
                 .catch((error) => {
-                    console.error("fetchUnits - error:", error);
-                    alert("단원 목록을 불러오는 중 오류가 발생했습니다.");
+                    console.error('fetchUnits - error:', error);
+                    alert('단원 목록을 불러오는 중 오류가 발생했습니다.');
                 });
         },
 
         selectAiLearning: function () {
             const vm = this;
             axios({
-                url: "/aiLearning/selectAILearning.json",
-                method: "post",
+                url: '/aiLearning/selectAILearning.json',
+                method: 'post',
                 headers: {
-                    "Content-Type": "application/json; charset=UTF-8",
+                    'Content-Type': 'application/json; charset=UTF-8',
                 },
                 data: {
-                    user_id: "USID_000000000000002"
-                }
+                    user_id: 'USID_000000000000002',
+                },
             })
                 .then(function (response) {
-                    console.log("aiLearningList - response : ", response.data);
+                    console.log('aiLearningList - response : ', response.data);
                     vm.aiLearningList = response.data;
                 })
                 .catch(function (error) {
-                    console.log("aiLearningList - error : ", error);
-                    alert("ai learning 조회에 오류가 발생했습니다.");
+                    console.log('aiLearningList - error : ', error);
+                    alert('ai learning 조회에 오류가 발생했습니다.');
                 });
         },
 
         recommendLearning() {
             axios({
-                url: "http://165.229.169.32:35716/recommend_and_insert",
-                method: "post",
+                url: 'http://165.229.169.32:35716/recommend_and_insert',
+                method: 'post',
                 headers: {
-                    "Content-Type": "application/json; charset=UTF-8",
+                    'Content-Type': 'application/json; charset=UTF-8',
                 },
                 data: {
-                    "top_n": 11,
-                    "user_id": "USID_000000000000002"
+                    top_n: 11,
+                    user_id: 'USID_000000000000002',
                 },
             })
-            .then((response) => {
-                console.log("recommendLearning list - response : ", response.data);
-            })
-            .catch((err) => {
-                console.log("추천 에러: ", err);
-            });
+                .then((response) => {
+                    console.log('recommendLearning list - response : ', response.data);
+                })
+                .catch((err) => {
+                    console.log('추천 에러: ', err);
+                });
+        },
+        // 질문 업데이트 메서드
+        updateQuestion() {
+            if (this.question === null) {
+                alert('질문을 입력해주세요');
+                return;
+            }
+            axios
+                .post('/studentInfo/updateQuestion.json', {
+                    userId: this.userId,
+                    // userId: 'USID_000000000000002',
+                    studentQuestion: this.question,
+                })
+                .then((response) => {
+                    console.log('질문이 성공적으로 업데이트되었습니다.');
+                    alert('질문이 성공적으로 업데이트되었습니다.');
+                })
+                .catch((error) => {
+                    console.error('질문 업데이트 실패:', error);
+                    alert('질문 업데이트에 실패했습니다.');
+                });
+            this.question = null;
+        },
+        goPopupOpen() {
+            this.popupOpen = true;
+        },
+        goPopupClose() {
+            this.popupOpen = false;
+            this.question = null;
         },
     },
     watch: {},
     computed: {
-        ...mapGetters(["getBookId", "getUnitId"]),
+        ...mapGetters(['getBookId', 'getUnitId']),
     },
     components: {
         SvgIcon,
         Dounutchart: Dounutchart,
     },
     mounted() {
-        console.log("Main2 mounted");
+        console.log('Main2 mounted');
         this.fetchSchedules();
         this.selectAiLearning();
     },
@@ -426,7 +523,7 @@
 }
 
 .mypgBack {
-    background-image: url("../../../resources/img/new_img/plan/background.png");
+    background-image: url('../../../resources/img/new_img/plan/background.png');
 }
 
 .mpcontainer {
@@ -455,4 +552,43 @@
     font-size: 16px;
     font-family: 'ONEMobilePOPOTF';
 }
+
+.question-popup {
+    background-color: white;
+    border-radius: 10px;
+    padding: 30px 40px;
+    position: absolute;
+    top: 15%;
+    left: 25%;
+    width: 100rem;
+}
+
+.question-text {
+    font-family: 'ONEMobilePOPOTF';
+    font-size: 32px;
+    color: #6327b9;
+}
+
+.memo-text {
+    font-family: 'ONEMobilePOPOTF';
+    color: #6327b9;
+}
+
+.memo textarea {
+    border: 2px solid #cac0e3;
+    border-radius: 10px;
+    width: 100%;
+    padding: 20px;
+    height: 30rem;
+    margin: 20px 0px 40px;
+}
+
+.questionBtn-box button {
+    font-size: 18px;
+    padding: 8px 30px;
+    border: 2px solid;
+    border-radius: 8px;
+    font-weight: bold;
+    font-family: 'ONEMobileOTF-Regular';
+}
 </style>
Add a comment
List