Fix app bar for small screens
This commit is contained in:
parent
971c3d3be5
commit
38e21786a7
@ -6,7 +6,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Vite App</title>
|
||||
</head>
|
||||
<body class="bg-slate-200 text-slate-800 dark:bg-slate-800 dark:text-slate-200">
|
||||
<body class="bg-slate-200 text-slate-800 dark:bg-slate-800 dark:text-slate-200 box-border w-full">
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
|
@ -27,7 +27,6 @@ export default defineComponent({
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="box-border w-full">
|
||||
<div class="flex flex-col md:flex-row flex-1">
|
||||
<div
|
||||
:class="[Menu.Expand ? 'md:w-72' : 'md:w-36', Menu.Show ? '' : 'hidden']"
|
||||
@ -37,7 +36,7 @@ export default defineComponent({
|
||||
</div>
|
||||
|
||||
<div class="flex-1">
|
||||
<div class="flex bg-gray-400 dark:bg-gray-600 p-4">
|
||||
<div class="flex bg-gray-400 dark:bg-gray-600 p-4 fixed md:static top-0 left-0 w-full h-14">
|
||||
<span
|
||||
class="flex-1 font-bold text-5xl -my-3 hidden md:inline"
|
||||
@click="toggleMenuSize"
|
||||
@ -58,5 +57,4 @@ export default defineComponent({
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
@ -30,7 +30,7 @@ function getAccountName(account : Account) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-col mt-14 md:mt-0">
|
||||
<span class="m-2 p-1 px-3 h-10 overflow-hidden" :class="[ExpandMenu ? 'text-2xl' : 'text-md']">
|
||||
<router-link to="/dashboard" style="font-size:150%">⌂</router-link>
|
||||
{{CurrentBudgetName}}
|
||||
|
Loading…
x
Reference in New Issue
Block a user