From ac884716f3ee31308ae6b67d8534bbd8d336417c Mon Sep 17 00:00:00 2001
From: Tienson Qin <tiensonqin@gmail.com>
Date: Sat, 25 Apr 2026 16:41:00 +0800
Subject: [PATCH] add hover effect

---
 src/main/frontend/components/block.css | 27 ++++++++++++++++++++++----
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/src/main/frontend/components/block.css b/src/main/frontend/components/block.css
index 4930819ce9..5107345a59 100644
--- a/src/main/frontend/components/block.css
+++ b/src/main/frontend/components/block.css
@@ -1072,8 +1072,18 @@ html.is-mac {
   .bottom-property-pill {
     @apply inline-flex items-center gap-1 rounded-full px-2 py-0.5 h-6 max-w-full text-base;
     background-color: var(--ls-secondary-background-color);
-    box-shadow: inset 0 0 0 1px var(--ls-border-color);
+    box-shadow: none;
     position: relative;
+    overflow: hidden;
+  }
+
+  .bottom-property-pill::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    border-radius: 9999px;
+    box-shadow: inset 0 0 0 1px var(--ls-border-color);
+    pointer-events: none;
   }
 
   .bottom-property-pill.bottom-property-pill-wrap {
@@ -1085,6 +1095,10 @@ html.is-mac {
 
   .bottom-property-pill-focusable:focus {
     outline: none;
+    box-shadow: none;
+  }
+
+  .bottom-property-pill-focusable:focus::after {
     box-shadow: inset 0 0 0 1px var(--ls-link-text-color);
   }
 
@@ -1108,6 +1122,11 @@ html.is-mac {
     @apply min-w-0;
   }
 
+  .bottom-property-content .property-value-inner[data-type="node"] .jtrigger:hover .page-ref,
+  .bottom-property-content .property-value-inner[data-type="node"] .jtrigger:focus-visible .page-ref {
+    color: var(--ls-link-text-hover-color);
+  }
+
   .bottom-property-pill .property-key-inner {
     @apply flex items-center min-w-0;
   }
@@ -1147,10 +1166,10 @@ html.is-mac {
     @apply inline-flex items-center justify-end pr-0 py-2 px-2 border-0 cursor-pointer opacity-0 pointer-events-none;
     position: absolute;
     right: -10px;
-    top: 0;
-    height: 100%;
+    top: 1px;
+    height: calc(100% - 2px);
     color: var(--ls-primary-text-color);
-    background: linear-gradient(to left, var(--ls-primary-background-color) 65%, transparent);
+    background: linear-gradient(to left, var(--ls-secondary-background-color) 65%, transparent);
   }
 
   .bottom-property-pill:hover .bottom-property-edit-icon,