diff --git a/app/error.vue b/app/error.vue index 2da691b..627dd21 100644 --- a/app/error.vue +++ b/app/error.vue @@ -3,39 +3,47 @@ -
+
- -
- Stove -
- - -
- -
- Error +
+ Stove
- -
-

- -

-

-
-
+ +
+ +
+ Error +
- - +
+

+ +

+

+
+
+ + + - \ No newline at end of file + diff --git a/layers/assets/css/app.css b/layers/assets/css/app.css index a519894..5479127 100644 --- a/layers/assets/css/app.css +++ b/layers/assets/css/app.css @@ -1,7 +1,9 @@ -@import './base/_theme.css'; @import './base/_reset.css'; +@import './base/_theme.css'; +@import './base/_font.css'; @import './base/_transition.css'; +@import './components/_scrollbar.css'; @import './components/_button.css'; @import './components/_layout.css'; @import './components/_modal.css'; diff --git a/layers/assets/css/base/_font.css b/layers/assets/css/base/_font.css new file mode 100644 index 0000000..550e265 --- /dev/null +++ b/layers/assets/css/base/_font.css @@ -0,0 +1,92 @@ +@import url(https://static-cdn.onstove.com/0.0.1/font/SpoqaSans/StoveUIFont-KR.css); +@import url(https://static-cdn.onstove.com/0.0.4/font/Inter/StoveFont-Global.css); +@import url(https://static-cdn.onstove.com/0.0.4/font-icon/StoveFont-Icon.css); +/* @import url(https://static-cdn.onstove.com/0.0.1/font/SpoqaSans/StoveFont-KR.css); */ + +:lang(ko) { + font-family: + Spoqa Han Sans Neo KR, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} + +:lang(en) { + font-family: + inter Global, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} + +:lang(zh), +:lang(zh-cn) { + font-family: + Microsoft YaHei UI, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} + +:lang(zh-tw) { + font-family: + Microsoft JhengHei UI, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} + +:lang(ja) { + font-family: + Meiryo Yu Gothic UI, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} + +:lang(de), +:lang(es), +:lang(fr), +:lang(pt) { + font-family: + inter Global, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} + +:lang(th) { + font-family: + Leelawadee UI, + -apple-system, + Segoe UI, + Helvetica, + Arial, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji; +} diff --git a/layers/assets/css/base/_reset.css b/layers/assets/css/base/_reset.css index c18dda7..b76cb09 100644 --- a/layers/assets/css/base/_reset.css +++ b/layers/assets/css/base/_reset.css @@ -2,6 +2,7 @@ @layer base { body { @apply min-w-[320px] bg-black; + -webkit-font-smoothing: antialiased; } body.scroll-lock { @apply overflow-hidden; diff --git a/layers/assets/css/components/_base-content.css b/layers/assets/css/components/_base-content.css index 18e1b17..bbf41f9 100644 --- a/layers/assets/css/components/_base-content.css +++ b/layers/assets/css/components/_base-content.css @@ -28,9 +28,6 @@ .use-base th { @apply font-semibold bg-gray-50; } - .use-base tbody tr:nth-child(even) { - @apply bg-gray-50; - } .use-base blockquote { @apply border-l-4 border-gray-300 pl-4 italic text-gray-700; diff --git a/layers/assets/css/components/_layout.css b/layers/assets/css/components/_layout.css index f8973f3..c2d3c1a 100644 --- a/layers/assets/css/components/_layout.css +++ b/layers/assets/css/components/_layout.css @@ -27,13 +27,13 @@ /* 표준형 Title Classes */ .title-xlg { - @apply line-clamp-4 text-[24px] font-[700] leading-[34px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-3 md:text-[50px] md:leading-[70px]; + @apply line-clamp-4 text-[24px] font-[700] tracking-[-0.82px] leading-[34px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:tracking-[-1.5px] md:line-clamp-3 md:text-[50px] md:leading-[70px]; } .title-lg { - @apply line-clamp-4 text-[20px] font-[700] leading-[30px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-3 md:text-[42px] md:leading-[56px]; + @apply line-clamp-4 text-[20px] font-[700] tracking-[-0.6px] leading-[30px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:tracking-[-1.26px] md:line-clamp-3 md:text-[42px] md:leading-[56px]; } .title-md { - @apply line-clamp-2 text-[16px] font-[500] leading-[24px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:line-clamp-1 md:text-[24px] md:leading-[34px]; + @apply line-clamp-2 text-[16px] font-[500] tracking-[-0.48px] leading-[24px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:tracking-[-0.72px] md:line-clamp-1 md:text-[24px] md:leading-[34px]; } .title-sm { @apply text-[15px] font-[500] leading-[24px] tracking-[-0.45px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:text-[20px] md:leading-[30px] md:tracking-[-0.6px]; diff --git a/layers/assets/css/components/_scrollbar.css b/layers/assets/css/components/_scrollbar.css new file mode 100644 index 0000000..66b8c4f --- /dev/null +++ b/layers/assets/css/components/_scrollbar.css @@ -0,0 +1,14 @@ +body ::-webkit-scrollbar-track { + @apply bg-transparent; +} +body ::-webkit-scrollbar { + @apply w-5; +} + +body ::-webkit-scrollbar-thumb { + @apply w-1 bg-[#D9D9D9] rounded-full bg-clip-padding border-solid border-transparent border-8; +} + +.custom-theme-scrollbar::-webkit-scrollbar-thumb { + @apply bg-[var(--foreground-reversal-15)]; +} diff --git a/layers/components/blocks/Button/Home.vue b/layers/components/blocks/Button/Home.vue index 667d0b2..7fbcd60 100644 --- a/layers/components/blocks/Button/Home.vue +++ b/layers/components/blocks/Button/Home.vue @@ -1,26 +1,14 @@ - + diff --git a/layers/components/blocks/Lnb.vue b/layers/components/blocks/Lnb.vue index 95bf707..941f4f6 100644 --- a/layers/components/blocks/Lnb.vue +++ b/layers/components/blocks/Lnb.vue @@ -1,17 +1,21 @@ diff --git a/layers/components/blocks/StoveGnb.vue b/layers/components/blocks/StoveGnb.vue index aee890f..1de2064 100644 --- a/layers/components/blocks/StoveGnb.vue +++ b/layers/components/blocks/StoveGnb.vue @@ -28,7 +28,7 @@ const loadGnb = (locale: string) => { const gnbOption = { wrapper: '#stove-wrap', isResponsive: true, - skin: stoveGnbData?.skin_type || 'gnb-dark-mini', + skin: 'gnb-dark-mini', widget: { gameListAndService: false, languageSelect: false, diff --git a/layers/components/blocks/StoveGnbNew.vue b/layers/components/blocks/StoveGnbNew.vue index df59aac..940334f 100644 --- a/layers/components/blocks/StoveGnbNew.vue +++ b/layers/components/blocks/StoveGnbNew.vue @@ -22,8 +22,8 @@ onMounted(() => { mobile: '', }, widget: { - notification: true, - stoveDownload: true, + notification: stoveGnbData?.notify_icon_visible || true, + stoveDownload: stoveGnbData?.stove_install_button_visible || true, languageSelect: false, themeSelect: false, stoveMenu: { @@ -40,9 +40,8 @@ onMounted(() => { }, mode: { theme: { - support: ['light', 'dark'], + support: designTheme === 1 ? ['light'] : ['dark'], default: designTheme === 1 ? 'light' : 'dark', - // support: designTheme === 1 ? ['light'] : ['dark'], }, mini: true, layout: 'wide', @@ -54,7 +53,7 @@ onMounted(() => { stoveGnbOptions ) } - if(mountedInstance){ + if (mountedInstance) { //Stove GNB에서도 쿠키를 굽고 있어 소문자로 통일 //LOCALE 쿠키를 가져온 후 소문자로 변경해서 다시 LOCALE 쿠키를 설정 nextTick(() => { @@ -66,10 +65,8 @@ onMounted(() => { localeCookie.value = localeCookie.value.toLowerCase() }) } - }) - onBeforeUnmount(() => { if (mountedInstance && typeof mountedInstance.destroy === 'function') { mountedInstance.destroy() diff --git a/layers/components/blocks/modal/Content.vue b/layers/components/blocks/modal/Content.vue index 1407559..8580126 100644 --- a/layers/components/blocks/modal/Content.vue +++ b/layers/components/blocks/modal/Content.vue @@ -93,7 +93,7 @@ watch(isOpen, newVal => { :class="[ 'content-tex', 'use-base', - { 'is-visible': isVisible(index) }, + { 'is-hidden': !isVisible(index) }, ]" /> @@ -153,13 +153,4 @@ watch(isOpen, newVal => { .content-tex { @apply overflow-y-auto mb-4 px-6 sm:mb-6 sm:px-8; } -.content-tex::-webkit-scrollbar-track { - @apply bg-transparent; -} -.content-tex::-webkit-scrollbar { - @apply w-5; -} -.content-tex::-webkit-scrollbar-thumb { - @apply w-1 bg-[#D9D9D9] rounded-full bg-clip-padding border-solid border-transparent border-8; -} diff --git a/layers/components/blocks/slide/Thumbnail.vue b/layers/components/blocks/slide/Thumbnail.vue index 39a31ab..3d71845 100644 --- a/layers/components/blocks/slide/Thumbnail.vue +++ b/layers/components/blocks/slide/Thumbnail.vue @@ -50,7 +50,6 @@ const mainOptions = computed(() => ({ const thumbOptions = computed(() => ({ type: 'slide', rewind: true, - // focus: 'center', autoWidth: true, perMove: 1, arrows: true, diff --git a/layers/components/layouts/EventNavigation.vue b/layers/components/layouts/EventNavigation.vue index 0b4decc..7cdf417 100644 --- a/layers/components/layouts/EventNavigation.vue +++ b/layers/components/layouts/EventNavigation.vue @@ -6,9 +6,6 @@ import type { const { locale } = useI18n() const gameDomain = useGetGameDomain() -const scrollStore = useScrollStore() - -const { isPassedStoveGnb } = storeToRefs(scrollStore) const isEventNavigationOpen = ref(true) const eventNavigationList = ref>({}) @@ -52,7 +49,6 @@ onMounted(async () => { class="event-navigation" :class="{ 'is-closed': !isEventNavigationOpen, - 'is-fixed': isPassedStoveGnb, }" >