Commit @bc3d425e8bcb9fa89ba7ea1f217d484a0af922c0

이은진 2024-08-14

240814 이은진 학습일정 css 수정

@bc3d425e8bcb9fa89ba7ea1f217d484a0af922c0

9b55cd7

bc3d425

client/views/pages/main/MyPlan.vue

--- client/views/pages/main/MyPlan.vue

+++ client/views/pages/main/MyPlan.vue


                 <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><img src="../../../resources/img/img217_22s.png" alt=""></div>
-                        <div class="wrap cs-pt" :class="{ 'cs-pt-clicked': isClicked }" style="width: 100%;">
+                        <div class="wrap cs-pt planBox" :class="{ 'cs-pt-clicked': isClicked }" style="width: 100%;">
                             <div class="text-lf flex justify-between align-center">
                                 <div>
-                                    <p class="title2">grade 3</p>
-                                    <div class="flex align-center mb10" style="gap: 10px;">
+                                    <p class="title2" s>grade 3</p>
+                                    <div class="flex align-center mb10" style="gap: 10px; margin-top: 1.5em;">
                                         <p class="title2"><em class="gray-bd">{{ schedule.schdl_unit }}교시</em></p>
                                         <p class="title1">{{ schedule.schedule_time }}</p>
                                     </div>

                                     @click="goToPage('Dashboard', schedule.schdl_id)">
                                     바로가기
                                 </button>
-                                <div><img src="../../../resources/img/img214_19s.png" alt=""></div>
-                                <button type="button" class="popup-close-btn" @click="deleteSchedule(schedule.schdl_id)">
+                                <div><img src="../../../resources/img/img214_19s.png" alt=""
+                                        style="height: 130px; width: 100px; "></div>
+                                <button type="button" class="popup-close-btn"
+                                    @click="deleteSchedule(schedule.schdl_id)">
                                     <svg-icon type="mdi" :path="mdiWindowClose" class="close-btn"></svg-icon>
                                 </button>
                             </div>

             <div class="wrap mt30">
                 <p class="title1 mb20"> AI 맞춤형 학습 코스는 어떨까요?</p>
                 <div class="imgGroup flex justify-between">
-                    <div class="text-lf" @click="goToPage('AIDashboard')">
+                    <div class="text-lf aiClick" @click="goToPage2('AIDashboard')">
                         <img src="../../../resources/img/img215_22s.png" alt="">
                         <p class="title2 mt10">추천 학습 단원</p>
                     </div>
-                    <div class="text-lf">
+                    <div class="text-lf aiClick" @click="goToPage2('AIDashboard')">
                         <img src="../../../resources/img/img215_22s.png" alt="">
                         <p class="title2 mt10">추천 학습 단원</p>
                     </div>
