diff --git a/src/main/frontend/components/property.cljs b/src/main/frontend/components/property.cljs
index 7de91b277..11dd81d17 100644
--- a/src/main/frontend/components/property.cljs
+++ b/src/main/frontend/components/property.cljs
@@ -156,7 +156,7 @@
 
 (rum/defcs property-input < rum/reactive
   shortcut/disable-all-shortcuts
-  [state entity *property-key *property-value {:keys [class-schema? page-configure?]
+  [state entity *property-key *property-value {:keys [class-schema? page-configure? *configure-show?]
                                                :as opts}]
   (let [entity-properties (->> (keys (:block/properties entity))
                                (map #(:block/original-name (db/entity [:block/uuid %])))
@@ -188,7 +188,19 @@
                        :on-chosen (fn [{:keys [value]}]
                                     (reset! *property-key value)
                                     (add-property-from-dropdown entity value opts))
-                       :input-opts {:on-blur pv/exit-edit-property}})])))
+                       :input-opts {:on-blur (fn []
+                                               (when *configure-show?
+                                                 (reset! *configure-show? false))
+                                               (pv/exit-edit-property))
+                                    :on-key-down
+                                    (fn [e]
+                                      (case (util/ekey e)
+                                        "Escape"
+                                        (do
+                                          (when *configure-show?
+                                            (reset! *configure-show? false))
+                                          (pv/exit-edit-property))
+                                        nil))}})])))
 
 (rum/defcs new-property < rum/reactive
   (rum/local nil ::property-key)
diff --git a/src/main/frontend/components/property/value.cljs b/src/main/frontend/components/property/value.cljs
index 3d3c7d59b..33620c00a 100644
--- a/src/main/frontend/components/property/value.cljs
+++ b/src/main/frontend/components/property/value.cljs
@@ -53,30 +53,33 @@
                 (js/Date. (date/journal-title->long title))
                 value)
         value' (when-not (string/blank? value)
-                 (tc/to-local-date value))
-        open-modal! (fn []
-                      (state/set-modal!
-                       #(ui/datepicker value' {:on-change (fn [_e date]
-                                                            (let [repo (state/get-current-repo)
-                                                                  journal (date/js-date->journal-title date)]
-                                                              (when-not (db/entity [:block/name (util/page-name-sanity-lc journal)])
-                                                                (page-handler/create! journal {:redirect? false
-                                                                                               :create-first-block? false}))
-                                                              (when-let [page (db/entity [:block/name (util/page-name-sanity-lc journal)])]
-                                                                (property-handler/set-block-property! repo (:block/uuid block)
-                                                                                                      (:block/name property)
-                                                                                                      (:block/uuid page)))
-                                                              (exit-edit-property)
-                                                              (state/close-modal!)))})))]
-    [:a
-     {:tabIndex "0"
-      :on-click open-modal!
-      :on-key-down (fn [e]
-                     (when (= (util/ekey e) "Enter")
-                       (open-modal!)))}
-     [:span.inline-flex.items-center
-      (ui/icon "calendar")
-      [:span.ml-1 (or title "Pick a date")]]]))
+                 (tc/to-local-date value))]
+    (ui/dropdown
+     (fn [{:keys [toggle-fn]}]
+       [:a
+        {:tabIndex "0"
+         :on-click toggle-fn
+         :on-key-down (fn [e]
+                        (when (= (util/ekey e) "Enter")
+                          toggle-fn))}
+        [:span.inline-flex.items-center
+         (ui/icon "calendar")
+         [:span.ml-1 (or title "Pick a date")]]])
+     (fn [{:keys [toggle-fn]}]
+       (ui/datepicker value' {:on-change (fn [_e date]
+                                           (let [repo (state/get-current-repo)
+                                                 journal (date/js-date->journal-title date)]
+                                             (when-not (db/entity [:block/name (util/page-name-sanity-lc journal)])
+                                               (page-handler/create! journal {:redirect? false
+                                                                              :create-first-block? false}))
+                                             (when-let [page (db/entity [:block/name (util/page-name-sanity-lc journal)])]
+                                               (property-handler/set-block-property! repo (:block/uuid block)
+                                                                                     (:block/name property)
+                                                                                     (:block/uuid page)))
+                                             (exit-edit-property)
+                                             (toggle-fn)))}))
+     {:modal-class (util/hiccup->class
+                    "origin-top-right.absolute.left-0.rounded-md.shadow-lg.mt-2")})))
 
 (defn- select-page
   [block property opts]