fix(ui): incorrect position of absolute modal on some mobile platforms

samuelbaizg · Mar 20, 2023 · 988a00e · 988a00e
1 parent ac4e2a1
commit 988a00e
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/src/main/frontend/components/editor.cljs b/src/main/frontend/components/editor.cljs
@@ -392,11 +392,9 @@
                 :z-index    11}
                (when set-default-width?
                  {:width max-width})
-               (when-let [^js/HTMLElement editor
-                          (js/document.querySelector ".editor-wrapper")]
-                 (if (<= (.-clientWidth editor) (+ left (if set-default-width? max-width 500)))
-                   {:right 0}
-                   {:left (if (or (nil? y-diff) (and y-diff (= y-diff 0))) left 0)})))]
+               (if (<= vw-max-width (+ left (if set-default-width? max-width 500)))
+                 {:right 0}
+                 {:left (if (or (nil? y-diff) (and y-diff (= y-diff 0))) left 0)}))]
     [:div.absolute.rounded-md.shadow-lg.absolute-modal
      {:ref *el
       :data-modal-name modal-name

diff --git a/src/main/frontend/components/editor.css b/src/main/frontend/components/editor.css
@@ -42,8 +42,10 @@
   }
 
   &[data-modal-name="commands"] {
-    width: 380px !important;
-    max-width: 90vw !important;
+    @screen sm {
+      width: 380px !important;
+      max-width: 90vw !important;
+    }
   }
 }