implemented
Some checks failed
Deploy static content to Pages / deploy (pull_request) Failing after 12s
Some checks failed
Deploy static content to Pages / deploy (pull_request) Failing after 12s
contact site formatting nodemailer docker
This commit is contained in:
Benjamin Palko
parent
b64d112ea7
commit
8680552208
7 changed files with 110 additions and 74 deletions
58
bun.lock
58
bun.lock
|
|
@ -4,32 +4,34 @@
|
|||
"": {
|
||||
"name": "benjaminpalko.github.io",
|
||||
"dependencies": {
|
||||
"lucide-svelte": "latest",
|
||||
"lucide-svelte": "^0.503.0",
|
||||
"nodemailer": "^6.10.1",
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/compat": "latest",
|
||||
"@eslint/js": "latest",
|
||||
"@sveltejs/adapter-node": "latest",
|
||||
"@sveltejs/kit": "latest",
|
||||
"@sveltejs/vite-plugin-svelte": "latest",
|
||||
"@tailwindcss/vite": "latest",
|
||||
"autoprefixer": "latest",
|
||||
"daisyui": "latest",
|
||||
"eslint": "latest",
|
||||
"eslint-config-prettier": "latest",
|
||||
"eslint-plugin-svelte": "latest",
|
||||
"globals": "latest",
|
||||
"mdsvex": "latest",
|
||||
"prettier": "latest",
|
||||
"prettier-plugin-svelte": "latest",
|
||||
"prettier-plugin-tailwindcss": "latest",
|
||||
"svelte": "latest",
|
||||
"svelte-check": "latest",
|
||||
"tailwindcss": "latest",
|
||||
"typescript": "latest",
|
||||
"typescript-eslint": "latest",
|
||||
"vite": "latest",
|
||||
"vitest": "latest",
|
||||
"@eslint/compat": "^1.2.8",
|
||||
"@eslint/js": "^9.25.1",
|
||||
"@sveltejs/adapter-node": "^5.2.12",
|
||||
"@sveltejs/kit": "^2.20.7",
|
||||
"@sveltejs/vite-plugin-svelte": "^5.0.3",
|
||||
"@tailwindcss/vite": "^4.1.4",
|
||||
"@types/nodemailer": "^6.4.17",
|
||||
"autoprefixer": "^10.4.21",
|
||||
"daisyui": "^5.0.28",
|
||||
"eslint": "^9.25.1",
|
||||
"eslint-config-prettier": "^10.1.2",
|
||||
"eslint-plugin-svelte": "^3.5.1",
|
||||
"globals": "^16.0.0",
|
||||
"mdsvex": "^0.12.5",
|
||||
"prettier": "^3.5.3",
|
||||
"prettier-plugin-svelte": "^3.3.3",
|
||||
"prettier-plugin-tailwindcss": "^0.6.11",
|
||||
"svelte": "^5.28.2",
|
||||
"svelte-check": "^4.1.6",
|
||||
"tailwindcss": "^4.1.4",
|
||||
"typescript": "^5.8.3",
|
||||
"typescript-eslint": "^8.31.0",
|
||||
"vite": "^6.3.3",
|
||||
"vitest": "^3.1.2",
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
@ -228,6 +230,10 @@
|
|||
|
||||
"@types/mdast": ["@types/mdast@4.0.4", "", { "dependencies": { "@types/unist": "*" } }, "sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA=="],
|
||||
|
||||
"@types/node": ["@types/node@22.15.3", "", { "dependencies": { "undici-types": "~6.21.0" } }, "sha512-lX7HFZeHf4QG/J7tBZqrCAXwz9J5RD56Y6MpP0eJkka8p+K0RY/yBTW7CYFJ4VGCclxqOLKmiGP5juQc6MKgcw=="],
|
||||
|
||||
"@types/nodemailer": ["@types/nodemailer@6.4.17", "", { "dependencies": { "@types/node": "*" } }, "sha512-I9CCaIp6DTldEg7vyUTZi8+9Vo0hi1/T8gv3C89yk1rSAAzoKQ8H8ki/jBYJSFoH/BisgLP8tkZMlQ91CIquww=="],
|
||||
|
||||
"@types/resolve": ["@types/resolve@1.20.2", "", {}, "sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q=="],
|
||||
|
||||
"@types/unist": ["@types/unist@2.0.11", "", {}, "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA=="],
|
||||
|
|
@ -508,6 +514,8 @@
|
|||
|
||||
"node-releases": ["node-releases@2.0.19", "", {}, "sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw=="],
|
||||
|
||||
"nodemailer": ["nodemailer@6.10.1", "", {}, "sha512-Z+iLaBGVaSjbIzQ4pX6XV41HrooLsQ10ZWPUehGmuantvzWoDVBnmsdUcOIDM1t+yPor5pDhVlDESgOMEGxhHA=="],
|
||||
|
||||
"normalize-range": ["normalize-range@0.1.2", "", {}, "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA=="],
|
||||
|
||||
"optionator": ["optionator@0.9.4", "", { "dependencies": { "deep-is": "^0.1.3", "fast-levenshtein": "^2.0.6", "levn": "^0.4.1", "prelude-ls": "^1.2.1", "type-check": "^0.4.0", "word-wrap": "^1.2.5" } }, "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g=="],
|
||||
|
|
@ -632,6 +640,8 @@
|
|||
|
||||
"typescript-eslint": ["typescript-eslint@8.31.0", "", { "dependencies": { "@typescript-eslint/eslint-plugin": "8.31.0", "@typescript-eslint/parser": "8.31.0", "@typescript-eslint/utils": "8.31.0" }, "peerDependencies": { "eslint": "^8.57.0 || ^9.0.0", "typescript": ">=4.8.4 <5.9.0" } }, "sha512-u+93F0sB0An8WEAPtwxVhFby573E8ckdjwUUQUj9QA4v8JAvgtoDdIyYR3XFwFHq2W1KJ1AurwJCO+w+Y1ixyQ=="],
|
||||
|
||||
"undici-types": ["undici-types@6.21.0", "", {}, "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ=="],
|
||||
|
||||
"unist-util-is": ["unist-util-is@4.1.0", "", {}, "sha512-ZOQSsnce92GrxSqlnEEseX0gi7GH9zTJZ0p9dtu87WRb/37mMPO2Ilx1s/t9vBHrFhbgweUwb+t7cIn5dxPhZg=="],
|
||||
|
||||
"unist-util-stringify-position": ["unist-util-stringify-position@2.0.3", "", { "dependencies": { "@types/unist": "^2.0.2" } }, "sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g=="],
|
||||
|
|
|
|||
1
devops/.gitignore
vendored
Normal file
1
devops/.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
data/
|
||||
10
devops/docker-compose.dev.yml
Normal file
10
devops/docker-compose.dev.yml
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
services:
|
||||
postgres:
|
||||
container_name: postgres
|
||||
image: postgres
|
||||
environment:
|
||||
POSTGRES_DB: ${DATABASE_NAME}
|
||||
POSTGRES_USER: ${DATABASE_USERNAME}
|
||||
POSTGRES_PASSWORD: ${DATABASE_PASSWORD}
|
||||
volumes:
|
||||
- ./data:/var/lib/postgresql/data
|
||||
|
|
@ -5,6 +5,8 @@
|
|||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite dev",
|
||||
"compose:up": "docker compose -p strapi -f devops/docker-compose.dev.yml up -d ",
|
||||
"compose:down": "docker compose -p strapi -f devops/docker-compose.dev.yml down",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
||||
|
|
@ -21,6 +23,7 @@
|
|||
"@sveltejs/kit": "^2.20.7",
|
||||
"@sveltejs/vite-plugin-svelte": "^5.0.3",
|
||||
"@tailwindcss/vite": "^4.1.4",
|
||||
"@types/nodemailer": "^6.4.17",
|
||||
"autoprefixer": "^10.4.21",
|
||||
"daisyui": "^5.0.28",
|
||||
"eslint": "^9.25.1",
|
||||
|
|
@ -40,6 +43,7 @@
|
|||
"vitest": "^3.1.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"lucide-svelte": "^0.503.0"
|
||||
"lucide-svelte": "^0.503.0",
|
||||
"nodemailer": "^6.10.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
</div>
|
||||
{/snippet}
|
||||
|
||||
<div class="bg-hazard rounded-box w-full border border-amber-400 p-6">
|
||||
<div class="bg-hazard rounded-box h-full w-full border border-amber-400 p-6">
|
||||
<div
|
||||
class="bg-base-200 rounded-box flex h-full flex-col items-center justify-center gap-48 overflow-hidden border border-amber-400"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -24,20 +24,22 @@
|
|||
</script>
|
||||
|
||||
<div class="h-screen w-screen p-12">
|
||||
<div class="bg-base-200 flex min-h-full flex-col rounded-4xl">
|
||||
<div class="p-8">
|
||||
<div
|
||||
class="bg-base-200 grid min-h-full grid-rows-[max-content_max-content_auto_max-content] rounded-4xl"
|
||||
>
|
||||
<header class=" p-8">
|
||||
<Navbar title="Benjamin Palko" {pages} route={page.route} />
|
||||
</div>
|
||||
</header>
|
||||
{#if current && current.slug !== '/'}
|
||||
<div class="bg-base-300 w-full px-12 py-8">
|
||||
<h1 class="text-4xl font-light">{current.name}</h1>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="flex flex-1 items-stretch justify-center p-8">
|
||||
<main>
|
||||
{@render children()}
|
||||
</div>
|
||||
<div class="p-8">
|
||||
</main>
|
||||
<footer class="p-8">
|
||||
<Footer links={socialLinks} />
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,54 +1,63 @@
|
|||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import { CircleCheck, CircleX, Croissant, Mail, UserRound } from 'lucide-svelte';
|
||||
import {
|
||||
CircleCheck,
|
||||
CircleX,
|
||||
Croissant,
|
||||
Mail,
|
||||
Send,
|
||||
TriangleAlert,
|
||||
UserRound
|
||||
} from 'lucide-svelte';
|
||||
import type { PageProps } from './$types';
|
||||
|
||||
let { form, data }: PageProps = $props();
|
||||
let { form }: PageProps = $props();
|
||||
</script>
|
||||
|
||||
<form class="w-full" id="contact" method="post" use:enhance>
|
||||
<div class="grid w-full max-w-xl grid-cols-2 gap-6">
|
||||
<div class="col-span-2 flex flex-col items-center">
|
||||
<span class="animate-bounce text-2xl">😁</span>
|
||||
<h2 class="text-2xl">Hello there friend</h2>
|
||||
</div>
|
||||
|
||||
<h3 class="col-span-2 text-xl">Reach out! 🤝</h3>
|
||||
|
||||
{#if form?.response.rejected.length ?? 0 > 0}
|
||||
<div role="alert" class="alert alert-error col-span-2">
|
||||
<form id="contact" method="post" use:enhance>
|
||||
<div class="mx-auto grid max-w-3xl grid-flow-col grid-cols-3 grid-rows-7 content-end gap-4 py-8">
|
||||
<div class="col-span-full">
|
||||
{#if form?.response?.rejected.length ?? 0 > 0}
|
||||
<div role="alert" class="alert alert-error w-full">
|
||||
<CircleX />
|
||||
<span>Ruh roh raggy!</span>
|
||||
</div>
|
||||
{:else if form?.response.accepted.length ?? 0 > 0}
|
||||
<div role="alert" class="alert alert-success col-span-2">
|
||||
{:else if form?.response?.accepted.length ?? 0 > 0}
|
||||
<div role="alert" class="alert alert-success w-full">
|
||||
<CircleCheck />
|
||||
<span>Your message has been sent successfully!</span>
|
||||
</div>
|
||||
{:else if form?.incorrect}
|
||||
<div role="alert" class="alert alert-warning w-full">
|
||||
<TriangleAlert />
|
||||
<span>Ruh roh raggy!</span>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="flex h-full flex-col gap-4">
|
||||
<label class="input input-bordered flex items-center gap-2">
|
||||
<h2 class="col-span-full text-3xl font-light">Reach out! 🤝</h2>
|
||||
|
||||
<label class="input input-bordered flex w-full items-center">
|
||||
<UserRound />
|
||||
<input name="name" type="text" class="grow" placeholder="Name" />
|
||||
<input name="name" type="text" class="grow" placeholder="Full Name" />
|
||||
</label>
|
||||
<label class="input input-bordered flex items-center gap-2">
|
||||
<label class="input input-bordered flex w-full items-center gap-2">
|
||||
<Mail />
|
||||
<input name="email" type="text" class="grow" placeholder="Your Email" />
|
||||
</label>
|
||||
<label class="input input-bordered flex items-center gap-2">
|
||||
<label class="input input-bordered flex w-full items-center gap-2">
|
||||
<Croissant />
|
||||
<input name="subject" type="text" class="grow" placeholder="Subject" />
|
||||
</label>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Send Message <Send size={20} /></button>
|
||||
|
||||
<div class="col-span-2 row-span-4">
|
||||
<textarea
|
||||
name="message"
|
||||
form="contact"
|
||||
class="textarea textarea-bordered h-full min-w-xl resize-none"
|
||||
class="textarea textarea-bordered h-full w-full resize-none"
|
||||
placeholder="Message"
|
||||
></textarea>
|
||||
|
||||
<button type="submit" class="btn btn-primary">Send Message</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue