From 37a2fab94428ebaea22cf0eece41824f94125ec0 Mon Sep 17 00:00:00 2001
From: charlie <xyhp915@qq.com>
Date: Mon, 18 Mar 2024 11:23:57 +0800
Subject: [PATCH] enhance(ui): polish empty button

---
 src/main/frontend/components/property.cljs       | 2 +-
 src/main/frontend/components/property.css        | 4 ++++
 src/main/frontend/components/property/value.cljs | 9 +++++----
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/main/frontend/components/property.cljs b/src/main/frontend/components/property.cljs
index 5d6abe54c..00327bacc 100644
--- a/src/main/frontend/components/property.cljs
+++ b/src/main/frontend/components/property.cljs
@@ -104,7 +104,7 @@
             (when-let [page (db/entity [:block/uuid class])]
               (let [page-name (:block/original-name page)]
                 [:a.text-sm (str "#" page-name)]))))]
-       [:div.opacity-50.pointer.text-sm "Empty"])])])
+       [:div.opacity-50.pointer.text-sm.cursor-pointer "Empty"])])])
 
 (defn- property-type-label
   [property-type]
diff --git a/src/main/frontend/components/property.css b/src/main/frontend/components/property.css
index 6c640b7c5..995fa99b7 100644
--- a/src/main/frontend/components/property.css
+++ b/src/main/frontend/components/property.css
@@ -138,6 +138,10 @@
     }
 }
 
+.ui__button.empty-btn {
+    @apply !h-7 !px-0 font-normal opacity-50;
+}
+
 .closed-values-properties {
     .select-item {
         @apply flex items-center;
diff --git a/src/main/frontend/components/property/value.cljs b/src/main/frontend/components/property/value.cljs
index 02cbd4c7f..5458b0d41 100644
--- a/src/main/frontend/components/property/value.cljs
+++ b/src/main/frontend/components/property/value.cljs
@@ -610,7 +610,7 @@
                         (do (set-open! true) (util/stop e))
                         :dune))}
        (if (string/blank? value)
-         [:div.opacity-50.pointer.text-sm "Empty"]
+         [:div.opacity-50.pointer.text-sm.cursor-pointer "Empty"]
          (value-f)))
       (shui/dropdown-menu-content
         {:align "start"
@@ -711,7 +711,7 @@
                                     (util/stop e)
                                     (<create-new-block-from-template! block property template))}
                        (str "Use template #" (:block/original-name template))]))
-                  [:div.opacity-50.pointer.text-sm "Empty"])
+                  [:div.opacity-50.pointer.text-sm.cursor-pointer "Empty"])
                 (case type
                   :template
                   (property-template-value {:editor-id editor-id}
@@ -738,7 +738,8 @@
                          (select-item property type item opts))
                        (when date?
                          [(property-value-date-picker block property nil {:toggle-fn toggle-fn})]))
-                      (when-not editing? [:div.opacity-50.pointer.text-sm "Empty"])))
+                      (when-not editing?
+                        (shui/button {:class "empty-btn" :variant :text} "Empty"))))
         select-cp (fn [select-opts]
                     (let [select-opts (merge {:multiple-choices? true
                                               :dropdown? editing?
@@ -795,7 +796,7 @@
           editor-args {:block property
                        :parent-block block
                        :format :markdown}]
-      [:div.property-value-inner
+      [:div.property-value-inner.w-full
        {:data-type type}
        (cond
          multiple-values?