From 3bc325810ebd1a448ad2e3943ab9fb064258cefb Mon Sep 17 00:00:00 2001
From: Xyphyn <james@xylight.dev>
Date: Thu, 28 Sep 2023 17:46:41 -0700
Subject: [PATCH] upgrade: mono-svelte 0.3.8 -> 0.4.1

---
 package.json                                  |  2 +-
 src/lib/components/lemmy/post/PostMeta.svelte |  4 +--
 .../post/[instance]/[id=integer]/+page.svelte | 35 +++++++++++++------
 yarn.lock                                     |  8 ++---
 4 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/package.json b/package.json
index f60a97ac..94fa7b54 100644
--- a/package.json
+++ b/package.json
@@ -44,7 +44,7 @@
     "@dicebear/core": "^6.0.4",
     "@dicebear/initials": "^6.0.4",
     "markdown-it": "^13.0.1",
-    "mono-svelte": "^0.3.7"
+    "mono-svelte": "^0.4.1"
   },
   "type": "module"
 }
diff --git a/src/lib/components/lemmy/post/PostMeta.svelte b/src/lib/components/lemmy/post/PostMeta.svelte
index cf4bde0c..e5fc3091 100644
--- a/src/lib/components/lemmy/post/PostMeta.svelte
+++ b/src/lib/components/lemmy/post/PostMeta.svelte
@@ -116,7 +116,7 @@
         </Badge>
       {/if}
       {#if removed}
-        <Badge label="Removed" color="red">
+        <Badge label="Removed" color="red-subtle">
           <Icon src={Trash} mini size="14" />
           <span class="max-md:hidden">Removed</span>
         </Badge>
@@ -128,7 +128,7 @@
         </Badge>
       {/if}
       {#if featured}
-        <Badge label="Featured" color="green">
+        <Badge label="Featured" color="green-subtle">
           <Icon src={Megaphone} mini size="14" />
           <span class="max-md:hidden">Featured</span>
         </Badge>
diff --git a/src/routes/post/[instance]/[id=integer]/+page.svelte b/src/routes/post/[instance]/[id=integer]/+page.svelte
index 3a567140..55854b05 100644
--- a/src/routes/post/[instance]/[id=integer]/+page.svelte
+++ b/src/routes/post/[instance]/[id=integer]/+page.svelte
@@ -18,7 +18,14 @@
   } from 'svelte-hero-icons'
   import PostLink from '$lib/components/lemmy/post/PostLink.svelte'
   import PostMeta from '$lib/components/lemmy/post/PostMeta.svelte'
-  import { Badge, Material, Spinner, removeToast, toast } from 'mono-svelte'
+  import {
+    Badge,
+    Material,
+    Select,
+    Spinner,
+    removeToast,
+    toast,
+  } from 'mono-svelte'
   import type { CommentSortType } from 'lemmy-js-client'
   import MultiSelect from '$lib/components/input/Switch.svelte'
   import { profile } from '$lib/auth.js'
@@ -262,17 +269,25 @@
 <div class="mt-4 flex flex-col gap-2 w-full">
   <div class="flex flex-row justify-between flex-wrap gap-2">
     <div class="font-bold opacity-80 text-base flex items-center gap-2">
-      Comments <Badge color="gray" class="!text-sm">
+      Comments <Badge
+        color="blue-subtle"
+        class="min-w-[1rem] justify-center !font-bold"
+      >
         <FormattedNumber number={post.post_view.counts.comments} />
       </Badge>
     </div>
-    <div class="gap-2 flex">
-      <MultiSelect
-        options={['Hot', 'Top', 'New']}
-        bind:selected={commentSort}
-        on:select={reloadComments}
-        headless
-      />
+    <div class="gap-2 flex items-center h-8">
+      <Select
+        size="sm"
+        class="!h-full"
+        bind:value={commentSort}
+        on:change={reloadComments}
+      >
+        <option value="Hot">Hot</option>
+        <option value="Top">Top</option>
+        <option value="New">New</option>
+        <option value="Old">Old</option>
+      </Select>
       <Button size="square-md" on:click={reloadComments}>
         <Icon src={ArrowPath} size="16" mini slot="prefix" />
       </Button>
@@ -298,9 +313,9 @@
       {:else}
         <Button
           on:click={() => (showCreateComment = !showCreateComment)}
-          class="w-max"
           size="lg"
           rounding="lg"
+          color="tertiary"
         >
           <Icon src={Plus} size="16" mini slot="prefix" />
           Add a comment
diff --git a/yarn.lock b/yarn.lock
index 48fec4d8..987b4c04 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3023,10 +3023,10 @@ mlly@^1.2.0, mlly@^1.4.0:
     pkg-types "^1.0.3"
     ufo "^1.1.2"
 
-mono-svelte@^0.3.7:
-  version "0.3.7"
-  resolved "https://registry.yarnpkg.com/mono-svelte/-/mono-svelte-0.3.7.tgz#d8100ca072699d672fb951dc33cb9d9f9fb2b60f"
-  integrity sha512-hgxFt7JhaX+jLIQNpbi29XJZ5yuYk3kyCX6sEBsUppxcrT/xqN7ajAm8uXaHg/kSORoiIBR38iHftEMMbeaxgA==
+mono-svelte@^0.4.1:
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/mono-svelte/-/mono-svelte-0.4.1.tgz#9237b92aaec435db315967851df651d1650a1936"
+  integrity sha512-yzDxdQaSJroiL6Yt3qnOIM8thI0d4IB3uOOG0dp/oBemiTtyOBY7niJcXhF0zkU0X/LmarBWYNI8Rs139N2NHw==
   dependencies:
     svelte-focus-trap "^1.2.0"
     svelte-hero-icons "^5.0.0"