mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-08-02 19:55:18 +02:00
Sean Morley
GitHub
commit
20c8b5c30e
17 changed files with 1542 additions and 122 deletions
17
.dockerignore
Normal file
17
.dockerignore
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
Dockerfile
|
||||
.dockerignore
|
||||
.git
|
||||
.gitignore
|
||||
.gitattributes
|
||||
README.md
|
||||
.npmrc
|
||||
.prettierrc
|
||||
.eslintrc.cjs
|
||||
.graphqlrc
|
||||
.editorconfig
|
||||
.svelte-kit
|
||||
.vscode
|
||||
node_modules
|
||||
build
|
||||
package
|
||||
**/.env
|
||||
26
Dockerfile
Normal file
26
Dockerfile
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
# Use this image as the platform to build the app
|
||||
FROM node:18-alpine AS external-website
|
||||
|
||||
# A small line inside the image to show who made it
|
||||
LABEL Developers="Sean Morley"
|
||||
|
||||
# The WORKDIR instruction sets the working directory for everything that will happen next
|
||||
WORKDIR /app
|
||||
|
||||
# Copy all local files into the image
|
||||
COPY . .
|
||||
|
||||
# Clean install all node modules
|
||||
RUN npm ci
|
||||
|
||||
# Build SvelteKit app
|
||||
RUN npm run build
|
||||
|
||||
# Expose the port that the app is listening on
|
||||
EXPOSE 3000
|
||||
|
||||
# The USER instruction sets the user name to use as the default user for the remainder of the current stage
|
||||
USER node:node
|
||||
|
||||
# This is the command that will be run inside the image when you tell Docker to start the container
|
||||
CMD ["node", "build/index.js"]
|
||||
1390
package-lock.json
generated
1390
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -11,10 +11,16 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "^3.0.0",
|
||||
"@sveltejs/adapter-node": "^5.0.1",
|
||||
"@sveltejs/kit": "^2.0.0",
|
||||
"@sveltejs/vite-plugin-svelte": "^3.0.0",
|
||||
"@tailwindcss/typography": "^0.5.12",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"daisyui": "^4.9.0",
|
||||
"postcss": "^8.4.38",
|
||||
"svelte": "^4.2.7",
|
||||
"svelte-check": "^3.6.0",
|
||||
"tailwindcss": "^3.4.3",
|
||||
"tslib": "^2.4.1",
|
||||
"typescript": "^5.0.0",
|
||||
"vite": "^5.0.3"
|
||||
|
|
|
|||
6
postcss.config.js
Normal file
6
postcss.config.js
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
3
src/app.css
Normal file
3
src/app.css
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
1
src/lib/assets/calendar.svg
Normal file
1
src/lib/assets/calendar.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="14.25" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="#ffffff" d="M152 24c0-13.3-10.7-24-24-24s-24 10.7-24 24V64H64C28.7 64 0 92.7 0 128v16 48V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V192 144 128c0-35.3-28.7-64-64-64H344V24c0-13.3-10.7-24-24-24s-24 10.7-24 24V64H152V24zM48 192H400V448c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16V192z"/></svg>
|
||||
|
After Width: | Height: | Size: 547 B |
1
src/lib/assets/exportFile.svg
Normal file
1
src/lib/assets/exportFile.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="17.75" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="#ffffff" d="M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V288H216c-13.3 0-24 10.7-24 24s10.7 24 24 24H384V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V64zM384 336V288H494.1l-39-39c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l80 80c9.4 9.4 9.4 24.6 0 33.9l-80 80c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l39-39H384zm0-208H256V0L384 128z"/></svg>
|
||||
|
After Width: | Height: | Size: 608 B |
1
src/lib/assets/locationDot.svg
Normal file
1
src/lib/assets/locationDot.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="12.5" viewBox="0 0 384 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="#ffffff" d="M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/></svg>
|
||||
|
After Width: | Height: | Size: 439 B |
|
|
@ -1,5 +1,7 @@
|
|||
<script lang="ts">
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import locationDot from "$lib/assets/locationDot.svg";
|
||||
import calendar from "$lib/assets/calendar.svg";
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
export let name:String;
|
||||
|
|
@ -15,37 +17,15 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<div>
|
||||
<!-- <p>ID: {id}</p> -->
|
||||
<p>Name: {name}</p>
|
||||
<p>Location: {location}</p>
|
||||
<p>Created: {created}</p>
|
||||
<button on:click={remove}>Remove</button>
|
||||
<button on:click={edit}>Edit</button>
|
||||
<div class="card min-w-max w-96 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>
|
||||
<p><img src={calendar} class="inline-block -mt-1 mr-1" alt="Logo" />{created}</p>
|
||||
<div class="card-actions justify-end">
|
||||
<button class="btn btn-primary" on:click={edit}>Edit</button>
|
||||
<button class="btn btn-secondary" on:click={remove}>Remove</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
div {
|
||||
margin: 2rem;
|
||||
padding: .5rem;
|
||||
background-color: rgb(235, 230, 223);
|
||||
border: 1px solid grey;
|
||||
border-radius: .5rem;
|
||||
box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.182);
|
||||
}
|
||||
button {
|
||||
margin-left: 1rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background-color: #076836;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
box-shadow: 0px 2px 5px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #074b28;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,44 +1,34 @@
|
|||
<style>
|
||||
.navbar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-left: 1rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background-color: #076836;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
box-shadow: 0px 2px 5px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #074b28;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script lang="ts">
|
||||
function navHome() {
|
||||
window.location.href = '/';
|
||||
|
||||
import { getNumberOfAdventures } from "../../services/adventureService";
|
||||
import { goto } from '$app/navigation';
|
||||
|
||||
async function goHome() {
|
||||
goto('/');
|
||||
}
|
||||
function navLog() {
|
||||
window.location.href = '/log';
|
||||
async function goToLog() {
|
||||
goto('/log');
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<div class="navbar">
|
||||
|
||||
<h2>AdventureLog 🗺️</h2>
|
||||
<button on:click={navHome}>Home</button>
|
||||
<button on:click={navLog}>Log</button>
|
||||
<hr>
|
||||
<br>
|
||||
</div>
|
||||
<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>
|
||||
<div class="navbar-center">
|
||||
<a class="btn btn-ghost text-xl" href="/">AdventureLog 🗺️</a>
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<p>Adventures: {getNumberOfAdventures()} </p>
|
||||
<button class="btn btn-ghost btn-circle">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" /></svg>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-ghost btn-circle">
|
||||
<div class="indicator">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" /></svg>
|
||||
<span class="badge badge-xs badge-primary indicator-item"></span>
|
||||
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<script>
|
||||
import Footer from "$lib/components/Footer.svelte";
|
||||
import Navbar from "$lib/components/Navbar.svelte";
|
||||
import "../app.css";
|
||||
</script>
|
||||
|
||||
<Navbar />
|
||||
|
|
|
|||
|
|
@ -1,41 +1,13 @@
|
|||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import campingDrawing from "$lib/assets/camping.svg";
|
||||
function navToLog() {
|
||||
window.location.href = '/log';
|
||||
async function navToLog() {
|
||||
goto('/log');
|
||||
}
|
||||
</script>
|
||||
|
||||
<h1>Welcome to AdventureLog 🗺️</h1>
|
||||
<img src={campingDrawing} width="25%" alt="Logo" />
|
||||
<button on:click={navToLog}>Open Log</button>
|
||||
|
||||
<style>
|
||||
button {
|
||||
margin-left: 1rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background-color: #076836;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
box-shadow: 0px 2px 5px rgba(0,0,0,0.1);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #074b28;
|
||||
}
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
img {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
</style>
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<article class="prose"><h1 class="mb-4">Welcome. Let's get Exploring!</h1></article>
|
||||
<img src={campingDrawing} class="w-1/4 mb-4" alt="Logo" />
|
||||
<button on:click={navToLog} class="btn btn-primary">Open Log</button>
|
||||
</div>
|
||||
|
|
@ -5,6 +5,7 @@
|
|||
import { onMount } from 'svelte';
|
||||
import { exportData } from "../../services/export";
|
||||
import { importData } from "../../services/import";
|
||||
import exportFile from "$lib/assets/exportFile.svg";
|
||||
|
||||
import mapDrawing from "$lib/assets/adventure_map.svg"
|
||||
|
||||
|
|
@ -62,21 +63,24 @@
|
|||
|
||||
</script>
|
||||
|
||||
<input bind:value={newName} placeholder="Adventure Name" />
|
||||
<input bind:value={newLocation} placeholder="Adventure Location" />
|
||||
<button on:click={createNewAdventure}>Add Adventure</button>
|
||||
<div class="flex flex-row items-center justify-center gap-4">
|
||||
<input type="text" bind:value={newName} placeholder="Adventure Name" class="input input-bordered w-full max-w-xs" />
|
||||
<input type="text" bind:value={newLocation} placeholder="Adventure Location" class="input input-bordered w-full max-w-xs" />
|
||||
<button class="btn" on:click={createNewAdventure}>Add Adventure</button>
|
||||
</div>
|
||||
|
||||
{#each adventures as adventure, i}
|
||||
<div>
|
||||
<div class="grid grid-cols-3 gap-4 mt-4 content-center auto-cols-auto ml-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} />
|
||||
</div>
|
||||
{/each}
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
|
||||
{#if adventures.length == 0}
|
||||
<div class="addsomething">
|
||||
<h2>Add some adventures!</h2>
|
||||
<div class="flex flex-col items-center justify-center mt-28">
|
||||
<article class="prose mb-4"><h2>Add some adventures!</h2></article>
|
||||
<img src={mapDrawing} width="25%" alt="Logo" />
|
||||
</div >
|
||||
</div>
|
||||
|
||||
{/if}
|
||||
|
||||
|
|
@ -90,10 +94,16 @@
|
|||
{/if}
|
||||
|
||||
{#if adventures.length != 0}
|
||||
<button on:click={async () => { window.location.href = exportData(); }}>Save as File</button>
|
||||
|
||||
|
||||
|
||||
<button class="btn btn-neutral ml-auto mr-auto block" on:click={async () => { window.location.href = exportData(); }}>
|
||||
<img src={exportFile} class="inline-block -mt-1" alt="Logo" /> Save as File
|
||||
</button>
|
||||
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
<!-- <style>
|
||||
.addsomething {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -117,4 +127,4 @@ button {
|
|||
button:hover {
|
||||
background-color: #074b28;
|
||||
}
|
||||
</style>
|
||||
</style> -->
|
||||
|
|
@ -55,4 +55,8 @@ export function saveEdit(editId:number, editName:string, editLocation:string, ed
|
|||
}
|
||||
}
|
||||
|
||||
export function getNumberOfAdventures() {
|
||||
return adventures.length;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import adapter from '@sveltejs/adapter-auto';
|
||||
//import adapter from '@sveltejs/adapter-auto';
|
||||
import adapter from '@sveltejs/adapter-node';
|
||||
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
|
||||
|
||||
/** @type {import('@sveltejs/kit').Config} */
|
||||
|
|
|
|||
11
tailwind.config.js
Normal file
11
tailwind.config.js
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: ['./src/**/*.{html,js,svelte,ts}'],
|
||||
theme: {
|
||||
extend: {}
|
||||
},
|
||||
plugins: [require("@tailwindcss/typography"), require("daisyui")],
|
||||
daisyui: {
|
||||
themes: ["night"],
|
||||
},
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue