CrystalMath/ui
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Make layout expand to fill height of body

Browse Source
This commit is contained in:
Garrett Mills 2022-04-09 12:35:36 -05:00
parent 2c059a655e
commit 2fd0107197
3 changed files with 9 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>Vite App</title>
</head> </head>
<body> <body style="display: flex; height: 100%; min-height: 100vh; flex-direction: column">
<div id="app"></div> <div id="app"></div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</body> </body>

13
src/App.vue
View File

@ -19,13 +19,9 @@ import { MathPage } from "./support/page";
</div> </div>
</v-app-bar> </v-app-bar>
<v-main> <div style="margin-top: 30px"> <!-- Account for the navbar height -->
<v-card elevation="0" height="h-100">
<router-view/> <router-view/>
</div>
</v-card>
</v-main>
</v-app> </v-app>
</template> </template>
@ -35,8 +31,9 @@ import { MathPage } from "./support/page";
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
text-align: center; text-align: center;
color: #2c3e50; display: flex;
margin-top: 60px; flex-direction: column;
flex: 1;
} }
.links { .links {
color: #fff; color: #fff;

4
src/main.ts
View File

@ -14,8 +14,8 @@ const vuetify = createVuetify({
components, components,
directives, directives,
theme: { theme: {
defaultTheme: 'dark' defaultTheme: 'dark',
} },
}) // Replaces new Vuetify(...) }) // Replaces new Vuetify(...)
app.use(vuetify) app.use(vuetify)