Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-19 11:11:21 -05:00
Code Issues Activity

🐛 Fix text editor for Safari 17

Browse source
This commit is contained in:
alonso.torres 2024-01-25 17:15:38 +01:00
parent 919f6d246b
commit 9965fbc92b
2 changed files with 29 additions and 22 deletions
frontend/src/app
config.cljs
main/ui/workspace/shapes/text
editor.cljs

22
frontend/src/app/config.cljs
View file

@ -22,7 +22,7 @@
;; --- Auxiliar Functions
(def valid-browsers
#{:chrome :firefox :safari :edge :other})
#{:chrome :firefox :safari :safari-16 :safari-17 :edge :other})
(def valid-platforms
#{:windows :linux :macos :other})
@ -33,13 +33,17 @@
check-chrome? (fn [] (str/includes? user-agent "chrom"))
check-firefox? (fn [] (str/includes? user-agent "firefox"))
check-edge? (fn [] (str/includes? user-agent "edg"))
check-safari? (fn [] (str/includes? user-agent "safari"))]
check-safari? (fn [] (str/includes? user-agent "safari"))
check-safari-16? (fn [] (and (check-safari?) (str/includes? user-agent "version/16")))
check-safari-17? (fn [] (and (check-safari?) (str/includes? user-agent "version/17")))]
(cond
(check-edge?) :edge
(check-chrome?) :chrome
(check-firefox?) :firefox
(check-safari?) :safari
:else :other)))
(check-edge?) :edge
(check-chrome?) :chrome
(check-firefox?) :firefox
(check-safari-16?) :safari-16
(check-safari-17?) :safari-17
(check-safari?) :safari
:else :other)))
(defn- parse-platform
[]
@ -130,7 +134,9 @@
(defn ^boolean check-browser? [candidate]
(dm/assert! (contains? valid-browsers candidate))
(= candidate browser))
(if (= candidate :safari)
(contains? #{:safari :safari-16 :safari-17} browser)
(= candidate browser)))
(defn ^boolean check-platform? [candidate]
(dm/assert! (contains? valid-platforms candidate))

29
frontend/src/app/main/ui/workspace/shapes/text/editor.cljs
View file

@ -281,7 +281,7 @@
;; NOTE: this teoretically breaks hooks rules, but in practice
;; it is imposible to really break it
maybe-zoom
(when (cf/check-browser? :safari)
(when (cf/check-browser? :safari-16)
(mf/deref refs/selected-zoom))
shape (cond-> shape
@ -300,26 +300,27 @@
width (mth/max (dm/get-prop bounds :width)
(dm/get-prop shape :width))
height (mth/max (dm/get-prop bounds :height)
(dm/get-prop shape :height))]
(dm/get-prop shape :height))
style
(cond-> #js {:pointer-events "all"}
(cf/check-browser? :safari-16)
(obj/merge!
#js {:position "fixed"
:left 0
:top (- (dm/get-prop shape :y) y)
:transform-origin "top left"
:transform (when (some? maybe-zoom)
(dm/fmt "scale(%)" maybe-zoom))}))]
[:g.text-editor {:clip-path (dm/fmt "url(#%)" clip-id)
:transform (dm/str (gsh/transform-matrix shape))}
[:defs
[:clipPath {:id clip-id}
[:rect {:x x
:y y
:width width
:height height
:fill "red"}]]]
[:rect {:x x :y y :width width :height height}]]]
[:foreignObject {:x x :y y :width width :height height}
[:div {:style {:position "fixed"
:left 0
:top (- (dm/get-prop shape :y) y)
:pointer-events "all"
:transform-origin "top left"
:transform (when (some? maybe-zoom)
(dm/fmt "scale(%)" maybe-zoom))}}
[:div {:style style}
[:& text-shape-edit-html
{:shape shape
:key (dm/str shape-id)}]]]]))