69 lines
1.3 KiB
Svelte
69 lines
1.3 KiB
Svelte
|
<script lang="ts">
|
||
|
|
import Centered from "$lib/Centered.svelte";
|
||
|
|
import { getMe } from "$lib/globals.svelte";
|
||
|
|
import SLayout from "$lib/SLayout.svelte";
|
||
|
|
|
||
|
|
let me = getMe();
|
||
|
|
|
||
|
|
let content = $state("");
|
||
|
|
|
||
|
|
let contentLength = $derived(content.length);
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
|
||
|
|
{#if me}
|
||
|
|
<SLayout title="New post">
|
||
|
|
<form method="POST">
|
||
|
|
<p>Posting as <strong>@{me.username}</strong></p>
|
||
|
|
|
||
|
|
<label>
|
||
|
|
Post to: <!-- TODO autocomplete! -->
|
||
|
|
<input />
|
||
|
|
</label>
|
||
|
|
|
||
|
|
<label>
|
||
|
|
<input type="text" name="title" maxlength=256 placeholder="An interesting title"/>
|
||
|
|
</label>
|
||
|
|
|
||
|
|
<label>
|
||
|
|
<textarea bind:value={content}></textarea>
|
||
|
|
<output><small class="faint">{contentLength} chars</small></output>
|
||
|
|
</label>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
{#snippet left()}
|
||
|
|
...
|
||
|
|
{/snippet}
|
||
|
|
|
||
|
|
{#snippet right()}
|
||
|
|
...
|
||
|
|
{/snippet}
|
||
|
|
</SLayout>
|
||
|
|
{:else}
|
||
|
|
<Centered>
|
||
|
|
You must be <a href="login">logged in</a> in order to create posts.
|
||
|
|
</Centered>
|
||
|
|
{/if}
|
||
|
|
|
||
|
|
<style>
|
||
|
|
|
||
|
|
textarea {
|
||
|
|
width: 100%;
|
||
|
|
background-color: inherit;
|
||
|
|
color: var(--text-primary);
|
||
|
|
min-height: 10em;
|
||
|
|
margin-top: 4px;
|
||
|
|
}
|
||
|
|
|
||
|
|
form {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
input[name="title"] {
|
||
|
|
width: 100%;
|
||
|
|
margin: 6px 0;
|
||
|
|
font-size: 1.25em;
|
||
|
|
}
|
||
|
|
</style>
|