Formatting

This commit is contained in:
Vivek Santayana 2022-08-25 11:41:27 +01:00
parent 837ad3e748
commit d15a4efbc8
3 changed files with 13 additions and 12 deletions

View File

@ -4,10 +4,10 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue</title> <title>Wanderhome Personality Quiz | V.S.</title>
</head> </head>
<body> <body class="bg-green-100 h-screen">
<div id="app"></div> <div class="bg-green-100" id="app"></div>
<script type="module" src="/src/main.js"></script> <script type="module" src="/src/main.js"></script>
</body> </body>
</html> </html>

View File

@ -6,7 +6,7 @@ import Navbar from '@/components/Navbar.vue'
<template> <template>
<Navbar /> <Navbar />
<div class="container"> <div class="container p-3 max-w-5xl mx-auto">
<router-view></router-view> <router-view></router-view>
</div> </div>
</template> </template>

View File

@ -1,15 +1,16 @@
<template> <template>
<nav class="relative container mx-auto p-6"> <nav class="relative bg-lime-900 text-white">
<div class="flex items-center justify-between"> <div class="flex max-w-5xl mx-auto items-center justify-between">
<!-- Logo --> <!-- Logo -->
<div class="pt-2"> <div class="inline-flex justify-center items-center">
<img src="@/assets/vue.svg" alt="Vite Logo" > <img src="@/assets/vue.svg" class="p-2" alt="Vite Logo" >
<router-link to="/"><span class="text-m md:text-lg h-fit align-middle p-1"><em>Wanderhome</em> Personality Quiz | V.S.</span></router-link>
</div> </div>
<!-- Menu Items --> <!-- Menu Items -->
<div class="hidden md:flex space-x-6"> <div class="hidden md:flex space-x-3 justify-center items-center">
<router-link class="hover:text-red-500 active:text-blue-500" to="/">Home</router-link> <router-link class="hover:text-orange-500 active:text-blue-500 p-3 h-fit align-middle" to="/">Home</router-link>
<router-link class="hover:text-red-500 active:text-blue-500" to="/quiz">Take the Quiz</router-link> <router-link class="hover:text-orange-500 active:text-blue-500 p-3 h-fit align-middle" to="/quiz">Take the Quiz</router-link>
<router-link class="hover:text-red-500 active:text-blue-500" to="/about">About</router-link> <router-link class="hover:text-orange-500 active:text-blue-500 p-3 h-fit align-middle" to="/about">About</router-link>
</div> </div>
</div> </div>
</nav> </nav>