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

View File

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

View File

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