From 1a32b7e9b888301152a1ae58dae568c396cddb7e Mon Sep 17 00:00:00 2001
From: sevichecc <91365763+Sevichecc@users.noreply.github.com>
Date: Mon, 30 Jan 2023 17:28:52 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E2=99=BB=EF=B8=8F=20weaken=20the?=
 =?UTF-8?q?=20action=20buttons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/actions/1-comment.svelte   |  5 +++++
 src/lib/components/actions/1-reply.svelte     |  3 ---
 src/lib/components/actions/2-translate.svelte | 16 +++++++++-------
 src/lib/components/actions/3-share.svelte     | 16 +++++++++-------
 src/lib/components/post_action.svelte         |  2 +-
 5 files changed, 24 insertions(+), 18 deletions(-)
 create mode 100644 src/lib/components/actions/1-comment.svelte
 delete mode 100644 src/lib/components/actions/1-reply.svelte

diff --git a/src/lib/components/actions/1-comment.svelte b/src/lib/components/actions/1-comment.svelte
new file mode 100644
index 00000000..172b446a
--- /dev/null
+++ b/src/lib/components/actions/1-comment.svelte
@@ -0,0 +1,5 @@
+<button class="tooltip tooltip-left opacity-60 hover:opacity-100" data-tip="Jump to comments">
+  <a href="#post-comment" class="btn btn-circle btn-ghost hover:bg-red-10">
+    <span class="i-heroicons-outline-chat-alt-2" />
+  </a>
+</button>
diff --git a/src/lib/components/actions/1-reply.svelte b/src/lib/components/actions/1-reply.svelte
deleted file mode 100644
index 3303b258..00000000
--- a/src/lib/components/actions/1-reply.svelte
+++ /dev/null
@@ -1,3 +0,0 @@
-<a href="#post-comment" class="btn btn-lg btn-circle btn-ghost bg-base-100 shadow-lg hover:shadow-xl">
-  <span class="i-heroicons-outline-chat-alt-2" />
-</a>
diff --git a/src/lib/components/actions/2-translate.svelte b/src/lib/components/actions/2-translate.svelte
index d44617c8..7e3ebb94 100644
--- a/src/lib/components/actions/2-translate.svelte
+++ b/src/lib/components/actions/2-translate.svelte
@@ -3,10 +3,12 @@
   export let post: Urara.Post
 </script>
 
-<a
-  href={`https://translate.google.com/translate?sl=auto&tl=${
-    navigator.languages ? navigator.languages[0] : navigator.language
-  }&u=${site.protocol + site.domain + post.path}`}
-  class="btn btn-lg btn-circle btn-ghost bg-base-100 shadow-lg hover:shadow-xl">
-  <span class="i-heroicons-outline-translate" />
-</a>
+<button class="tooltip tooltip-left opacity-60 hover:opacity-100" data-tip="Translate">
+  <a
+    href={`https://translate.google.com/translate?sl=auto&tl=${
+      navigator.languages ? navigator.languages[0] : navigator.language
+    }&u=${site.protocol + site.domain + post.path}`}
+    class="btn btn-circle btn-ghost">
+    <span class="i-heroicons-outline-translate" />
+  </a>
+</button>
diff --git a/src/lib/components/actions/3-share.svelte b/src/lib/components/actions/3-share.svelte
index a01c41c4..c34e19fa 100644
--- a/src/lib/components/actions/3-share.svelte
+++ b/src/lib/components/actions/3-share.svelte
@@ -3,10 +3,12 @@
   export let post: Urara.Post
 </script>
 
-<a
-  href={`https://www.addtoany.com/share#url=${site.protocol + site.domain + post.path}&title=${encodeURI(
-    post.title ?? post.path.slice(1)
-  )}`}
-  class="btn btn-lg btn-circle btn-ghost bg-base-100 shadow-lg hover:shadow-xl">
-  <span class="i-heroicons-outline-share" />
-</a>
+<button class="tooltip tooltip-left opacity-60 hover:opacity-100" data-tip="Share">
+  <a
+    href={`https://www.addtoany.com/share#url=${site.protocol + site.domain + post.path}&title=${encodeURI(
+      post.title ?? post.path.slice(1)
+    )}`}
+    class="btn btn-circle btn-ghost">
+    <span class="i-heroicons-outline-share" />
+  </a>
+</button>
diff --git a/src/lib/components/post_action.svelte b/src/lib/components/post_action.svelte
index 4c98b178..4bd8a452 100644
--- a/src/lib/components/post_action.svelte
+++ b/src/lib/components/post_action.svelte
@@ -3,7 +3,7 @@
   const actions = import.meta.glob<any>('/src/lib/components/actions/*.svelte', { eager: true, import: 'default' })
 </script>
 
-<div class="sticky top-24 hidden xl:flex flex-col gap-4 w-fit h-[calc(100vh-12rem)] ml-auto mr-8 my-8 justify-center">
+<div class="sticky top-24 hidden xl:flex flex-col gap-4 w-fit max-h-[calc(100vh-12rem)]  ml-auto mr-6 my-8 justify-center ">
   {#if Object.keys(actions).length}
     {#each Object.values(actions) as action}
       <svelte:component this={action} {post} />