chamomind/jws-frontend
chamomind/jws-frontend
6
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

fix: menu item first page responsive

Browse source
This commit is contained in:
puriphatt 2024-07-03 06:45:12 +00:00
parent 6491a761e3
commit 805603e9c2
3 changed files with 212 additions and 186 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/components/home/MenuItem.vue
View file

@ -33,7 +33,10 @@ function navigateTo(destination: string) {
</script>
<template>
<div class="menu-container">
<div
class="menu-container"
:style="`grid-template-columns: repeat(${$q.screen.gt.sm ? 4 : $q.screen.gt.xs ? 2 : 1}, 1fr)`"
>
<AppBox
class="column inline-flex items-center"
:class="{ disabled: !!v.disabled }"
@ -61,7 +64,7 @@ function navigateTo(destination: string) {
<style scoped>
.menu-container {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: var(--size-6);
& > * {
transition: 100ms border-color ease-in-out;