Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-10 17:18:21 -05:00
Code Issues Activity

🐛 Fix problem with gap-row/gap-column

Browse source
This commit is contained in:
alonso.torres 2023-01-12 11:55:22 +01:00 • committed by Alonso Torres
parent 131c2f331e
commit 58aa6b3666
3 changed files with 28 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
common/src/app/common/geom/shapes/flex_layout/drop_area.cljc
View file

@ -41,7 +41,7 @@
(:width parent-rect) (:width parent-rect)
:else :else
(+ box-width (- box-x prev-x) (/ layout-gap-row 2))) (+ box-width (- box-x prev-x) (/ layout-gap-col 2)))
height height
(cond (cond
@ -52,7 +52,7 @@
(:height parent-rect) (:height parent-rect)
:else :else
(+ box-height (- box-y prev-y) (/ layout-gap-col 2)))] (+ box-height (- box-y prev-y) (/ layout-gap-row 2)))]
(if row? (if row?
(let [half-point-width (+ (- box-x x) (/ box-width 2))] (let [half-point-width (+ (- box-x x) (/ box-width 2))]
@ -87,14 +87,14 @@
(if row? (if row?
(:width frame) (:width frame)
(+ line-width margin-x (+ line-width margin-x
(if row? (* layout-gap-row (dec num-children)) 0))) (if row? (* layout-gap-col (dec num-children)) 0)))
line-height line-height
(if col? (if col?
(:height frame) (:height frame)
(+ line-height margin-y (+ line-height margin-y
(if col? (if col?
(* layout-gap-col (dec num-children)) (* layout-gap-row (dec num-children))
0))) 0)))
box-x box-x
@ -122,7 +122,7 @@
(:width frame) (:width frame)
:else :else
(+ line-width (- box-x prev-x) (/ layout-gap-row 2))) (+ line-width (- box-x prev-x) (/ layout-gap-col 2)))
height (cond height (cond
(and row? last?) (and row? last?)
@ -132,7 +132,7 @@
(:height frame) (:height frame)
:else :else
(+ line-height (- box-y prev-y) (/ layout-gap-col 2)))] (+ line-height (- box-y prev-y) (/ layout-gap-row 2)))]
(gsr/make-rect x y width height))) (gsr/make-rect x y width height)))
(defn layout-drop-areas (defn layout-drop-areas

24
common/src/app/common/geom/shapes/flex_layout/lines.cljc
View file

@ -77,8 +77,8 @@
next-max-width (+ child-margin-width (if fill-width? child-max-width child-width)) next-max-width (+ child-margin-width (if fill-width? child-max-width child-width))
next-max-height (+ child-margin-height (if fill-height? child-max-height child-height)) next-max-height (+ child-margin-height (if fill-height? child-max-height child-height))
next-line-min-width (+ line-min-width next-min-width (* layout-gap-row num-children)) next-line-min-width (+ line-min-width next-min-width (* layout-gap-col num-children))
next-line-min-height (+ line-min-height next-min-height (* layout-gap-col num-children))] next-line-min-height (+ line-min-height next-min-height (* layout-gap-row num-children))]
(if (and (some? line-data) (if (and (some? line-data)
(or (not wrap?) (or (not wrap?)
@ -168,20 +168,20 @@
(let [[total-min-width total-min-height total-max-width total-max-height] (let [[total-min-width total-min-height total-max-width total-max-height]
(->> layout-lines (reduce add-ranges [0 0 0 0])) (->> layout-lines (reduce add-ranges [0 0 0 0]))
get-layout-width (fn [{:keys [num-children]}] (- layout-width (* layout-gap-row (dec num-children)))) get-layout-width (fn [{:keys [num-children]}] (- layout-width (* layout-gap-col (dec num-children))))
get-layout-height (fn [{:keys [num-children]}] (- layout-height (* layout-gap-col (dec num-children)))) get-layout-height (fn [{:keys [num-children]}] (- layout-height (* layout-gap-row (dec num-children))))
num-lines (count layout-lines) num-lines (count layout-lines)
;; When align-items is stretch we need to adjust the main axis size to grow for the full content ;; When align-items is stretch we need to adjust the main axis size to grow for the full content
stretch-width-fix stretch-width-fix
(if (and col? (ctl/content-stretch? parent)) (if (and col? (ctl/content-stretch? parent))
(/ (- layout-width (* layout-gap-row (dec num-lines)) total-max-width) num-lines) (/ (- layout-width (* layout-gap-col (dec num-lines)) total-max-width) num-lines)
0) 0)
stretch-height-fix stretch-height-fix
(if (and row? (ctl/content-stretch? parent)) (if (and row? (ctl/content-stretch? parent))
(/ (- layout-height (* layout-gap-col (dec num-lines)) total-max-height) num-lines) (/ (- layout-height (* layout-gap-row (dec num-lines)) total-max-height) num-lines)
0) 0)
;; Distributes the space between the layout lines based on its max/min constraints ;; Distributes the space between the layout lines based on its max/min constraints
@ -200,7 +200,7 @@
(map #(assoc % :line-height (+ (:line-max-height %) stretch-height-fix))) (map #(assoc % :line-height (+ (:line-max-height %) stretch-height-fix)))
(and row? (< total-min-height layout-height total-max-height)) (and row? (< total-min-height layout-height total-max-height))
(distribute-space :line-height :line-min-height :line-max-height total-min-height (- layout-height (* (dec num-lines) layout-gap-col))) (distribute-space :line-height :line-min-height :line-max-height total-min-height (- layout-height (* (dec num-lines) layout-gap-row)))
(and col? (>= total-min-width layout-width)) (and col? (>= total-min-width layout-width))
(map #(assoc % :line-width (:line-min-width %))) (map #(assoc % :line-width (:line-min-width %)))
@ -209,7 +209,7 @@
(map #(assoc % :line-width (+ (:line-max-width %) stretch-width-fix))) (map #(assoc % :line-width (+ (:line-max-width %) stretch-width-fix)))
(and col? (< total-min-width layout-width total-max-width)) (and col? (< total-min-width layout-width total-max-width))
(distribute-space :line-width :line-min-width :line-max-width total-min-width (- layout-width (* (dec num-lines) layout-gap-row)))) (distribute-space :line-width :line-min-width :line-max-width total-min-width (- layout-width (* (dec num-lines) layout-gap-col))))
[total-width total-height] (->> layout-lines (reduce add-lines [0 0])) [total-width total-height] (->> layout-lines (reduce add-lines [0 0]))
@ -231,7 +231,7 @@
[layout-gap-row layout-gap-col] (ctl/gaps shape) [layout-gap-row layout-gap-col] (ctl/gaps shape)
layout-gap-row layout-gap-col
(cond (and row? space-around?) (cond (and row? space-around?)
0 0
@ -239,9 +239,9 @@
(/ (- width line-width) (dec num-children)) (/ (- width line-width) (dec num-children))
:else :else
layout-gap-row) layout-gap-col)
layout-gap-col layout-gap-row
(cond (and col? space-around?) (cond (and col? space-around?)
0 0
@ -249,7 +249,7 @@
(/ (- height line-height) (dec num-children)) (/ (- height line-height) (dec num-children))
:else :else
layout-gap-col) layout-gap-row)
margin-x margin-x
(if (and row? space-around?) (if (and row? space-around?)

20
common/src/app/common/geom/shapes/flex_layout/positions.cljc
View file

@ -29,8 +29,8 @@
lines-gap-row (* (dec num-lines) layout-gap-row) lines-gap-row (* (dec num-lines) layout-gap-row)
lines-gap-col (* (dec num-lines) layout-gap-col) lines-gap-col (* (dec num-lines) layout-gap-col)
free-width-gap (- layout-width total-width lines-gap-row) free-width-gap (- layout-width total-width lines-gap-col)
free-height-gap (- layout-height total-height lines-gap-col) free-height-gap (- layout-height total-height lines-gap-row)
free-width (- layout-width total-width) free-width (- layout-width total-width)
free-height (- layout-height total-height)] free-height (- layout-height total-height)]
@ -87,7 +87,7 @@
(/ free-width (inc num-lines)) (/ free-width (inc num-lines))
:else :else
layout-gap-row) layout-gap-col)
line-gap-col line-gap-col
(cond (cond
@ -101,14 +101,14 @@
(/ free-height (inc num-lines)) (/ free-height (inc num-lines))
:else :else
layout-gap-col)] layout-gap-row)]
(cond-> base-p (cond-> base-p
row? row?
(gpt/add (vv (+ line-height (max layout-gap-col line-gap-col)))) (gpt/add (vv (+ line-height (max layout-gap-row line-gap-col))))
col? col?
(gpt/add (hv (+ line-width (max layout-gap-row line-gap-row))))))) (gpt/add (hv (+ line-width (max layout-gap-col line-gap-row)))))))
(defn get-start-line (defn get-start-line
"Cross axis line. It's position is fixed along the different lines" "Cross axis line. It's position is fixed along the different lines"
@ -128,8 +128,8 @@
content-stretch? (ctl/content-stretch? parent) content-stretch? (ctl/content-stretch? parent)
hv (partial gpo/start-hv layout-bounds) hv (partial gpo/start-hv layout-bounds)
vv (partial gpo/start-vv layout-bounds) vv (partial gpo/start-vv layout-bounds)
children-gap-width (* layout-gap-row (dec num-children)) children-gap-width (* layout-gap-col (dec num-children))
children-gap-height (* layout-gap-col (dec num-children)) children-gap-height (* layout-gap-row (dec num-children))
line-height line-height
(if (and row? content-stretch?) (if (and row? content-stretch?)
@ -257,12 +257,12 @@
next-p next-p
(cond-> start-p (cond-> start-p
row? row?
(-> (gpt/add (hv (+ child-width layout-gap-row))) (-> (gpt/add (hv (+ child-width layout-gap-col)))
(gpt/add (hv (+ margin-left margin-right)))) (gpt/add (hv (+ margin-left margin-right))))
col? col?
(-> (gpt/add (vv (+ margin-top margin-bottom))) (-> (gpt/add (vv (+ margin-top margin-bottom)))
(gpt/add (vv (+ child-height layout-gap-col)))) (gpt/add (vv (+ child-height layout-gap-row))))
(some? margin-x) (some? margin-x)
(gpt/add (hv margin-x)) (gpt/add (hv margin-x))