UI improvements

2023-04-01 20:05:52 +02:00
parent df6f2befeb
commit 963bcbf889
4 changed files with 83 additions and 15 deletions
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@ -35,7 +35,37 @@ onMount(async () => {
  }
 })
 </script>
+<h2>Metalhead.club music list</h2>
+<div class="wrapper">
+  <div></div>
+  <div class="posts">
+  {#if data.posts.length === 0}
+    Sorry, no posts recommending music aave been found yet
+  {/if}
+  {#each data.posts as post (post.id)}
+      <div class="post"><PostComponent {post} /></div>
+  {/each}
+  </div>
+  <div></div>
+  </div>
+<style>
+  .posts {
+    display: flex;
+    flex-direction: column;
+  }
+  .post {
+    width: 100%;
+    max-width: 600px;
+    margin-bottom: 1em;
+    border-bottom: 1px solid var(--color-border);
+    padding: 1em;
+  }
+  .wrapper {
+    display: flex;
+    justify-content: space-between;
+  }

-{#each data.posts as post (post.id)}
-  <PostComponent {post}></PostComponent>
-{/each}
+  h2 {
+    text-align: center;
+  }
+</style>