feat(color): 칼라값 적용

Nexters · Oct 16, 2021 · 0966820 · 0966820
1 parent bd571d2
commit 0966820
Show file tree

Hide file tree

Showing 18 changed files with 116 additions and 83 deletions.
diff --git a/components/about/activity/card.vue b/components/about/activity/card.vue
@@ -81,7 +81,7 @@ export default ActivityCard;
         line-height: 48px;
         letter-spacing: -0.02em;
 
-        color: #ffffff;
+        color: $white;
       }
       .title {
         margin-top: auto;
@@ -90,7 +90,7 @@ export default ActivityCard;
         font-size: 18px;
         line-height: 27px;
         letter-spacing: -0.02em;
-        color: #ffffff;
+        color: $white;
       }
     }
   }
@@ -114,7 +114,7 @@ export default ActivityCard;
         line-height: 36px;
         letter-spacing: -0.02em;
 
-        color: #ffffff;
+        color: $white;
       }
       .title {
         margin-top: auto;
@@ -123,7 +123,7 @@ export default ActivityCard;
         font-size: 14px;
         line-height: 21px;
         letter-spacing: -0.02em;
-        color: #ffffff;
+        color: $white;
       }
     }
   }

diff --git a/components/about/info/card.vue b/components/about/info/card.vue
@@ -23,6 +23,8 @@ export default InfoCard;
 
 <style lang="scss" scoped>
 @import "~/assets/css/_device.scss";
+@import "~/assets/css/setting.scss";
+
 * {
   font-family: Spoqa Han Sans Neo;
 }
@@ -31,7 +33,7 @@ export default InfoCard;
     border-radius: 16px;
     width: 368px;
     height: 233px;
-    background: #f6f6f6;
+    background: $grey01;
     .contents {
       padding: 32px;
       .title {
@@ -56,7 +58,7 @@ export default InfoCard;
         line-height: 27px;
         letter-spacing: -0.02em;
 
-        color: #777777;
+        color: $grey03;
       }
     }
   }
@@ -67,7 +69,7 @@ export default InfoCard;
     border-radius: 16px;
     width: 368px;
     height: 233px;
-    background: #f6f6f6;
+    background: $grey01;
     .contents {
       padding: 32px;
       .title {
@@ -92,7 +94,7 @@ export default InfoCard;
         line-height: 27px;
         letter-spacing: -0.02em;
 
-        color: #777777;
+        color: $grey03;
       }
     }
   }
@@ -103,7 +105,7 @@ export default InfoCard;
     border-radius: 16px;
     width: 240px;
     height: 149px;
-    background: #f6f6f6;
+    background: $grey01;
     .contents {
       padding: 24px;
       .title {
@@ -128,7 +130,7 @@ export default InfoCard;
         line-height: 21px;
         letter-spacing: -0.02em;
 
-        color: #777777;
+        color: $grey03;
       }
     }
   }

diff --git a/components/about/review/card.vue b/components/about/review/card.vue
@@ -36,6 +36,8 @@ export default ReviewCard;
 
 <style lang="scss" scoped>
 @import "~/assets/css/_device.scss";
+@import "~/assets/css/setting.scss";
+
 * {
   font-family: Spoqa Han Sans Neo;
 }
@@ -45,7 +47,7 @@ export default ReviewCard;
     border-radius: 16px;
     width: 384px;
     height: 192px;
-    background: #f6f6f6;
+    background: $grey01;
     .contents {
       padding: 24px;
       height: calc(100% - 48px);
@@ -67,7 +69,7 @@ export default ReviewCard;
 
         letter-spacing: -0.02em;
 
-        color: #5236ff;
+        color: $primary;
       }
       .title {
         font-style: normal;
@@ -76,7 +78,7 @@ export default ReviewCard;
         line-height: 36px;
         letter-spacing: -0.02em;
 
-        color: #000000;
+        color: $black;
       }
       .author {
         margin-top: auto;
@@ -85,7 +87,7 @@ export default ReviewCard;
         font-size: 18px;
         line-height: 27px;
         letter-spacing: -0.02em;
-        color: #777777;
+        color: $grey03;
       }
     }
   }
