hrms-bangkok/web-faq
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ปรับ header

Browse source
This commit is contained in:
Tanyalak 2023-12-15 14:58:12 +07:00
parent e305d7e907
commit 75da3daf71
1 changed files with 8 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/views/MainLayout.vue
View file

@ -52,11 +52,11 @@ const onScroll = (info: any) => { scrollInfo.value = info}
</script> </script>
<!-- โครงเว็บ --> <!-- โครงเว็บ -->
<template> <template>
<q-layout view="hHh LpR fFr"> <q-layout view="hHh LpR fFr" @scroll="onScroll" >
<q-scroll-observer @scroll="onScroll" />
<!-- header --> <!-- header -->
<q-header flat class="text-dark col-12 bg-transparent" height-hint="7"> <q-header flat :class="scrollInfo.position >= 10 ? 'text-dark col-12 bgHeader': 'text-dark col-12 bg-transparent'" height-hint="7">
<q-toolbar class="q-my-xs items-center" :style="$q.screen.gt.xs ? 'padding: 1% 2%;': 'padding: 1% 4%;'"> <q-toolbar class="items-center" :style="$q.screen.gt.xs ? 'padding: 1% 2%;': 'padding: 1% 4%;'">
<div class="row items-center no-wrap cursor-pointer" @click="goHome" v-if="$q.screen.gt.xs"> <div class="row items-center no-wrap cursor-pointer" @click="goHome" v-if="$q.screen.gt.xs">
<q-img src="@/assets/logo.png" spinner-color="white" style="height: 35px; max-width: 35px"/> <q-img src="@/assets/logo.png" spinner-color="white" style="height: 35px; max-width: 35px"/>
<q-separator vertical inset class="q-ml-md" /> <q-separator vertical inset class="q-ml-md" />
@ -130,7 +130,7 @@ const onScroll = (info: any) => { scrollInfo.value = info}
</div> </div>
<div class="col-12 row" v-if="currentRouteName != 'contact'"> <div class="col-12 row" v-if="currentRouteName != 'contact'">
<q-page-scroller position="bottom-center" :scroll-offset="300" :offset="[18, 18]" > <q-page-scroller :scroll-offset="300" :offset="[18, 18]" >
<q-tabs content-class="red" no-caps active-color="primary" indicator-color="transparent" class="text-grey-8" v-model="tab"> <q-tabs content-class="red" no-caps active-color="primary" indicator-color="transparent" class="text-grey-8" v-model="tab">
<q-tab name="metadata" label="ข้อมูลหลัก" @click="router.push({ path: '/metadata' })"/> <q-tab name="metadata" label="ข้อมูลหลัก" @click="router.push({ path: '/metadata' })"/>
<q-tab name="organizational" label="โครงสร้างอัตรากำลัง" @click="router.push({ path: '/organizational' })" /> <q-tab name="organizational" label="โครงสร้างอัตรากำลัง" @click="router.push({ path: '/organizational' })" />
@ -221,4 +221,7 @@ const onScroll = (info: any) => { scrollInfo.value = info}
overflow-y:auto; overflow-y:auto;
} }
.bgHeader{
background: #1e2234e5;
}
</style> </style>