Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-30 18:29:37 +02:00
Code Issues Releases Activity

Update AdventureCard and Navbar components

Browse source
This commit is contained in:
Sean Morley 2024-04-01 21:35:21 +00:00
parent 301e630405
commit a0f07a9980
3 changed files with 9 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/lib/components/AdventureCard.svelte
View file

@ -17,7 +17,7 @@
}
</script>
<div class="card min-w-max w-96 bg-neutral shadow-xl overflow-hidden">
<div class="card min-w-max lg:w-96 md:w-80 sm:w-60 xs:w-40 bg-neutral shadow-xl overflow-hidden">
<div class="card-body">
<h2 class="card-title overflow-ellipsis">{name}</h2>
<p><img src={locationDot} class="inline-block -mt-1 mr-1" alt="Logo" />{location}</p>

14
src/lib/components/Navbar.svelte
View file

@ -9,15 +9,15 @@
goto('/log');
}
</script>
<div class="navbar bg-base-100">
<div class="navbar-start">
<button class="btn btn-primary mr-4 ml-2" on:click={goHome}>Home</button>
<button class="btn btn-primary" on:click={goToLog}>My Log</button>
<div class="navbar bg-base-100 flex flex-col md:flex-row">
<div class="navbar-start flex justify-around md:justify-start">
<button class="btn btn-primary my-2 md:my-0 md:mr-4 md:ml-2" on:click={goHome}>Home</button>
<button class="btn btn-primary my-2 md:my-0" on:click={goToLog}>My Log</button>
</div>
<div class="navbar-center">
<div class="navbar-center flex justify-center md:justify-center">
<a class="btn btn-ghost text-xl" href="/">AdventureLog 🗺️</a>
</div>
<div class="navbar-end">
<div class="navbar-end flex justify-around md:justify-end">
<p>Adventures: {getNumberOfAdventures()} </p>
</div>
</div>
</div>

2
src/routes/log/+page.svelte
View file

@ -112,7 +112,7 @@
<EditModal bind:editId={editId} bind:editName={editName} bind:editLocation={editLocation} bind:editCreated={editCreated} on:submit={saveAdventure} on:close={handleClose} />
{/if}
<div class="grid grid-cols-3 gap-4 mt-4 content-center auto-cols-auto ml-6">
<div class="grid xl:grid-cols-3 lg:grid-cols-3 md:grid-cols-2 sm:grid-cols-1 gap-4 mt-4 content-center auto-cols-auto ml-6 mr-6">
{#each adventures as adventure (adventure.id)}
<AdventureCard id={adventure.id} name={adventure.name} location={adventure.location} created={adventure.created} on:remove={triggerRemoveAdventure} on:edit={editAdventure} />
{/each}