diff --git a/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc b/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc index 4a92e0b17..72c1ea18f 100644 --- a/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc +++ b/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc @@ -62,15 +62,17 @@ (defn child-min-width [child bounds] - (if (ctl/fill-width? child) - (ctl/child-min-width child) - (gpo/width-points bounds))) + (+ (if (ctl/fill-width? child) + (ctl/child-min-width child) + (gpo/width-points bounds)) + (ctl/child-width-margin child))) (defn child-min-height [child bounds] - (if (ctl/fill-height? child) - (ctl/child-min-height child) - (gpo/height-points bounds))) + (+ (if (ctl/fill-height? child) + (ctl/child-min-height child) + (gpo/height-points bounds)) + (ctl/child-height-margin child))) (defn calculate-initial-track-size [total-value {:keys [type value] :as track}] diff --git a/common/src/app/common/geom/shapes/grid_layout/positions.cljc b/common/src/app/common/geom/shapes/grid_layout/positions.cljc index cea3162d4..6f73edb88 100644 --- a/common/src/app/common/geom/shapes/grid_layout/positions.cljc +++ b/common/src/app/common/geom/shapes/grid_layout/positions.cljc @@ -18,6 +18,7 @@ [app.common.types.shape.layout :as ctl])) (defn cell-bounds + "Retrieves the points that define the bounds for given cell" [{:keys [origin row-tracks column-tracks layout-bounds column-gap row-gap] :as layout-data} {:keys [row column row-span column-span] :as cell}] (let [hv #(gpo/start-hv layout-bounds %) @@ -55,11 +56,13 @@ [_parent transform transform-inverse - _child + child child-origin child-width cell-bounds] - (let [target-width (max (gpo/width-points cell-bounds) 0.01) + (let [target-width (max (- (gpo/width-points cell-bounds) (ctl/child-width-margin child)) 0.01) + max-width (max (ctl/child-max-width child) 0.01) + target-width (mth/clamp target-width (ctl/child-min-width child) max-width) fill-scale (/ target-width child-width)] {:width target-width :modifiers (ctm/resize-modifiers (gpt/point fill-scale 1) child-origin transform transform-inverse)})) @@ -68,10 +71,12 @@ "Calculates the size and modifiers for the height of an auto-fill child" [_parent transform transform-inverse - _child + child child-origin child-height cell-bounds] - (let [target-height (max (gpo/height-points cell-bounds) 0.01) + (let [target-height (max (- (gpo/height-points cell-bounds) (ctl/child-height-margin child)) 0.01) + max-height (max (ctl/child-max-height child) 0.01) + target-height (mth/clamp target-height (ctl/child-min-height child) max-height) fill-scale (/ target-height child-height)] {:height target-height :modifiers (ctm/resize-modifiers (gpt/point 1 fill-scale) child-origin transform transform-inverse)})) @@ -106,7 +111,7 @@ (cond-> fill-height (ctm/add-modifiers (:modifiers fill-height))))])) (defn child-position-delta - [parent child-bounds child-width child-height layout-data cell-data] + [parent child child-bounds child-width child-height layout-data cell-data] (let [cell-bounds (cell-bounds layout-data cell-data) child-origin (gpo/origin child-bounds) @@ -126,30 +131,35 @@ hv (partial gpo/start-hv cell-bounds) vv (partial gpo/start-vv cell-bounds) + [top-m right-m bottom-m left-m] (ctl/child-margins child) + ;; Adjust alignment/justify [from-h to-h] (case justify :end [(gpt/add origin-h (hv child-width)) - (nth cell-bounds 1)] + (gpt/subtract (nth cell-bounds 1) (hv right-m))] :center [(gpt/add origin-h (hv (/ child-width 2))) (gpo/project-point cell-bounds :h (gpo/center cell-bounds))] - [origin-h (first cell-bounds)]) + [origin-h + (gpt/add (first cell-bounds) (hv left-m))]) [from-v to-v] (case align :end [(gpt/add origin-v (vv child-height)) - (nth cell-bounds 3)] + (gpt/subtract (nth cell-bounds 3) (vv bottom-m))] :center [(gpt/add origin-v (vv (/ child-height 2))) (gpo/project-point cell-bounds :v (gpo/center cell-bounds))] - [origin-v (first cell-bounds)])] + [origin-v + (gpt/add (first cell-bounds) (vv top-m))])] + (-> (gpt/point) (gpt/add (gpt/to-vec from-h to-h)) (gpt/add (gpt/to-vec from-v to-v))))) @@ -160,7 +170,7 @@ (let [[child-width child-height fill-modifiers] (fill-modifiers parent parent-bounds child child-bounds layout-data cell-data) - position-delta (child-position-delta parent child-bounds child-width child-height layout-data cell-data)] + position-delta (child-position-delta parent child child-bounds child-width child-height layout-data cell-data)] (cond-> (ctm/empty) (not (ctl/layout-absolute? child)) diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs index 85ab7b921..7f88b351f 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs @@ -533,7 +533,7 @@ :nillable true :value (:layout-item-z-index values)}]])] - (when is-layout-child? + (when (and is-layout-child? is-flex-parent?) [:div {:class (stl/css :second-row)} [:& align-self-row {:is-col? is-col? :align-self align-self @@ -667,7 +667,7 @@ :on-change-behaviour-v-refactor on-change-behaviour-v :on-change on-change-behaviour}]] - (when is-layout-child? + (when (and is-layout-child? is-flex-parent?) [:div.layout-row [:div.row-title "Align"] [:div.btn-wrapper