diff --git a/src/main/frontend/components/page.cljs b/src/main/frontend/components/page.cljs index e4ca4349eb..58f875bfe0 100644 --- a/src/main/frontend/components/page.cljs +++ b/src/main/frontend/components/page.cljs @@ -420,7 +420,7 @@ :selected (= class id)}) classes)) options (cons (if class - {:label "Choose parent page" + {:label "Choose parent class" :value ""} {:label "Choose parent page" :disabled true @@ -449,10 +449,10 @@ opts) class? (= type "class")] (when page - [:div.property-configure.grid.gap-1.p-1 + [:div.property-configure.grid.gap-2.p-1 (when-not journal? [:div.grid.grid-cols-4.gap-1 - [:div.col-span-1 "Class page?"] + [:div.col-span-1 "Is it a class?"] [:div.col-span-3 (ui/checkbox {:checked class? :on-change (fn [] @@ -463,7 +463,7 @@ (when class? [:div.grid.grid-cols-4.gap-1.items-center.class-parent - [:div.col-span-1 "Parent:"] + [:div.col-span-1 "Parent class:"] [:div.col-span-3 (let [namespace (some-> (:db/id (:block/namespace page)) db/entity @@ -478,11 +478,13 @@ [[:db.fn/retractAttribute (:db/id page) :block/namespace]]))))])]]) (let [edit-input-id (str "edit-block-" (:block/uuid page))] - (component-block/db-properties-cp - {:editor-box editor/box} - page - edit-input-id - (assoc properties-opts :class-schema? class?)))]))) + [:div + [:div.text-sm.opacity-70.font-medium.mb-2 "Properties:"] + (component-block/db-properties-cp + {:editor-box editor/box} + page + edit-input-id + (assoc properties-opts :class-schema? class?))])]))) ;; A page is just a logical block (rum/defcs ^:large-vars/cleanup-todo page-inner < rum/reactive diff --git a/src/main/frontend/components/property.cljs b/src/main/frontend/components/property.cljs index b95eb94735..2783f02b93 100644 --- a/src/main/frontend/components/property.cljs +++ b/src/main/frontend/components/property.cljs @@ -263,30 +263,31 @@ :node (js/document.getElementById "edit-new-property") :outside? false))) [state block edit-input-id properties new-property? opts] - (let [*property-key (::property-key state) - *property-value (::property-value state)] - (cond - new-property? - [:div#edit-new-property - (property-input block *property-key *property-value opts)] + [:div.py-1 + (let [*property-key (::property-key state) + *property-value (::property-value state)] + (cond + new-property? + [:div#edit-new-property + (property-input block *property-key *property-value opts)] - (and (or (:page-configure? opts) - (seq properties) - (seq (:block/alias block)) - (seq (:block/tags block))) - (not config/publishing?) - (or (:page-configure? opts) (not (:in-block-container? opts)))) - [:a.fade-link.my-2.flex - {:on-click (fn [] - (property-handler/set-editing-new-property! edit-input-id) - (reset! *property-key nil) - (reset! *property-value nil))} - [:div.flex.flex-row.items-center - (ui/icon "circle-plus" {:size 16}) - [:div.ml-1 "Add property"]]] + (and (or (:page-configure? opts) + (seq properties) + (seq (:block/alias block)) + (seq (:block/tags block))) + (not config/publishing?) + (or (:page-configure? opts) (not (:in-block-container? opts)))) + [:a.fade-link.flex + {:on-click (fn [] + (property-handler/set-editing-new-property! edit-input-id) + (reset! *property-key nil) + (reset! *property-value nil))} + [:div.flex.flex-row.items-center + (ui/icon "circle-plus" {:size 15}) + [:div.ml-1.text-sm "Add property"]]] - :else - [:div {:style {:height 28}}]))) + :else + [:div {:style {:height 28}}]))]) (rum/defcs property-key [state block property {:keys [class-schema?]}] @@ -368,10 +369,12 @@ (when-let [property (db/sub-block (:db/id (db/entity [:block/uuid k])))] (let [block? (= :block (get-in property [:block/schema :type]))] [:div.property-pair (cond-> {} (not block?) (assoc :class "items-center")) - [:div.property-key.col-span-1 + [:div.property-key + {:class (if (:class-schema? opts) "col-span-2" "col-span-1")} (property-key block property (select-keys opts [:class-schema?]))] (if (:class-schema? opts) - [:div.property-description.col-span-3.font-light + [:div.property-description.text-sm.opacity-70 + {:class (if (:class-schema? opts) "col-span-2" "col-span-3")} (get-in property [:block/schema :description])] [:div.property-value.col-span-3.inline-grid.pl-6 (when block? {:style {:margin-left -20}})