Got the blog submission working initially, no tags yet.

I also have it displaying on the blog pages
This commit is contained in:
2025-06-29 21:07:05 -05:00
parent 72367b30d2
commit 0f05b5fea7
4 changed files with 104 additions and 29 deletions
+53 -11
View File
@@ -1,22 +1,64 @@
<script lang="javascript">
let {data} = $props()
let {post} = data
$inspect('bu', data)
let { data } = $props();
let { post } = data;
import { marked } from "marked";
$inspect("bu", data);
</script>
<svelte:head>
<title>{post.title}</title>
<meta name="description" content="" />
<title>{post.title}</title>
<meta name="description" content="" />
</svelte:head>
<section>
<h1>{post.title}</h1>
{@html post.body}
<span>{post.created_at}</span>
<h1>{post.title}</h1>
{@html marked.parse(post.body)}
<span
>Created @ {new Date(post.created_at).toLocaleString("en-US", {
timeZone: "-10:00", // This is wrong for some reason the SQLite db is recording the wrong time
hour12: false,
})}</span
>
</section>
<style lang="scss">
section {
@use "/src/app.scss" as *;
section {
display: flex;
flex-direction: column;
gap: 1rem;
max-width: 60rem;
margin: 0 auto;
:global(h1) {
:global(strong) {
font-family: "Initials";
font-size: 1.5rem;
font-weight: 500;
}
text-align: center;
}
:global(hr) {
color: $green;
}
:global(blockquote) {
background: $green-42;
border-left: 1rem solid $green;
padding: 0.5rem 1rem;
&:before {
color: $orange;
content: open-quote;
font-size: 1.5rem;
line-height: 0.1rem;
vertical-align: -0.9rem;
}
&:p {
display: inline;
}
}
span {
align-self: center;
font-size: 0.75rem;
}
}
</style>
}
</style>
+5
View File
@@ -1,9 +1,14 @@
export async function load({ }) {
console.log("new blag")
}
import { publish_blog } from "$lib/db"
export const actions = {
default: async ({ cookies, fetch, getClientAddress, locals, params, platform, request, route, setHeaders, url, isDataRequest }) => {
let data = await request.formData();
console.log(data);
console.log(publish_blog(data.get('title'), data.get('uri'), data.get('body')))
}
}
+32 -12
View File
@@ -18,7 +18,7 @@ Regular; hmm double enter gets a new
> It will only line over on width basis I guess that makes sense
`);
$inspect("n", value);
// $inspect("n", value);
</script>
<svelte:head>
@@ -30,14 +30,16 @@ Regular; hmm double enter gets a new
<div>
<h1>Editor</h1>
<form method="POST">
<label>
<p>Title</p>
<input type="text" name="title" />
</label>
<label>
<p>URI</p>
<input type="text" name="uri" />
</label>
<div>
<label>
<p>Title</p>
<input required type="text" name="title" />
</label>
<label>
<p>URI</p>
<input required type="text" name="uri" />
</label>
</div>
<textarea name="body" bind:value></textarea>
<button>Post</button>
</form>
@@ -52,6 +54,7 @@ Regular; hmm double enter gets a new
<style lang="scss">
@use "/src/app.scss" as *;
section {
width: 100%;
display: flex;
@@ -60,9 +63,15 @@ Regular; hmm double enter gets a new
flex-basis: 45%;
margin: 0 auto;
form {
display: flex;
flex-direction: column;
div {
gap: 1rem;
display: flex;
}
label {
display: flex;
margin-top: 1rem;
margin: 1rem 0;
gap: 1rem;
input {
background: $green-42;
@@ -79,11 +88,23 @@ Regular; hmm double enter gets a new
width: 100%;
height: 40rem;
line-height: 1.5;
border-radius: 5px;
border: 1px solid $green;
border-radius: 5px;
background: $green-42;
color: $yellow;
font-family: "Garamond";
&:focus-visible {
outline: none;
}
}
button {
padding: 0.25rem 0.75rem;
margin-top: 1rem;
background-color: $green-42;
color: $yellow;
border: solid 3px $green;
border-radius: 5px;
align-self: center;
}
}
}
@@ -118,4 +139,3 @@ Regular; hmm double enter gets a new
}
}
</style>