From fcc0eb3c37efbb7463ffeeef8e6841f87c134356 Mon Sep 17 00:00:00 2001 From: JinJeongMin Date: Fri, 5 Jan 2024 17:32:49 +0900 Subject: [PATCH] fix: scss @use as * --- .../GlobalNavigationBar.module.scss | 2 +- src/components/Review/Review.module.scss | 16 +++++++-------- .../BottomFixedBtn/BottomFixedBtn.module.scss | 9 +++++---- .../BasicInformation.module.scss | 8 ++++---- .../Others/OtherCard/OtherCard.module.scss | 16 +++++++-------- .../Information/Others/Others.module.scss | 6 +++--- .../ShortReveiws/ShortReviews.module.scss | 20 +++++++++---------- src/pages/Detail/Main/Title/Title.module.scss | 16 +++++++-------- 8 files changed, 47 insertions(+), 46 deletions(-) diff --git a/src/components/GlobalNavigationBar/GlobalNavigationBar.module.scss b/src/components/GlobalNavigationBar/GlobalNavigationBar.module.scss index acfa8208..7599d84b 100644 --- a/src/components/GlobalNavigationBar/GlobalNavigationBar.module.scss +++ b/src/components/GlobalNavigationBar/GlobalNavigationBar.module.scss @@ -1,4 +1,4 @@ -@use "@/sass"; +@use "@/sass" as *; .container { position: fixed; diff --git a/src/components/Review/Review.module.scss b/src/components/Review/Review.module.scss index f958465f..7b74f1d8 100644 --- a/src/components/Review/Review.module.scss +++ b/src/components/Review/Review.module.scss @@ -1,10 +1,10 @@ -@use "@/sass"; +@use "@/sass" as *; .container { display: flex; gap: 8px; padding: 24px 20px; - border-bottom: 1px solid sass.$neutral100; + border-bottom: 1px solid $neutral100; &__contentsBox { width: 100%; @@ -14,7 +14,7 @@ gap: 4px; &__name { - @include sass.typography(button); + @include typography(button); } &__secondItems { @@ -24,23 +24,23 @@ &__star { display: inline; font-size: 1.6rem; - color: sass.$etc0; + color: $etc0; } &__point { margin-left: 2px; - @include sass.typography(captionSmall); + @include typography(captionSmall); } &__visitedAt { margin-left: 9px; - color: sass.$primary300; - @include sass.typography(captionSmall); + color: $primary300; + @include typography(captionSmall); } } &__content { - @include sass.typography(bodySmall); + @include typography(bodySmall); text-overflow: ellipsis; } } diff --git a/src/pages/Detail/BottomFixedBtn/BottomFixedBtn.module.scss b/src/pages/Detail/BottomFixedBtn/BottomFixedBtn.module.scss index 905e6602..a4281556 100644 --- a/src/pages/Detail/BottomFixedBtn/BottomFixedBtn.module.scss +++ b/src/pages/Detail/BottomFixedBtn/BottomFixedBtn.module.scss @@ -1,4 +1,5 @@ -@use "@/sass"; +@use "@/sass" as *; + .container { position: fixed; bottom: 24px; @@ -13,7 +14,7 @@ align-items: center; width: 100%; - height: 48px; + height: 4.8rem; border-radius: 1.6rem; @@ -22,8 +23,8 @@ cursor: pointer; span { - color: sass.$neutral0; - @include sass.typography(button); + color: $neutral0; + @include typography(button); } } } diff --git a/src/pages/Detail/Contents/Information/BasicInformation/BasicInformation.module.scss b/src/pages/Detail/Contents/Information/BasicInformation/BasicInformation.module.scss index 127a43ab..a14eac08 100644 --- a/src/pages/Detail/Contents/Information/BasicInformation/BasicInformation.module.scss +++ b/src/pages/Detail/Contents/Information/BasicInformation/BasicInformation.module.scss @@ -1,16 +1,16 @@ -@use "@/sass"; +@use "@/sass" as *; .container { margin: 20px 0; padding-bottom: 40px; - border-bottom: 12px solid sass.$neutral100; + border-bottom: 12px solid $neutral100; &__title { padding: 8px 20px; margin-bottom: 16px; - @include sass.typography(titleMedium); + @include typography(titleMedium); } &__contents { @@ -26,7 +26,7 @@ align-items: center; gap: 12px; - @include sass.typography(tabLabel); + @include typography(tabLabel); a { text-decoration-line: underline; diff --git a/src/pages/Detail/Contents/Information/Others/OtherCard/OtherCard.module.scss b/src/pages/Detail/Contents/Information/Others/OtherCard/OtherCard.module.scss index 41a893c5..b1084abf 100644 --- a/src/pages/Detail/Contents/Information/Others/OtherCard/OtherCard.module.scss +++ b/src/pages/Detail/Contents/Information/Others/OtherCard/OtherCard.module.scss @@ -1,4 +1,4 @@ -@use "@/sass"; +@use "@/sass" as *; .container { display: flex; @@ -15,12 +15,12 @@ &__contents { h4 { - @include sass.typography(titleSmall); + @include typography(titleSmall); } p { - color: sass.$neutral400; - @include sass.typography(captionSmall); + color: $neutral400; + @include typography(captionSmall); } &__reviews { @@ -30,18 +30,18 @@ &__star { display: inline; font-size: 1.6rem; - color: sass.$etc0; + color: $etc0; } &__point { color: #1d2433; - @include sass.typography(captionSmall); + @include typography(captionSmall); margin-right: 4px; } &__reviewsCount { - color: sass.$neutral400; - @include sass.typography(captionSmall); + color: $neutral400; + @include typography(captionSmall); } } } diff --git a/src/pages/Detail/Contents/Information/Others/Others.module.scss b/src/pages/Detail/Contents/Information/Others/Others.module.scss index 8b314948..c425064f 100644 --- a/src/pages/Detail/Contents/Information/Others/Others.module.scss +++ b/src/pages/Detail/Contents/Information/Others/Others.module.scss @@ -1,4 +1,4 @@ -@use "@/sass"; +@use "@/sass" as *; .container { padding: 40px 0; @@ -7,7 +7,7 @@ padding: 8px 20px; h3 { - @include sass.typography(titleMedium); + @include typography(titleMedium); } } @@ -21,7 +21,7 @@ position: absolute; top: 50%; left: 10px; - transform: translate(-10px, -50%); + transform: translate(10px, -50%); width: 2.4rem; height: 2.4rem; diff --git a/src/pages/Detail/Contents/Information/ShortReveiws/ShortReviews.module.scss b/src/pages/Detail/Contents/Information/ShortReveiws/ShortReviews.module.scss index b12bd180..14302691 100644 --- a/src/pages/Detail/Contents/Information/ShortReveiws/ShortReviews.module.scss +++ b/src/pages/Detail/Contents/Information/ShortReveiws/ShortReviews.module.scss @@ -1,8 +1,8 @@ -@use "@/sass"; +@use "@/sass" as *; .container { padding: 40px 0; - border-bottom: 12px solid sass.$neutral100; + border-bottom: 12px solid $neutral100; &__title { padding: 8px 20px; @@ -12,7 +12,7 @@ justify-content: space-between; h3 { - @include sass.typography(titleMedium); + @include typography(titleMedium); } &__rightBox { @@ -20,7 +20,7 @@ cursor: pointer; span { - @include sass.typography(tabLabel); + @include typography(tabLabel); } } } @@ -36,17 +36,17 @@ &__star { display: inline; font-size: 3.2rem; - color: sass.$etc0; + color: $etc0; } &__point { color: #1d2433; - @include sass.typography(headline); + @include typography(headline); } &__reviewsCount { - color: sass.$neutral400; - @include sass.typography(tabLabel); + color: $neutral400; + @include typography(tabLabel); } } @@ -59,7 +59,7 @@ margin: 0 20px; - border: 1px solid sass.$neutral300; + border: 1px solid $neutral300; border-radius: 8px; display: flex; @@ -69,7 +69,7 @@ cursor: pointer; span { - @include sass.typography(button); + @include typography(button); } } } diff --git a/src/pages/Detail/Main/Title/Title.module.scss b/src/pages/Detail/Main/Title/Title.module.scss index 32fdb895..12fd17a6 100644 --- a/src/pages/Detail/Main/Title/Title.module.scss +++ b/src/pages/Detail/Main/Title/Title.module.scss @@ -1,4 +1,4 @@ -@use "@/sass"; +@use "@/sass" as *; .container { width: 100%; @@ -6,11 +6,11 @@ position: relative; &__header { - @include sass.typography(titleLarge); + @include typography(titleLarge); } &__category { - color: sass.$neutral400; - @include sass.typography(captionSmall); + color: $neutral400; + @include typography(captionSmall); margin: 4px 0; } @@ -22,17 +22,17 @@ &__star { display: inline; font-size: 1.6rem; - color: sass.$etc0; + color: $etc0; } &__point { color: #1d2433; - @include sass.typography(captionMedium); + @include typography(captionMedium); } &__reviewsCount { - color: sass.$neutral400; - @include sass.typography(captionSmall); + color: $neutral400; + @include typography(captionSmall); } }