simplified some UI code
This commit is contained in:
parent
45d57d5b96
commit
509a817065
|
@ -88,6 +88,8 @@
|
|||
});
|
||||
|
||||
let aria_label = post.user.username + '; ' + post.text + '; ' + post.created_at;
|
||||
|
||||
if (post.reply && post.reply.id === undefined) console.log(post);
|
||||
</script>
|
||||
|
||||
<div class="post-container">
|
||||
|
|
20
src/routes/+layout.svelte
Normal file
20
src/routes/+layout.svelte
Normal file
|
@ -0,0 +1,20 @@
|
|||
<script>
|
||||
import Navigation from '$lib/ui/Navigation.svelte';
|
||||
import Widgets from '$lib/ui/Widgets.svelte';
|
||||
</script>
|
||||
|
||||
<div id="spacesocial-app">
|
||||
|
||||
<header>
|
||||
<Navigation />
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<slot></slot>
|
||||
</main>
|
||||
|
||||
<div id="widgets">
|
||||
<Widgets />
|
||||
</div>
|
||||
|
||||
</div>
|
|
@ -64,18 +64,11 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<div id="spacesocial-app">
|
||||
|
||||
<header>
|
||||
<Navigation />
|
||||
</header>
|
||||
|
||||
<main>
|
||||
{#if logged_in === undefined}
|
||||
{#if logged_in === undefined}
|
||||
<div class="loading throb">
|
||||
<span>just a moment...</span>
|
||||
</div>
|
||||
{:else if logged_in === false}
|
||||
{:else if logged_in === false}
|
||||
<form on:submit={log_in} id="login-form">
|
||||
<img class="app-icon light-only" src={LogoLight} width="320px" aria-label="Space Social"/>
|
||||
<img class="app-icon dark-only" src={LogoDark} width="320px" aria-label="Space Social"/>
|
||||
|
@ -99,7 +92,7 @@
|
|||
|
||||
<p class="form-footer">made with ❤️ by <a href="https://arimelody.me">ari melody</a>, 2024</p>
|
||||
</form>
|
||||
{:else}
|
||||
{:else}
|
||||
<header>
|
||||
<h1>Home</h1>
|
||||
<nav>
|
||||
|
@ -110,14 +103,7 @@
|
|||
</header>
|
||||
|
||||
<Feed />
|
||||
{/if}
|
||||
</main>
|
||||
|
||||
<div id="widgets">
|
||||
<Widgets />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
form#login-form {
|
||||
|
@ -237,18 +223,18 @@
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
main header {
|
||||
header {
|
||||
width: 100%;
|
||||
margin: 16px 0 8px 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
main header h1 {
|
||||
header h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main header nav {
|
||||
header nav {
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
5
src/routes/post/+page.js
Normal file
5
src/routes/post/+page.js
Normal file
|
@ -0,0 +1,5 @@
|
|||
import { error } from '@sveltejs/kit';
|
||||
|
||||
export function load(event) {
|
||||
error(404, 'Not Found');
|
||||
}
|
|
@ -1,50 +0,0 @@
|
|||
<script>
|
||||
import Navigation from '$lib/ui/Navigation.svelte';
|
||||
import Widgets from '$lib/ui/Widgets.svelte';
|
||||
import Button from '$lib/ui/Button.svelte';
|
||||
</script>
|
||||
|
||||
<div id="spacesocial-app">
|
||||
|
||||
<header>
|
||||
<Navigation />
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<header>
|
||||
<h1>Home</h1>
|
||||
<nav>
|
||||
<Button centered active>Home</Button>
|
||||
<Button centered disabled>Local</Button>
|
||||
<Button centered disabled>Federated</Button>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<slot></slot>
|
||||
</main>
|
||||
|
||||
<div id="widgets">
|
||||
<Widgets />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<style>
|
||||
main header {
|
||||
width: 100%;
|
||||
margin: 16px 0 8px 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
main header h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main header nav {
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 8px;
|
||||
}
|
||||
</style>
|
|
@ -3,9 +3,6 @@ import { Client } from '$lib/client/client.js';
|
|||
import { parsePost } from '$lib/client/api.js';
|
||||
import { get } from 'svelte/store';
|
||||
|
||||
export const prerender = true;
|
||||
export const ssr = false;
|
||||
|
||||
export async function load({ params }) {
|
||||
let client = get(Client.get());
|
||||
if (client.app && client.app.token) {
|
||||
|
|
|
@ -1,12 +1,22 @@
|
|||
<script>
|
||||
import '$lib/app.css';
|
||||
import Post from '$lib/ui/post/Post.svelte';
|
||||
import Button from '$lib/ui/Button.svelte';
|
||||
|
||||
export let data;
|
||||
$: main_post = data.posts[0];
|
||||
$: replies = data.posts.slice(1);
|
||||
</script>
|
||||
|
||||
<header>
|
||||
<h1>Home</h1>
|
||||
<nav>
|
||||
<Button centered active>Home</Button>
|
||||
<Button centered disabled>Local</Button>
|
||||
<Button centered disabled>Federated</Button>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<div id="feed" role="feed">
|
||||
{#if data.posts.length <= 0}
|
||||
<div class="throb">
|
||||
|
@ -24,6 +34,24 @@
|
|||
</div>
|
||||
|
||||
<style>
|
||||
header {
|
||||
width: 100%;
|
||||
margin: 16px 0 8px 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
header nav {
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
#feed {
|
||||
margin-bottom: 20vh;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue