fix: messed up redirects for http urls

src/lib/app/i18n/en.json

···
             "title": "Removing Submission",
             "titleRestore": "Restoring Submission",
             "titlePurge": "Purging Submission",
-            "withReason": "Notify user",
+            "withReason": "Notify author",
             "comment": "Comment",
             "message": "Message",
             "failReply": "Failed to post reply. Removing anyway...",
             "failMessage": "Failed to message user. Removing anyway...",
-            "failEmptyReply": "Your reply cannot be empty if 'Notify user' is enabled.",
+            "failEmptyReply": "Your reply cannot be empty if 'Notify author' is enabled.",
             "successPurge": "Successfully purged that submission."
         },
         "reportModal": {

src/lib/feature/comment/CommentVote.svelte

···
   import { t } from '$lib/app/i18n'
   import { settings } from '$lib/app/settings.svelte'
   import FormattedNumber from '$lib/ui/util/FormattedNumber.svelte'
-  import { buttonColor, toast } from 'mono-svelte'
+  import { toast } from 'mono-svelte'
   import { ChevronDown, ChevronUp, Icon } from 'svelte-hero-icons/dist'
   import { backOut } from 'svelte/easing'
   import { fly } from 'svelte/transition'
···
   <button
     onclick={() => castVote(vote == targetNum ? 0 : targetNum)}
     class={[
-      'flex items-center gap-0.5 transition-colors relative cursor-pointer h-full p-1.5',
+      'flex items-center gap-0.5 transition-colors relative cursor-pointer px-1.5 py-1',
       'first:rounded-l-3xl last:rounded-r-3xl',
       'last:flex-row-reverse',
       vote == targetNum
···
 
 <div
   class={[
-    'h-full relative flex items-center overflow-hidden rounded-full hover:bg-transparent font-medium hover:dark:bg-transparent',
-    buttonColor.ghost,
+    'h-full relative flex items-center overflow-hidden rounded-full font-medium',
     voteRatio < 85 && settings.voteRatioBar && 'vote-ratio',
+    'divide-x divide-slate-200 dark:divide-zinc-800 border border-slate-200 dark:border-zinc-800',
   ]}
   style="--vote-ratio: {voteRatio}%;"
 >
   {@render voteButton(upvotes, 'upvote', vote)}
-  <div class="h-full p-0! border-l border-slate-200 dark:border-zinc-800"></div>
   {#if site.data?.site_view.local_site.enable_downvotes ?? true}
     {@render voteButton(downvotes, 'downvote', vote)}
   {/if}

src/lib/ui/layout/CommonList.svelte

···
     items,
     item: itemSnippet,
     children,
-    animate = false,
+    animate = true,
     size = 'sm',
     class: clazz,
     selected,

src/lib/ui/shared/materials/Material.svelte

···
     default:
       'bg-white dark:bg-zinc-900 border border-slate-200 dark:border-zinc-800 border-b-slate-300 dark:border-t-zinc-700',
     distinct:
-      'bg-white dark:bg-zinc-900 border border-slate-200 dark:border-zinc-800 border-b-slate-300 dark:border-t-zinc-700',
+      'bg-white dark:bg-zinc-925 border border-slate-200 dark:border-zinc-900 border-b-slate-300 dark:border-t-zinc-800',
     transparent:
       'border border-slate-200 dark:border-zinc-900 border-b-slate-300 dark:border-t-zinc-800',
     uniform:

src/routes/comment/[instance]/+page.ts

···
   redirect(
     302,
     resolveRoute('/comment/[instance]/[id]', {
-      instance: instance.data.toLowerCase(),
+      instance: encodeURIComponent(instance.data.toLowerCase()),
       id: params.instance,
     }),
   )

src/routes/comment/[instance]/[id]/+page.ts

···
     resolveRoute(
       `/post/[instance]/[id]?thread=${threadPath}#${comment.comment_view.comment.id}`,
       {
-        instance: params.instance,
+        instance: encodeURIComponent(params.instance),
         id: comment.comment_view.post.id.toString(),
       },
     ),

src/routes/moderation/+page.svelte

···
 {/if}
 {#if data.items?.value && data.items?.value.length > 0}
   <CommonList items={data.items?.value} size="lg">
-    {#snippet item(item)}
-      <Material
-        rounding={item.length == 1 ? 'none' : '2xl'}
-        color={item.length == 1 ? 'none' : 'uniform'}
-        padding={item.length == 1 ? 'none' : 'md'}
-        class={['space-y-2 w-full']}
+    {#each data.items.value ?? [] as item}
+      <svelte:element
+        this={item.length == 1 ? 'li' : 'div'}
+        class="z-0 relative"
       >
-        <Report {item} />
-      </Material>
-      {#if item.length > 1}
         <Material
-          padding="none"
-          rounding="none"
-          color="uniform"
-          class="-mt-3 rounded-b-2xl w-[95%] h-4 bg-slate-50! dark:bg-zinc-950!"
-        ></Material>
-      {/if}
-    {/snippet}
+          rounding={item.length == 1 ? 'none' : '2xl'}
+          color={item.length == 1 ? 'none' : 'distinct'}
+          padding={item.length == 1 ? 'none' : 'md'}
+          class={['space-y-2 w-full z-10 relative']}
+        >
+          <Report {item} />
+        </Material>
+        {#if item.length > 1}
+          <Material
+            padding="none"
+            rounding="none"
+            color="uniform"
+            class="-mt-1 rounded-b-2xl w-[97%] h-6 opacity-70 left-1/2 -translate-x-1/2 -z-10 relative"
+          ></Material>
+        {/if}
+      </svelte:element>
+    {/each}
   </CommonList>
   <Fixate placement="bottom">
     <Pageination