fix(contact): contact 디자인 이슈 수정

Nexters · Oct 24, 2021 · c9e2918 · c9e2918
1 parent 1fbab19
commit c9e2918
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 10 deletions.
diff --git a/assets/img/arrow_down.svg b/assets/img/arrow_down.svg
diff --git a/assets/img/arrow_up.svg b/assets/img/arrow_up.svg
diff --git a/components/contact/contactBox.vue b/components/contact/contactBox.vue
@@ -64,7 +64,6 @@ export default defineComponent({
   flex-direction: row;
   font-weight: 700;
   background-color: $grey01;
-  border-radius: 16px;
   justify-content: space-between;
   box-sizing: border-box;
 
@@ -85,6 +84,7 @@ export default defineComponent({
     font-size: 24px;
     line-height: 36px;
     padding: 32px;
+    border-radius: 16px;
 
     .iconText {
       margin-left: 16px;
@@ -106,6 +106,7 @@ export default defineComponent({
     font-size: 24px;
     line-height: 36px;
     padding: 32px;
+    border-radius: 16px;
 
     .text {
       font-size: 18px;
@@ -123,6 +124,7 @@ export default defineComponent({
     font-size: 24px;
     line-height: 36px;
     padding: 32px;
+    border-radius: 16px;
 
     .iconText {
       margin-left: 16px;
@@ -140,6 +142,7 @@ export default defineComponent({
     font-size: 16px;
     line-height: 24px;
     padding: 24px;
+    border-radius: 8px;
 
     .iconText {
       margin-left: 8px;
@@ -157,6 +160,7 @@ export default defineComponent({
     font-size: 16px;
     line-height: 24px;
     padding: 24px;
+    border-radius: 8px;
 
     .iconText {
       margin-left: 8px;

diff --git a/components/contact/faqBox.vue b/components/contact/faqBox.vue
@@ -72,6 +72,10 @@ export default defineComponent({
     font-weight: 400;
     white-space: pre-wrap;
   }
+
+  .icon {
+    align-self: center;
+  }
 }
 
 @include d-c3 {
@@ -87,7 +91,13 @@ export default defineComponent({
   .answerArea {
     font-size: 18px;
     line-height: 27px;
-    margin-top: 16px;
+    margin-top: 24px;
+  }
+
+  .icon {
+    width: 24px;
+    height: 24px;
+    margin-left: 24px;
   }
 }
 
@@ -104,7 +114,13 @@ export default defineComponent({
   .answerArea {
     font-size: 18px;
     line-height: 27px;
-    margin-top: 16px;
+    margin-top: 24px;
+  }
+
+  .icon {
+    width: 24px;
+    height: 24px;
+    margin-left: 24px;
   }
 }
 
@@ -121,7 +137,13 @@ export default defineComponent({
   .answerArea {
     font-size: 18px;
     line-height: 27px;
-    margin-top: 16px;
+    margin-top: 24px;
+  }
+
+  .icon {
+    width: 24px;
+    height: 24px;
+    margin-left: 24px;
   }
 }
 
@@ -138,7 +160,13 @@ export default defineComponent({
   .answerArea {
     font-size: 14px;
     line-height: 21px;
-    margin-top: 8px;
+    margin-top: 16px;
+  }
+
+  .icon {
+    width: 16px;
+    height: 16px;
+    margin-left: 16px;
   }
 }
 
@@ -155,7 +183,13 @@ export default defineComponent({
   .answerArea {
     font-size: 14px;
     line-height: 21px;
-    margin-top: 8px;
+    margin-top: 16px;
+  }
+
+  .icon {
+    width: 16px;
+    height: 16px;
+    margin-left: 16px;
   }
 }
 </style>