diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/frontend/tubo/modals/events.cljs | 12 | ||||
-rw-r--r-- | src/frontend/tubo/modals/views.cljs | 13 | ||||
-rw-r--r-- | src/frontend/tubo/views.cljs | 3 |
3 files changed, 18 insertions, 10 deletions
diff --git a/src/frontend/tubo/modals/events.cljs b/src/frontend/tubo/modals/events.cljs index 971fcac..d947ce8 100644 --- a/src/frontend/tubo/modals/events.cljs +++ b/src/frontend/tubo/modals/events.cljs @@ -32,12 +32,20 @@ [:modals/delete (-> (:modals db) last - :id)]]] + :id)]] + (when (<= (count (:modals db)) 1) + [:dispatch + [:layout/hide-bg-overlay]])] :body-overflow false})) (rf/reg-event-fx :modals/open (fn [_ [_ child]] {:fx [[:dispatch - [:modals/add {:show? true :child child :id (nano-id)}]]] + [:modals/add {:show? true :child child :id (nano-id)}]] + [:dispatch + [:layout/show-bg-overlay + {:extra-classes ["z-30"] + :on-click #(rf/dispatch [:modals/close])} + true]]] :body-overflow true})) diff --git a/src/frontend/tubo/modals/views.cljs b/src/frontend/tubo/modals/views.cljs index 69ccd85..af05fce 100644 --- a/src/frontend/tubo/modals/views.cljs +++ b/src/frontend/tubo/modals/views.cljs @@ -17,15 +17,14 @@ [layout/primary-button "Ok" #(rf/dispatch [:modals/close])])]]) (defn modal-panel - [{:keys [child show?]}] - [:div.fixed.flex.flex-col.items-center.justify-center.w-full.z-30.top-0 - {:class ["min-h-[100dvh]" "h-[100dvh]"]} - [layout/focus-overlay #(rf/dispatch [:modals/close]) show?] - [:div.flex.items-center.justify-center.flex-auto.shrink-0.w-full.max-h-full.p-5 - {:class ["sm:w-3/4" "md:w-3/5" "lg:w-1/2" "xl:w-1/3"]} + [{:keys [child]}] + [:div.fixed.z-30.flex.flex-col.items-center.justify-center + {:class ["top-1/2" "left-1/2" "-translate-x-1/2" "-translate-y-1/2" + "w-4/5" "sm:w-3/4" "md:w-3/5" "lg:w-1/2" "xl:w-1/3"]} + [:div.w-full.max-h-full child]]) -(defn modal +(defn modals-container [] (fn [] (let [modals @(rf/subscribe [:modals]) diff --git a/src/frontend/tubo/views.cljs b/src/frontend/tubo/views.cljs index 074596e..7ccce0d 100644 --- a/src/frontend/tubo/views.cljs +++ b/src/frontend/tubo/views.cljs @@ -13,7 +13,6 @@ [] (let [current-match @(rf/subscribe [:navigation/current-match]) dark-theme? @(rf/subscribe [:dark-theme])] - [modals/modal] [:div {:class (when dark-theme? :dark) :on-click #(rf/dispatch [:layout/destroy-tooltips-on-click-out @@ -21,6 +20,8 @@ [:div.font-nunito-sans.min-h-screen.h-full.relative.flex.flex-col.dark:text-white.bg-neutral-100.dark:bg-neutral-900.z-10 [layout/background-overlay] [layout/mobile-tooltip] + [modals/modals-container] + [navigation/mobile-menu current-match] [navigation/navbar current-match] [notifications/notifications-panel] [:div.flex.flex-col.flex-auto.justify-between.relative |