87b1ca0db1
- fnCustomVideo 유튜브 팝업 함수 추가 - script/link exclude 속성 지원 - 전역 함수 등록 로직 통합 (registerGlobalFunctions) - CSS Selector injection 보안 취약점 수정 - 사용되지 않는 변수/props 제거 - DOMPurify exclude, defer 속성 허용 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
56 lines
1.2 KiB
Vue
56 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
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' })
|
|
const { sendLog } = useAnalytics()
|
|
|
|
const analytics = {
|
|
action_type: 'click',
|
|
click_item: 'TOP버튼',
|
|
click_sarea: 'TOP',
|
|
} as TrackingObject
|
|
|
|
const showBtn = computed(() => windowY.value > 0)
|
|
const backgroundColor = computed(() =>
|
|
getColorCodeFromData(props.color, 'none')
|
|
)
|
|
|
|
const handleScrollToTop = () => {
|
|
windowY.value = 0
|
|
sendLog(locale.value, analytics)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<Transition name="fade">
|
|
<AtomsButtonCircle
|
|
v-show="showBtn"
|
|
class="btn-top"
|
|
sr-only="top"
|
|
:style="{ backgroundColor: backgroundColor }"
|
|
@click="handleScrollToTop"
|
|
>
|
|
<AtomsIconsArrowControlTopLine />
|
|
</AtomsButtonCircle>
|
|
</Transition>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.btn-top {
|
|
@apply bg-[image:var(--button-top)] bg-center bg-cover bg-no-repeat;
|
|
}
|
|
.btn-top:hover :deep(.icon) {
|
|
@apply -translate-y-[3px];
|
|
}
|
|
.btn-top:hover :deep(.icon svg) {
|
|
fill-opacity: 1;
|
|
}
|
|
</style>
|