HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

fix: dynamic hide home button when on mobile

Browse source
This commit is contained in:
freeplay 2023-07-06 20:28:45 -04:00
parent 1b9176a55b
commit 6fb6959d45
1 changed files with 6 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
packages/client/src/components/global/MkPageHeader.vue
View file

@ -101,7 +101,7 @@
</nav> </nav>
</template> </template>
<div class="buttons right"> <div class="buttons right">
<MkButton v-if="!$i && displayHomeButton" :to="'/'" link rounded> <MkButton v-if="!$i && displayHomeButton && isDesktop" :to="'/'" link rounded>
<i class="ph-house ph-bold ph-lg"></i> <i class="ph-house ph-bold ph-lg"></i>
{{ i18n.ts.home }} {{ i18n.ts.home }}
</MkButton> </MkButton>
@ -162,6 +162,10 @@ type Tab = {
onClick?: (ev: MouseEvent) => void; onClick?: (ev: MouseEvent) => void;
}; };
let isDesktop = $ref(window.innerWidth >= 1100);
matchMedia(`(min-width: ${1100 - 1}px)`).onchange = (mql) => {
isDesktop = mql.matches;
};
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
tabs?: Tab[]; tabs?: Tab[];
@ -179,7 +183,7 @@ const props = withDefaults(
to?: string; to?: string;
}>(), }>(),
{ {
displayHomeButton: !$i && window.innerWidth >= 1100, displayHomeButton: !$i,
} }
); );