3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-09 18:46:38 +02:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #3775 from penpot/alotor-fix-layout

Browse source 
Bugfixes
This commit is contained in:
Pablo Alba 2023-11-07 19:01:18 +01:00 • committed by GitHub
commit 94c834ae5e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 125 additions and 110 deletions
Download patch file Download diff file Expand all files Collapse all files

7
common/src/app/common/data.cljc
View file

@ -250,12 +250,14 @@
#(patch-object % changes))
([object changes]
(if object
(->> changes
(reduce-kv
(fn [object key value]
(cond
(map? value)
(update object key patch-object value)
(let [current (get object key)]
(assoc object key (patch-object current value)))
(and (nil? value) (record? object))
(assoc object key nil)
@ -265,7 +267,8 @@
:else
(assoc object key value)))
object))))
object))
changes)))
(defn remove-at-index
"Takes a vector and returns a vector with an element in the

1
common/src/app/common/geom/modif_tree.cljc
View file

@ -7,7 +7,6 @@
(ns app.common.geom.modif-tree
(:require
[app.common.data.macros :as dm]
[app.common.geom.shapes.min-size-layout]
[app.common.pages.helpers :as cph]
[app.common.types.modifiers :as ctm]))

7
common/src/app/common/geom/shapes/flex_layout/layout_data.cljc
View file

@ -70,11 +70,8 @@
child-max-width (ctl/child-max-width child)
child-max-height (ctl/child-max-height child)
[child-margin-top child-margin-right child-margin-bottom child-margin-left]
(ctl/child-margins child)
child-margin-width (+ child-margin-left child-margin-right)
child-margin-height (+ child-margin-top child-margin-bottom)
child-margin-width (ctl/child-width-margin child)
child-margin-height (ctl/child-height-margin child)
fill-width? (ctl/fill-width? child)
fill-height? (ctl/fill-height? child)

6
common/src/app/common/geom/shapes/grid_layout/layout_data.cljc
View file

@ -61,13 +61,15 @@
(defn child-min-width
[child child-bounds bounds objects]
(-child-min-width child child-bounds bounds objects))
(+ (ctl/child-width-margin child)
(-child-min-width child child-bounds bounds objects)))
(def -child-min-height nil)
(defn child-min-height
[child child-bounds bounds objects]
(-child-min-height child child-bounds bounds objects))
(+ (ctl/child-height-margin child)
(-child-min-height child child-bounds bounds objects)))
(defn layout-bounds
[parent shape-bounds]

17
common/src/app/common/geom/shapes/min_size_layout.cljc
View file

@ -17,10 +17,11 @@
(defn child-min-width
[child child-bounds bounds objects]
(let [min-width
(cond
(and (ctl/fill-width? child) (ctl/flex-layout? child))
(let [children (cph/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})]
(ctl/child-min-width child)
;; Uncomment this to activate "auto" as min size
#_(let [children (cph/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})]
(max (ctl/child-min-width child)
(gpo/width-points (fb/layout-content-bounds bounds child children objects))))
@ -37,15 +38,15 @@
(ctl/child-min-width child)
:else
(gpo/width-points child-bounds))]
(+ min-width (ctl/child-width-margin child))))
(gpo/width-points child-bounds)))
(defn child-min-height
[child child-bounds bounds objects]
(let [min-height
(cond
(and (ctl/fill-height? child) (ctl/flex-layout? child))
(let [children (cph/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})]
;; Uncomment this to activate "auto" as min size
(ctl/child-min-height child)
#_(let [children (cph/get-immediate-children objects (dm/get-prop child :id) {:remove-hidden true})]
(max (ctl/child-min-height child)
(gpo/height-points (fb/layout-content-bounds bounds child children objects))))
@ -62,8 +63,7 @@
(ctl/child-min-height child)
:else
(gpo/height-points child-bounds))]
(+ min-height (ctl/child-height-margin child))))
(gpo/height-points child-bounds)))
#?(:cljs
(do (set! fd/-child-min-width child-min-width)
@ -80,4 +80,3 @@
(alter-var-root #'fb/-child-min-height (constantly child-min-height))
(alter-var-root #'gd/-child-min-width (constantly child-min-width))
(alter-var-root #'gd/-child-min-height (constantly child-min-height))))

2
common/src/app/common/geom/shapes/transforms.cljc
View file

@ -486,7 +486,7 @@
(transform-shape modifiers))))
([shape modifiers]
(if (and (some? modifiers) (not (ctm/empty? modifiers)))
(if (and (some? shape) (some? modifiers) (not (ctm/empty? modifiers)))
(let [transform (ctm/modifiers->transform modifiers)]
(cond-> shape
(and (some? transform)

1
common/src/app/common/geom/shapes/tree_seq.cljc
View file

@ -8,7 +8,6 @@
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.geom.shapes.min-size-layout]
[app.common.pages.helpers :as cph]
[app.common.types.shape.layout :as ctl]
[app.common.uuid :as uuid]))

15
frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs
View file

@ -30,15 +30,20 @@
[rumext.v2 :as mf]))
(defn fix-position [shape]
(let [modifiers (:modifiers shape)
shape' (gsh/transform-shape shape modifiers)
(if-let [modifiers (:modifiers shape)]
(let [shape' (gsh/transform-shape shape modifiers)
old-sr (dm/get-prop shape :selrect)
new-sr (dm/get-prop shape' :selrect)
;; We need to remove the movement because the dynamic modifiers will have move it
deltav (gpt/to-vec (gpt/point (:selrect shape'))
(gpt/point (:selrect shape)))]
deltav (gpt/to-vec (gpt/point new-sr)
(gpt/point old-sr))]
(-> shape
(gsh/transform-shape (ctm/move modifiers deltav))
(mdwm/update-grow-type shape)
(dissoc :modifiers))))
(dissoc :modifiers)))
shape))
(defn- update-with-editor-state
"Updates the shape with the current state in the editor"

12
frontend/src/app/main/ui/workspace/sidebar/options/menus/typography.cljs
View file

@ -377,10 +377,16 @@
:on-blur on-blur}])]
[:div {:class (stl/css :font-variant-options)}
(let [basic-variant-options (map (fn [variant]
{:value (:id variant) :key (pr-str variant) :label (:name variant)}) (:variants font))
(let [basic-variant-options (->> (:variants font)
(map (fn [variant]
{:value (:id variant)
:key (pr-str variant)
:label (:name variant)}) ))
variant-options (if (= font-size :multiple)
(conj {:value :multiple :key :multiple-variants :label "--"} basic-variant-options)
(conj basic-variant-options
{:value :multiple
:key :multiple-variants
:label "--"} )
basic-variant-options)]
;; TODO Add disabled mode
[:& select

8
frontend/src/app/main/ui/workspace/viewport.cljs
View file

@ -226,7 +226,8 @@
(not node-editing?)
(or show-distances? mode-inspect?))
show-artboard-names? (contains? layout :display-artboard-names)
show-rules? (and (contains? layout :rules) (not (contains? layout :hide-ui)))
hide-ui? (contains? layout :hide-ui)
show-rules? (and (contains? layout :rules) (not hide-ui?))
disabled-guides? (or drawing-tool transform)
@ -525,14 +526,15 @@
:zoom zoom
:vbox vbox}]
(when show-rules?
(when-not hide-ui?
[:& rules/rules
{:zoom zoom
:zoom-inverse zoom-inverse
:vbox vbox
:selected-shapes selected-shapes
:offset-x offset-x
:offset-y offset-y}])
:offset-y offset-y
:show-rules? show-rules?}])
(when show-rules?
[:& guides/viewport-guides

55
frontend/src/app/main/ui/workspace/viewport/rules.cljs
View file

@ -157,32 +157,11 @@
step (calculate-step-size zoom)
clip-id (str "clip-rule-" (d/name axis))
new-css-system (mf/use-ctx ctx/new-css-system)
rules-background (if new-css-system new-css-rules-background rules-background)
font-color (if new-css-system new-css-font-color font-color)
rule-area-size (/ rule-area-size zoom)
border-radius (/ new-css-canvas-border-radius zoom)]
font-color (if new-css-system new-css-font-color font-color)]
[:*
(let [{:keys [x y width height]} (get-background-area vbox zoom-inverse axis)]
[:*
[:rect {:x x :y y :width width :height height :style {:fill rules-background}}]
;; Draw the rules' rounded corners in the viewport corners
(when new-css-system
(if (= axis :x)
[:*
[:path {:d (round-corner-path-tl (+ x rule-area-size) (+ y rule-area-size) border-radius)
:style {:fill rules-background}}]
[:path {:d (round-corner-path-tr (+ x width (- border-radius)) (+ y rule-area-size) border-radius)
:style {:fill rules-background}}]]
[:*
[:path {:d (round-corner-path-bl (+ x rule-area-size) (+ y height (- border-radius)) border-radius)
:style {:fill rules-background}}]
[:path {:d (round-corner-path-br (+ x (:width vbox) (- border-radius)) (+ y height (- border-radius)) border-radius)
:style {:fill rules-background}}]]))])
[:rect {:x x :y y :width width :height height :style {:fill rules-background}}])
[:g.rules {:clipPath (str "url(#" clip-id ")")}
@ -315,7 +294,7 @@
(mf/defc rules
{::mf/wrap-props false
::mf/wrap [#(mf/memo' % (mf/check-props ["zoom" "vbox" "selected-shapes"]))]}
::mf/wrap [#(mf/memo' % (mf/check-props ["zoom" "vbox" "selected-shapes" "show-rules?"]))]}
[props]
(let [zoom (obj/get props "zoom")
zoom-inverse (obj/get props "zoom-inverse")
@ -324,6 +303,11 @@
offset-y (obj/get props "offset-y")
selected-shapes (-> (obj/get props "selected-shapes")
(hooks/use-equal-memo))
show-rules? (obj/get props "show-rules?")
new-css-system (mf/use-ctx ctx/new-css-system)
rules-background (if new-css-system new-css-rules-background rules-background)
border-radius (/ new-css-canvas-border-radius zoom)
selection-rect
(mf/use-memo
@ -333,10 +317,29 @@
(when (some? vbox)
[:g.rules {:pointer-events "none"}
(when show-rules?
[:*
[:& rules-axis {:zoom zoom :zoom-inverse zoom-inverse :vbox vbox :axis :x :offset offset-x}]
[:& rules-axis {:zoom zoom :zoom-inverse zoom-inverse :vbox vbox :axis :y :offset offset-y}]
[:& rules-axis {:zoom zoom :zoom-inverse zoom-inverse :vbox vbox :axis :y :offset offset-y}]])
(when (some? selection-rect)
;; Draw the rules' rounded corners in the viewport corners
(when new-css-system
(let [{:keys [x y width height]} vbox
rule-area-size (if show-rules? (/ rule-area-size zoom) 0)]
[:*
[:path {:d (round-corner-path-tl (+ x rule-area-size) (+ y rule-area-size) border-radius)
:style {:fill rules-background}}]
[:path {:d (round-corner-path-tr (+ x width (- border-radius)) (+ y rule-area-size) border-radius)
:style {:fill rules-background}}]
[:path {:d (round-corner-path-bl (+ x rule-area-size) (+ y height (- border-radius)) border-radius)
:style {:fill rules-background}}]
[:path {:d (round-corner-path-br (+ x (:width vbox) (- border-radius)) (+ y height (- border-radius)) border-radius)
:style {:fill rules-background}}]]))
(when (and show-rules? (some? selection-rect))
[:& selection-area {:zoom zoom
:zoom-inverse zoom-inverse
:vbox vbox