1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-08-04 20:55:19 +02:00

Add Navbar component and camping logo to page

This commit is contained in:
Sean Morley 2024-03-29 22:52:42 +00:00
parent 90036c5c14
commit c806cf074d
4 changed files with 35 additions and 0 deletions

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 16 KiB

View file

@ -0,0 +1,29 @@
<style>
.navbar {
display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
}
</style>
<script lang="ts">
function navHome() {
window.location.href = '/';
}
function navLog() {
window.location.href = '/log';
}
</script>
<div class="navbar">
<p>AdventureLog 🗺️</p>
<button on:click={navHome}>Home</button>
<button on:click={navLog}>Log</button>
<hr>
<br>
</div>

View file

@ -1,7 +1,9 @@
<script> <script>
import Footer from "$lib/components/Footer.svelte"; import Footer from "$lib/components/Footer.svelte";
import Navbar from "$lib/components/Navbar.svelte";
</script> </script>
<Navbar />
<section> <section>
<slot></slot> <slot></slot>
</section> </section>
@ -9,6 +11,7 @@
<style> <style>
section { section {
margin-top: 2rem;
margin-bottom: 5rem; margin-bottom: 5rem;
/* gives the footer space! */ /* gives the footer space! */
} }

View file

@ -1,8 +1,10 @@
<script lang="ts"> <script lang="ts">
import campingDrawing from "$lib/assets/camping.svg";
function navToLog() { function navToLog() {
window.location.href = '/log'; window.location.href = '/log';
} }
</script> </script>
<h1>Welcome to AdventureLog 🗺️</h1> <h1>Welcome to AdventureLog 🗺️</h1>
<img src={campingDrawing} width="25%" alt="Logo" />
<button on:click={navToLog}>Open Log</button> <button on:click={navToLog}>Open Log</button>