added button like and dislike

src/components/DislikeCollab.svelte

@@ -0,0 +1,50 @@
+<script>
+    import IconCollab from '../components/IconCollab.svelte'
+	let dislikes = 0
+
+    function handleClick() {
+        dislikes += 1;
+    }
+</script>
+
+<style>
+    .dislike-button {
+        height: 40px;
+        width: 100px;
+        border-radius: 20px;
+        border: none;
+        cursor: pointer;
+        padding: 5px 15px;
+        background: rgb(255, 252, 238, 0.1);
+        margin: 20px 0 20px 16px;
+    }
+
+    .dislike-button:last-child {
+        margin: 20px 0 0 5px;
+    }
+
+    .dislike-button > .items {
+        display: flex;
+        justify-content: space-evenly;
+        align-items: center;
+    }
+
+    .dislike-button > .items > .text {
+        color: #FFF;
+        font-size: 16px;
+        line-height: 24px;
+        letter-spacing: 0.5px;
+        font-family: Comfortaa;
+    }
+</style>
+
+<button 
+    on:click={handleClick} 
+    class="dislike-button"> 
+    <div class="items">
+        <IconCollab
+        name="dislike_button"
+        alt="Dislike Button" />
+        <p class="text">{dislikes}</p>
+    </div>
+</button>

src/components/LikeCollab.svelte

@@ -0,0 +1,46 @@
+<script>
+    import IconCollab from '../components/IconCollab.svelte'
+	let likes = 0
+
+    function handleClick() {
+        likes += 1;
+    }
+</script>
+
+<style>
+    .like-button {
+        height: 40px;
+        width: 100px;
+        border-radius: 20px;
+        border: none;
+        cursor: pointer;
+        padding: 5px 15px;
+        background: rgb(255, 252, 238, 0.1);
+        margin: 20px 0 20px 16px;
+    }
+
+    .like-button > .items {
+        display: flex;
+        justify-content: space-evenly;
+        align-items: center;
+    }
+
+    .like-button > .items > .text {
+        color: #FFF;
+        font-size: 16px;
+        line-height: 24px;
+        letter-spacing: 0.5px;
+        font-family: Comfortaa;
+    }
+</style>
+
+<button 
+    on:click={handleClick}
+    class="like-button"> 
+    <div class="items">
+        <IconCollab
+        name="like_button"
+        alt="Like Button" />
+        <p class="text">{likes}</p>
+    </div>
+</button>

src/routes/_layout.svelte

@@ -1,5 +1,7 @@
 <script>
   import HeaderCollab from '../containers/HeaderCollab.svelte'
+  import LikeCollab from '../components/LikeCollab.svelte'
+  import DislikeCollab from '../components/DislikeCollab.svelte'
 
   export let segment
 </script>
@@ -12,4 +14,6 @@
 
 <main>
   <slot />
+  <LikeCollab />
+  <DislikeCollab />
 </main>