Merge pull request #108 from study2895:main

[Design] 페이지 전체적인 디자인 수정
CSID-DGU · Dec 11, 2024 · 1e7aedb · 1e7aedb
2 parents 00fd471 + 1596b7c
commit 1e7aedb
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 19 deletions.
diff --git a/src/views/calendar/CalendarMainView.vue b/src/views/calendar/CalendarMainView.vue
@@ -352,15 +352,15 @@ onUnmounted(() => {
   background-color: #ff7f00;
   color: white;
   padding: 0.5rem;
-  border-radius: 0.25rem;
+  border-radius: 0.65rem;
   font-weight: bold;
   font-size: 0.875rem;
   width: 2rem;
   height: 2rem;
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-right: 1.25rem; /* Updated margin-right value */
+  margin-right: 1.25rem;
   flex-shrink: 0;
 }
 
@@ -371,6 +371,7 @@ onUnmounted(() => {
 .event-title {
   font-weight: bold;
   margin-bottom: 0.25rem;
+  font-size: 0.9rem;
 }
 
 .event-date {
@@ -463,9 +464,9 @@ onUnmounted(() => {
   right: 0;
   background-color: #ffffff;
   border-radius: 1.5rem 1.5rem 0 0;
-  padding: 1.5rem;
+  padding: 2rem 1.5rem 1.5rem; /* padding-top 값을 2rem으로 설정 */
   overflow-y: auto;
-  max-height: calc(100vh - 150px);
+  max-height: calc(100vh - 120px);
   width: 100%;
   max-width: 395px;
   margin: 0 auto;

diff --git a/src/views/login/mypage/MypageView.vue b/src/views/login/mypage/MypageView.vue
@@ -527,11 +527,13 @@ const saveProfile = () => {
 }
 
 .goals-title {
-  left: 20px; /* 왼쪽 여백 증가 */
+  font-size: 14px;
+  /* 왼쪽 여백 증가 */
 }
 
 .expand-button {
-  right: 20px; /* 오른쪽 여백 증가 */
+  font-size: 14px;
+  /* 오른쪽 여백 증가 */
 }
 
 .goal-content {

diff --git a/src/views/mainpage/MainpageView.vue b/src/views/mainpage/MainpageView.vue
@@ -40,7 +40,7 @@
         <!-- 할 일 표시 -->
         <div
           class="task-container"
-          style="font-family: 'NaR'; letter-spacing: 0.4px"
+          style="font-family: 'NaR'; letter-spacing: 0.5px"
         >
           <div class="task-row">
             <div
@@ -223,7 +223,7 @@ onMounted(() => {
 .page-container {
   min-height: 100vh;
   background-color: #fff9f2;
-  font-family: 'NanumSquareRound', sans-serif;
+  font-family: 'NaR', sans-serif;
   display: flex;
   justify-content: center;
   overflow-x: hidden;
@@ -243,7 +243,7 @@ onMounted(() => {
   display: flex;
   flex-direction: column;
   padding: 6rem 1.5rem 6rem;
-  font-family: 'NanumSquareRound', sans-serif;
+  font-family: 'NaR', sans-serif;
 }
 
 .main-content .title {
@@ -277,41 +277,47 @@ onMounted(() => {
 }
 
 .task-container {
-  margin-top: -80px;
+  margin-top: -70px;
   margin-bottom: 3rem;
   display: flex;
+
   flex-direction: column;
   align-items: center;
-  gap: 0.75rem;
+  gap: 0.5rem;
 }
 
 .task-container .task-row {
   display: flex;
-  gap: 0.75rem;
+  gap: 0.5rem;
   width: 100%;
+  justify-content: center;
   max-width: 290px;
 }
 
 .task-container .task-row .task {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  flex: 1;
-  height: 40px;
-  padding: 0 1rem;
+  flex: 0 0 45%;
+  height: 36px;
+  padding: 0 0.75rem;
   background-color: white;
   border-radius: 17px;
+  max-width: 140px;
 }
 
 .task-container .task-row .task span {
   font-size: 0.875rem;
-  font-family: 'NanumSquareRound', sans-serif;
+  font-family: 'NaR', sans-serif;
   color: var(--task-color, #b3b3b3);
+  margin: 0;
+  padding: 0;
 }
 
 .task-container .task-row .task img {
   width: 20px;
   height: 20px;
+  justify-content: center;
   filter: var(--task-filter, grayscale(100%));
 }
 
@@ -336,16 +342,16 @@ onMounted(() => {
 }
 
 .ako-image-container .ako-status-text {
-  font-size: 1.1rem;
+  font-size: 1rem;
   color: #000000;
-  font-family: 'NanumSquareRound', sans-serif;
+  font-family: 'NaR', sans-serif;
   letter-spacing: 1px;
   font-weight: medium;
 }
 
 .ako-image-container .ako-image {
   width: 256px;
-  height: 256px;
+  height: 200px;
   margin: 0 auto;
 }