@@ -96,7 +98,7 @@ export default ReviewCard;
     border-radius: 16px;
     width: calc(50% - 12px);
     height: 192px;
-    background: #f6f6f6;
+    background: $grey01;
     .contents {
       padding: 24px;
       height: calc(100% - 48px);
@@ -118,7 +120,7 @@ export default ReviewCard;
 
         letter-spacing: -0.02em;
 
-        color: #5236ff;
+        color: $primary;
       }
       .title {
         width: 296.5px;
@@ -136,7 +138,7 @@ export default ReviewCard;
         line-height: 36px;
         letter-spacing: -0.02em;
 
-        color: #000000;
+        color: $black;
       }
       .author {
         margin-top: auto;
@@ -145,7 +147,7 @@ export default ReviewCard;
         font-size: 18px;
         line-height: 27px;
         letter-spacing: -0.02em;
-        color: #777777;
+        color: $grey03;
       }
     }
   }
@@ -156,7 +158,7 @@ export default ReviewCard;
     border-radius: 8px;
     width: 100%;
     height: 149px;
-    background: #f6f6f6;
+    background: $grey01;
     .contents {
       padding: 24px;
       height: calc(100% - 48px);
@@ -177,7 +179,7 @@ export default ReviewCard;
 
         letter-spacing: -0.02em;
 
-        color: #5236ff;
+        color: $primary;
       }
       .title {
         width: 100%;
@@ -195,7 +197,7 @@ export default ReviewCard;
         line-height: 24px;
         letter-spacing: -0.02em;
 
-        color: #000000;
+        color: $black;
       }
       .author {
         margin-top: auto;
@@ -204,7 +206,7 @@ export default ReviewCard;
         font-size: 14px;
         line-height: 21px;
         letter-spacing: -0.02em;
-        color: #777777;
+        color: $grey03;
       }
     }
   }

diff --git a/components/contact/contactBox.vue b/components/contact/contactBox.vue
@@ -48,6 +48,8 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 @import "~/assets/css/_device.scss";
+@import "~/assets/css/setting.scss";
+
 * {
   font-family: Spoqa Han Sans Neo;
 }
@@ -57,7 +59,7 @@ export default defineComponent({
   display: flex;
   flex-direction: row;
   font-weight: 700;
-  background-color: #f6f6f6;
+  background-color: $grey01;
   border-radius: 16px;
   justify-content: space-between;
   box-sizing: border-box;
@@ -67,7 +69,7 @@ export default defineComponent({
   }
 
   .text {
-    color: #777777;
+    color: $grey03;
   }
 }
 

diff --git a/components/contact/faqBox.vue b/components/contact/faqBox.vue
@@ -47,12 +47,13 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 @import "~/assets/css/_device.scss";
+@import "~/assets/css/setting.scss";
 
 .faqBox {
   width: 100%;
   display: flex;
   flex-direction: column;
-  background-color: #f6f6f6;
+  background-color: $grey01;
   box-sizing: border-box;
   border-radius: 16px;
 

diff --git a/components/header.vue b/components/header.vue
@@ -73,6 +73,8 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 @import "~/assets/css/_device.scss";
+@import "~/assets/css/setting.scss";
+
 * {
   font-family: Spoqa Han Sans Neo;
 }
@@ -180,11 +182,11 @@ nav {
     font-weight: bold;
     line-height: 36px;
     letter-spacing: -0.02em;
-    color: #000000;
+    color: $black;
     text-decoration: none;
   }
   .white-font {
-    color: #ffffff;
+    color: $white;
   }
 }
 
@@ -205,7 +207,7 @@ nav {
 @include mobile {
   a.nuxt-link-active {
     text-decoration: none;
-    color: #777777 !important;
+    color: $grey03 !important;
   }
 }
 </style>