Merge branch 'feature/202501107-all' into feature/20251001-gil

layers/components/layouts/Header.vue

@@ -176,7 +176,7 @@ onBeforeUnmount(() => {
     <div class="game-wrapper" :class="{ 'is-fixed': isPassedStoveGnb }">
       <AtomsLocaleLink to="/brand" class="mx-auto md:hidden">
         <img
-          :src="getResolvedHost(gnbData?.bi_path)"
+          :src="getImageHost(gnbData?.bi_path)"
           :alt="gameData?.game_name"
           class="h-[30px]"
         />
@@ -193,7 +193,7 @@ onBeforeUnmount(() => {
           <div class="nav-logo">
             <AtomsLocaleLink to="/brand" @click="handleMenuClose">
               <img
-                :src="getResolvedHost(gnbData?.bi_path)"
+                :src="getImageHost(gnbData?.bi_path)"
                 :alt="gameData?.game_name"
                 class="h-[30px]"
               />
@@ -215,13 +215,21 @@ onBeforeUnmount(() => {
                 <AtomsLocaleLink
                   :to="gnbItem.url_path"
                   :target="gnbItem.link_target"
-                  :class="['nav-1depth', { active: isNavItemActive(gnbItem) }]"
+                  :class="[
+                    'nav-1depth',
+                    { 'has-link': !!gnbItem.url_path },
+                    { active: isNavItemActive(gnbItem) },
+                  ]"
                 >
                   <span>{{ gnbItem.menu_name }}</span>
                   <AtomsIconsArrowDownFill
                     v-if="has2depthButton(gnbItem)"
                     class="hidden md:block"
                   />
+                  <AtomsIconsArrowRightLine
+                    v-if="!has2depthButton(gnbItem)"
+                    class="ml-auto md:hidden"
+                  />
                 </AtomsLocaleLink>
                 <Transition name="fade">
                   <div v-if="has2depthButton(gnbItem)" class="nav-2depth">
@@ -322,7 +330,6 @@ onBeforeUnmount(() => {
                   colorCode: gnb1depthButtonData?.btn_info?.color_code_txt,
                 })
               "
-              class="nav-1depth"
             >
               {{ gnb1depthButtonData?.btn_info?.txt_btn_name }}
             </AtomsButtonLauncher>
@@ -337,7 +344,11 @@ onBeforeUnmount(() => {
             </div>
           </div>
           <button class="btn-close" @click="handleMenuClose">
-            <AtomsIconsMenuCloseLine class="mx-auto" />
+            <AtomsIconsCloseLine
+              size="24"
+              color="var(--foreground-reversal)"
+              class="mx-auto"
+            />
             <span class="sr-only">menu close</span>
           </button>
         </div>
@@ -426,6 +437,9 @@ onBeforeUnmount(() => {
 .nav-1depth.active {
   @apply bg-theme-foreground-reversal-8 md:bg-transparent;
 }
+.nav-1depth.has-link {
+  @apply hover:bg-theme-foreground-reversal-4 active:bg-theme-foreground-reversal-10 md:hover:bg-transparent md:active:bg-transparent;
+}
 
 .nav-2depth {
   @apply text-[15px] md:hidden md:absolute md:top-[64px] md:left-[-28px] md:pt-1;
@@ -480,15 +494,16 @@ onBeforeUnmount(() => {
 .btn-start:hover .nav-2depth {
   @apply md:block;
 }
-.btn-start:deep(.nav-1depth) {
-  @apply w-full h-[48px] px-10 md:w-auto;
+.btn-start:deep(> .btn-base) {
+  @apply w-full h-[48px] px-10;
 }
-.btn-start:deep(.nav-1depth) .icon-platform {
+.btn-start:deep(> .btn-base) .icon-platform {
   @apply hidden;
 }
-.btn-start:deep(.nav-1depth) .btn-content {
-  @apply justify-center text-center;
+.btn-start:deep(> .btn-base) .btn-content {
+  @apply justify-center;
 }
+
 .btn-start .nav-2depth {
   @apply left-[unset] right-[-40px];
 }