fix. [SWV-826] TOP 버튼 배경 컬러 관리

layers/components/blocks/Button/ScrollTop.vue

@@ -1,5 +1,11 @@
 <script setup lang="ts">
-import type { TrackingObject } from '#layers/types/api/common'
+import type { ColorObject, TrackingObject } from '#layers/types/api/common'
+
+interface Props {
+  color: ColorObject
+}
+
+const props = defineProps<Props>()
 
 const { locale } = useI18n()
 const { y: windowY } = useWindowScroll({ behavior: 'smooth' })
@@ -12,6 +18,9 @@ const analytics = {
 } as TrackingObject
 
 const showBtn = computed(() => windowY.value > 0)
+const backgroundColor = computed(() =>
+  getColorCodeFromData(props.color, 'none')
+)
 
 const handleScrollToTop = () => {
   windowY.value = 0
@@ -25,6 +34,7 @@ const handleScrollToTop = () => {
       v-show="showBtn"
       class="btn-top"
       sr-only="top"
+      :style="{ backgroundColor: backgroundColor }"
       @click="handleScrollToTop"
     >
       <AtomsIconsArrowControlTopLine />
@@ -39,4 +49,7 @@ const handleScrollToTop = () => {
 .btn-top:hover :deep(.icon) {
   @apply -translate-y-[3px];
 }
+.btn-top:hover :deep(.icon svg) {
+  fill-opacity: 1;
+}
 </style>

layers/components/layouts/Main.vue

@@ -104,7 +104,10 @@ onMounted(() => {
   <ClientOnly>
     <BlocksLnb v-if="isShowLnb" />
     <div v-if="isShowTopBtn" class="utile-wrap">
-      <BlocksButtonScrollTop v-if="isShowTopBtn" />
+      <BlocksButtonScrollTop
+        v-if="isShowTopBtn"
+        :color="pageData?.top_btn_color_json"
+      />
     </div>
   </ClientOnly>
   <BlocksSns v-if="isShowSnsBtn" />

layers/types/api/pageData.ts

@@ -33,6 +33,7 @@ export interface PageDataValue {
   is_login_required: number
   meta_tag_type: number
   use_top_btn: boolean
+  top_btn_color_json?: ColorObject
   use_sns_btn: boolean
   use_lnb: boolean
   lnb_text_color_code_active?: string