compact buttons

src/lib/components/Button.svelte

@@ -1,13 +1,15 @@
 <style>
     .button {
-        padding: 0.5rem;
+        padding: 0.35rem;
         border: none;
         border-bottom: solid var(--dark-3) 3px;
         box-shadow: 0px 3px 5px 3px rgba(0,0,0,0.1);
 
         font-family: 'Open Sans';
 
-        margin-right: 0.2rem;
+        margin: 0.2rem;
+        margin-top: 0.5rem;
+        margin-bottom: 0rem;
     }
 
     .button a {

src/lib/components/PostList.svelte

@@ -6,21 +6,21 @@
     export let data, noRatings = false;
 </script>
 
-<p>
+<span>
     {#if !noRatings}
         <Button clickFunc={() => { window.location.search = setLocation(window.location,'sort','hot')}}>Hot</Button>
         <Button clickFunc={() => { window.location.search = setLocation(window.location,'sort','rating')}}>Top</Button>
         <Button clickFunc={() => { window.location.search = setLocation(window.location,'sort','time')}}>Recent</Button>
     {/if}
-</p>
+</span>
 
-<p>
+<span>
     {#if data.id > 0}
         <Button clickFunc={() => { window.location.search = setLocation(window.location,'page',((data.id)-1)) }} href='#'>Page {(data.id)-1}</Button>
     {/if}
     <Button>Page {(data.id)}</Button>
     <Button clickFunc={() => { window.location.search = setLocation(window.location,'page',((data.id)+1)) }} href='#'>Page {(data.id)+1}</Button>
-</p>
+</span>
 
 {#if data && data.postJson && data.postJson.data}
     {#each data.postJson.data as post}

src/routes/+page.svelte

@@ -7,9 +7,9 @@
     export let data;
 </script>
 
-<p>
+<span>
     <Button clickFunc={() => { window.location.search = setLocation(window.location,'type',('all')) }}>All users</Button>
     <Button clickFunc={() => { window.location.search = setLocation(window.location,'type',('follow')) }}>Following only</Button>
-</p>
+</span>
 
 <PostList data={data} />