unfinished compose box

src/routes/+layout.svelte

@@ -9,8 +9,12 @@
     import { get } from 'svelte/store';
 
     import Navigation from '$lib/ui/Navigation.svelte';
+    import Modal from '@cf/ui/Modal.svelte';
+    import Composer from '@cf/ui/Composer.svelte';
     import Widgets from '$lib/ui/Widgets.svelte';
 
+    let show_composer = false;
+
     async function init() {
         if (!get(app) || !get(app).token) {
             account.set(false);
@@ -40,9 +44,8 @@
 </script>
 
 <div id="app">
-
     <header>
-        <Navigation />
+        <Navigation on:compose={() => show_composer = true} />
     </header>
 
     <main>
@@ -59,6 +62,9 @@
         <Widgets />
     </div>
 
+    <Modal bind:visible={show_composer}>
+        <Composer/>
+    </Modal>
 </div>
 
 <style>

src/routes/+page.svelte

@@ -6,6 +6,7 @@
 
     import LoginForm from '$lib/ui/LoginForm.svelte';
     import Feed from '$lib/ui/Feed.svelte';
+  import Modal from '../lib/ui/Modal.svelte';
 
     logged_in.subscribe(logged_in => {
         if (logged_in) getTimeline();

src/routes/post/[id]/+page.svelte

@@ -113,6 +113,7 @@
         margin-right: 8px;
         display: flex;
         flex-direction: row;
+        align-items: center;
         gap: 8px;
     }