Browse Source

enhance(ui): polish empty button

charlie 1 year ago
parent
commit
37a2fab944

+ 1 - 1
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]

+ 4 - 0
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;

+ 5 - 4
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?