3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-24 00:37:23 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Grid area attributes for html generation

Browse source
This commit is contained in:
alonso.torres 2023-10-02 16:01:57 +02:00
parent f639c73d03
commit d420f30835
5 changed files with 126 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/app/util/code_gen/style_css.cljs
View file

@ -100,6 +100,7 @@ body {
;; Grid related properties
:grid-template-rows
:grid-template-columns
:grid-template-areas
;; Flex/grid self properties
:flex-shrink
@ -114,6 +115,7 @@ body {
;; Grid cell properties
:grid-column
:grid-row
:grid-area
])
(def text-node-css-properties

41
frontend/src/app/util/code_gen/style_css_values.cljs
View file

@ -14,7 +14,8 @@
[app.common.pages.helpers :as cph]
[app.common.types.shape.layout :as ctl]
[app.main.ui.formats :as fmt]
[app.util.code-gen.common :as cgc]))
[app.util.code-gen.common :as cgc]
[cuerdas.core :as str]))
(defn fill->color
[{:keys [fill-color fill-opacity fill-color-gradient]}]
@ -279,15 +280,38 @@
[_ shape _]
(:layout-grid-columns shape))
(defmethod get-value :grid-template-areas
[_ shape _]
(when (ctl/grid-layout? shape)
(let [result
(->> (d/enumerate (:layout-grid-rows shape))
(map
(fn [[row _]]
(dm/str
"\""
(->> (d/enumerate (:layout-grid-columns shape))
(map (fn [[column _]]
(let [cell (ctl/get-cell-by-position shape (inc row) (inc column))]
(str/replace (:area-name cell ".") " " "-"))))
(str/join " "))
"\"")))
(str/join "\n"))]
result)))
(defn get-grid-coord
[shape objects prop span-prop]
(when (and (ctl/grid-layout-immediate-child? objects shape)
(not (ctl/layout-absolute? shape)))
(let [parent (get objects (:parent-id shape))
cell (ctl/get-cell-by-shape-id parent (:id shape))]
(if (> (get cell span-prop) 1)
(dm/str (get cell prop) " / " (+ (get cell prop) (get cell span-prop)))
(get cell prop)))))
(when (and
(not (and (= (:position cell) :area) (d/not-empty? (:area-name cell))))
(or (= (:position cell) :manual)
(> (:row-span cell) 1)
(> (:column-span cell) 1)))
(if (> (get cell span-prop) 1)
(dm/str (get cell prop) " / " (+ (get cell prop) (get cell span-prop)))
(get cell prop))))))
(defmethod get-value :grid-column
[_ shape objects]
@ -297,6 +321,15 @@
[_ shape objects]
(get-grid-coord shape objects :row :row-span))
(defmethod get-value :grid-area
[_ shape objects]
(when (and (ctl/grid-layout-immediate-child? objects shape)
(not (ctl/layout-absolute? shape)))
(let [parent (get objects (:parent-id shape))
cell (ctl/get-cell-by-shape-id parent (:id shape))]
(when (and (= (:position cell) :area) (d/not-empty? (:area-name cell)))
(str/replace (:area-name cell) " " "-")))))
(defmethod get-value :flex-shrink
[_ shape objects]
(when (and (ctl/flex-layout-immediate-child? objects shape)