verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 77 Releases Wiki Activity

style: refs #8110 #8110 perf sticky VnSubtoolbar sticky
gitea/salix-front/pipeline/pr-master This commit looks good Details

This commit is contained in:
Javier Segarra 2024-10-24 20:41:23 +02:00
parent 991cbb8534
commit f79ac38cf1
1 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/common/VnCard.vue
View File

@ -8,6 +8,7 @@ import VnSubToolbar from '../ui/VnSubToolbar.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import LeftMenu from 'components/LeftMenu.vue'; import LeftMenu from 'components/LeftMenu.vue';
import RightMenu from 'components/common/RightMenu.vue'; import RightMenu from 'components/common/RightMenu.vue';
import { useQuasar } from 'quasar';
const props = defineProps({ const props = defineProps({
dataKey: { type: String, required: true }, dataKey: { type: String, required: true },
baseUrl: { type: String, default: undefined }, baseUrl: { type: String, default: undefined },
@ -21,6 +22,7 @@ const props = defineProps({
}); });
const stateStore = useStateStore(); const stateStore = useStateStore();
const quasar = useQuasar();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const url = computed(() => { const url = computed(() => {
@ -59,7 +61,9 @@ if (props.baseUrl) {
} }
const headerHeight = ref(0); const headerHeight = ref(0);
onMounted(() => { onMounted(() => {
headerHeight.value = document.querySelector('.q-toolbar')?.offsetHeight + 'px'; const spacing = quasar.platform.is.mobile ? 30 : 0;
headerHeight.value =
document.querySelector('.q-toolbar')?.offsetHeight + spacing + 'px';
}); });
</script> </script>
<template> <template>
@ -84,7 +88,7 @@ onMounted(() => {
</template> </template>
</RightMenu> </RightMenu>
<QPageContainer> <QPageContainer>
<QPage padding :style="{ 'padding-top': headerHeight }"> <QPage padding :style="{ 'margin-top': headerHeight }">
<div :class="[useCardSize(), $attrs.class]"> <div :class="[useCardSize(), $attrs.class]">
<RouterView :key="route.path" /></div <RouterView :key="route.path" /></div
></QPage> ></QPage>