-                    <div class="text-lf">
+                    <div class="text-lf aiClick" @click="goToPage2('AIDashboard')">
                         <img src="../../../resources/img/img215_22s.png" alt="">
                         <p class="title2 mt10">추천 학습 단원</p>
                     </div>

                 }
             })
                 .then(response => {
-                    this.schedules = response.data.map(schedule => { 
+                    this.schedules = response.data.map(schedule => {
                         const matchingTime = this.timeList.find(time => time.value === schedule.schdl_unit);
                         return {
                             ...schedule,

                     console.error("fetchUnits - error:", error);
                     alert("단원 목록을 불러오는 중 오류가 발생했습니다.");
                 });
-        }, deleteSchedule(scheduleId){
+        }, deleteSchedule(scheduleId) {
             axios.post("/schedule/scheduleDelete.json", { scheduleId: scheduleId }, {
                 headers: {
                     "Content-Type": "application/json; charset=UTF-8",

         this.fetchSchedules();
     }
 }
-</script>
+</script>
+<style>
+.planBox {
+    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 20px, rgba(0, 0, 0, 0.096) 0px 6px 6px;
+    border: none;
+    margin: 0px 0px 20px;
+}
+
+.aiClick {
+    cursor: pointer;
+}
+</style>

Add a comment

Open 0
Closed 0

List

...	...	@@ -11,11 +11,11 @@
11	11	<div class="flex-column" style="gap: 20px;" v-else v-for="(schedule, index) in schedules" :key="index">
12	12	<div class="flex justify-between align-center" style="gap: 70px;">
13	13	<div><img src="../../../resources/img/img217_22s.png" alt=""></div>
14		- <div class="wrap cs-pt" :class="{ 'cs-pt-clicked': isClicked }" style="width: 100%;">
	14	+ <div class="wrap cs-pt planBox" :class="{ 'cs-pt-clicked': isClicked }" style="width: 100%;">
15	15	<div class="text-lf flex justify-between align-center">
16	16	<div>
17		- <p class="title2">grade 3</p>
18		- <div class="flex align-center mb10" style="gap: 10px;">
	17	+ <p class="title2" s>grade 3</p>
	18	+ <div class="flex align-center mb10" style="gap: 10px; margin-top: 1.5em;">
19	19	<p class="title2"><em class="gray-bd">{{ schedule.schdl_unit }}교시</em></p>
20	20	<p class="title1">{{ schedule.schedule_time }}</p>
21	21	</div>
...	...	@@ -33,8 +33,10 @@
33	33	@click="goToPage('Dashboard', schedule.schdl_id)">
34	34	바로가기
35	35	</button>
36		- <div><img src="../../../resources/img/img214_19s.png" alt=""></div>
37		- <button type="button" class="popup-close-btn" @click="deleteSchedule(schedule.schdl_id)">
	36	+ <div><img src="../../../resources/img/img214_19s.png" alt=""
	37	+ style="height: 130px; width: 100px; "></div>
	38	+ <button type="button" class="popup-close-btn"
	39	+ @click="deleteSchedule(schedule.schdl_id)">
38	40	<svg-icon type="mdi" :path="mdiWindowClose" class="close-btn"></svg-icon>
39	41	</button>
40	42	</div>
...	...	@@ -57,15 +59,15 @@
57	59	<div class="wrap mt30">
58	60	<p class="title1 mb20"> AI 맞춤형 학습 코스는 어떨까요?</p>
59	61	<div class="imgGroup flex justify-between">
60		- <div class="text-lf" @click="goToPage('AIDashboard')">
	62	+ <div class="text-lf aiClick" @click="goToPage2('AIDashboard')">
61	63	<img src="../../../resources/img/img215_22s.png" alt="">
62	64	<p class="title2 mt10">추천 학습 단원</p>
63	65	</div>
64		- <div class="text-lf">
	66	+ <div class="text-lf aiClick" @click="goToPage2('AIDashboard')">
65	67	<img src="../../../resources/img/img215_22s.png" alt="">
66	68	<p class="title2 mt10">추천 학습 단원</p>
67	69	</div>
68		- <div class="text-lf">
	70	+ <div class="text-lf aiClick" @click="goToPage2('AIDashboard')">
69	71	<img src="../../../resources/img/img215_22s.png" alt="">
70	72	<p class="title2 mt10">추천 학습 단원</p>
71	73	</div>
...	...	@@ -177,7 +179,7 @@
177	179	}
178	180	})
179	181	.then(response => {
180		- this.schedules = response.data.map(schedule => {
	182	+ this.schedules = response.data.map(schedule => {
181	183	const matchingTime = this.timeList.find(time => time.value === schedule.schdl_unit);
182	184	return {
183	185	...schedule,
...	...	@@ -190,7 +192,7 @@
190	192	console.error("fetchUnits - error:", error);
191	193	alert("단원 목록을 불러오는 중 오류가 발생했습니다.");
192	194	});
193		- }, deleteSchedule(scheduleId){
	195	+ }, deleteSchedule(scheduleId) {
194	196	axios.post("/schedule/scheduleDelete.json", { scheduleId: scheduleId }, {
195	197	headers: {
196	198	"Content-Type": "application/json; charset=UTF-8",
...	...	@@ -220,4 +222,15 @@
220	222	this.fetchSchedules();
221	223	}
222	224	}
223		-</script> (No newline at end of file)
	225	+</script>
	226	+<style>
	227	+.planBox {
	228	+ box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 20px, rgba(0, 0, 0, 0.096) 0px 6px 6px;
	229	+ border: none;
	230	+ margin: 0px 0px 20px;
	231	+}
	232	+
	233	+.aiClick {
	234	+ cursor: pointer;
	235	+}
	236	+</style> (No newline at end of file)

Delete comment