3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-19 08:26:11 +02:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #2852 from penpot/eva-bugfixing-4

Browse source 
Eva bugfixing 4
This commit is contained in:
Alejandro 2023-01-27 15:07:20 +01:00 • committed by GitHub
commit 50b7337b8c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 76 additions and 73 deletions
Download patch file Download diff file Expand all files Collapse all files

8
frontend/resources/styles/main/partials/inspect.scss
View file

@ -314,11 +314,15 @@
} }
} }
.attributes-shadow-block { .attributes-shadow-block,
.attributes-stroke-block,
.attributes-fill-block {
border-top: 1px solid $color-gray-60; border-top: 1px solid $color-gray-60;
} }
.attributes-shadow-blocks :first-child { .attributes-shadow-blocks :first-child,
.attributes-stroke-blocks :first-child,
.attributes-fill-blocks :first-child {
border-top: none; border-top: none;
} }
} }

10
frontend/src/app/main/ui/formats.cljs
View file

@ -67,11 +67,11 @@
(let [sizing (if (= type :width) (let [sizing (if (= type :width)
(:layout-item-h-sizing shape) (:layout-item-h-sizing shape)
(:layout-item-v-sizing shape))] (:layout-item-v-sizing shape))]
(if (string? value) (cond
value (= sizing :fill) "100%"
(if (= sizing :fill) (= sizing :auto) "auto"
"100%" (number? value) (format-pixels value)
(str (format-pixels value)))))) :else value)))
(defn format-padding (defn format-padding
[padding-values type] [padding-values type]

19
frontend/src/app/main/ui/viewer/inspect/attributes/fill.cljs
View file

@ -6,7 +6,6 @@
(ns app.main.ui.viewer.inspect.attributes.fill (ns app.main.ui.viewer.inspect.attributes.fill
(:require (:require
[app.main.ui.components.copy-button :refer [copy-button]]
[app.main.ui.viewer.inspect.attributes.common :refer [color-row]] [app.main.ui.viewer.inspect.attributes.common :refer [color-row]]
[app.util.code-gen :as cg] [app.util.code-gen :as cg]
[app.util.color :as uc] [app.util.color :as uc]
@ -40,10 +39,11 @@
(let [color-format (mf/use-state :hex) (let [color-format (mf/use-state :hex)
color (shape->color shape)] color (shape->color shape)]
[:& color-row {:color color [:div.attributes-fill-block
:format @color-format [:& color-row {:color color
:on-change-format #(reset! color-format %) :format @color-format
:copy-data (copy-data shape)}])) :on-change-format #(reset! color-format %)
:copy-data (copy-data shape)}]]))
(mf/defc fill-panel (mf/defc fill-panel
[{:keys [shapes]}] [{:keys [shapes]}]
@ -51,14 +51,13 @@
(when (seq shapes) (when (seq shapes)
[:div.attributes-block [:div.attributes-block
[:div.attributes-block-title [:div.attributes-block-title
[:div.attributes-block-title-text (tr "inspect.attributes.fill")] [:div.attributes-block-title-text (tr "inspect.attributes.fill")]]
(when (= (count shapes) 1)
[:& copy-button {:data (copy-data (first shapes))}])]
(for [shape shapes] [:div.attributes-fill-blocks
(for [shape shapes]
(if (seq (:fills shape)) (if (seq (:fills shape))
(for [value (:fills shape [])] (for [value (:fills shape [])]
[:& fill-block {:key (str "fill-block-" (:id shape) value) [:& fill-block {:key (str "fill-block-" (:id shape) value)
:shape value}]) :shape value}])
[:& fill-block {:key (str "fill-block-only" (:id shape)) [:& fill-block {:key (str "fill-block-only" (:id shape))
:shape shape}]))]))) :shape shape}]))]])))

12
frontend/src/app/main/ui/viewer/inspect/attributes/layout_flex.cljs
View file

@ -38,18 +38,18 @@
:layout-wrap-type "flex-wrap" :layout-wrap-type "flex-wrap"
:layout-gap "gap" :layout-gap "gap"
:layout-padding "padding"} :layout-padding "padding"}
:format {:layout name :format {:layout d/name
:layout-flex-dir name :layout-flex-dir d/name
:layout-align-items name :layout-align-items d/name
:layout-justify-content name :layout-justify-content d/name
:layout-wrap-type name :layout-wrap-type d/name
:layout-gap fm/format-gap :layout-gap fm/format-gap
:layout-padding fm/format-padding}}) :layout-padding fm/format-padding}})
(def layout-align-content-params (def layout-align-content-params
{:props [:layout-align-content] {:props [:layout-align-content]
:to-prop {:layout-align-content "align-content"} :to-prop {:layout-align-content "align-content"}
:format {:layout-align-content name}}) :format {:layout-align-content d/name}})
(defn copy-data (defn copy-data
([shape] ([shape]

2
frontend/src/app/main/ui/viewer/inspect/attributes/layout_flex_element.cljs
View file

@ -43,7 +43,7 @@
:layout-item-max-w "max-width" :layout-item-max-w "max-width"
:layout-item-min-w "min-width"} :layout-item-min-w "min-width"}
:format {:layout-item-margin format-margin :format {:layout-item-margin format-margin
:layout-item-align-self name}}) :layout-item-align-self d/name}})
(defn copy-data (defn copy-data
([shape] ([shape]

22
frontend/src/app/main/ui/viewer/inspect/attributes/stroke.cljs
View file

@ -55,12 +55,7 @@
[{:keys [shape]}] [{:keys [shape]}]
(let [color-format (mf/use-state :hex) (let [color-format (mf/use-state :hex)
color (shape->color shape)] color (shape->color shape)]
[:* [:div.attributes-stroke-block
[:& color-row {:color color
:format @color-format
:copy-data (copy-color-data shape)
:on-change-format #(reset! color-format %)}]
(let [{:keys [stroke-style stroke-alignment]} shape (let [{:keys [stroke-style stroke-alignment]} shape
stroke-style (if (= stroke-style :svg) :solid stroke-style) stroke-style (if (= stroke-style :svg) :solid stroke-style)
stroke-alignment (or stroke-alignment :center)] stroke-alignment (or stroke-alignment :center)]
@ -78,7 +73,11 @@
;; inspect.attributes.stroke.alignment.inner ;; inspect.attributes.stroke.alignment.inner
;; inspect.attributes.stroke.alignment.outer ;; inspect.attributes.stroke.alignment.outer
[:div.attributes-label (->> stroke-alignment d/name (str "inspect.attributes.stroke.alignment.") (tr))] [:div.attributes-label (->> stroke-alignment d/name (str "inspect.attributes.stroke.alignment.") (tr))]
[:& copy-button {:data (copy-stroke-data shape)}]])])) [:& copy-button {:data (copy-stroke-data shape)}]])
[:& color-row {:color color
:format @color-format
:copy-data (copy-color-data shape)
:on-change-format #(reset! color-format %)}]]))
(mf/defc stroke-panel (mf/defc stroke-panel
[{:keys [shapes]}] [{:keys [shapes]}]
@ -86,14 +85,13 @@
(when (seq shapes) (when (seq shapes)
[:div.attributes-block [:div.attributes-block
[:div.attributes-block-title [:div.attributes-block-title
[:div.attributes-block-title-text (tr "inspect.attributes.stroke")] [:div.attributes-block-title-text (tr "inspect.attributes.stroke")]]
(when (= (count shapes) 1)
[:& copy-button {:data (copy-stroke-data (first shapes))}])]
(for [shape shapes] [:div.attributes-stroke-blocks
(for [shape shapes]
(if (seq (:strokes shape)) (if (seq (:strokes shape))
(for [value (:strokes shape [])] (for [value (:strokes shape [])]
[:& stroke-block {:key (str "stroke-color-" (:id shape) value) [:& stroke-block {:key (str "stroke-color-" (:id shape) value)
:shape value}]) :shape value}])
[:& stroke-block {:key (str "stroke-color-only" (:id shape)) [:& stroke-block {:key (str "stroke-color-only" (:id shape))
:shape shape}]))]))) :shape shape}]))]])))

15
frontend/src/app/main/ui/viewer/inspect/attributes/text.cljs
View file

@ -7,6 +7,7 @@
(ns app.main.ui.viewer.inspect.attributes.text (ns app.main.ui.viewer.inspect.attributes.text
(:require (:require
[app.common.data :as d] [app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.text :as txt] [app.common.text :as txt]
[app.main.fonts :as fonts] [app.main.fonts :as fonts]
[app.main.store :as st] [app.main.store :as st]
@ -58,14 +59,14 @@
(def params (def params
{:to-prop {:fill-color "color" {:to-prop {:fill-color "color"
:fill-color-gradient "color"} :fill-color-gradient "color"}
:format {:font-family #(str "'" % "'") :format {:font-family #(dm/str "'" % "'")
:font-style #(str % ) :font-style #(dm/str % )
:font-size #(str (format-number %) "px") :font-size #(dm/str (format-number %) "px")
:font-weight name :font-weight d/name
:line-height #(format-number %) :line-height #(format-number %)
:letter-spacing #(str (format-number %) "px") :letter-spacing #(dm/str (format-number %) "px")
:text-decoration name :text-decoration d/name
:text-transform name :text-transform d/name
:fill-color #(-> %2 shape->color uc/color->background) :fill-color #(-> %2 shape->color uc/color->background)
:fill-color-gradient #(-> %2 shape->color uc/color->background)}}) :fill-color-gradient #(-> %2 shape->color uc/color->background)}})

53
frontend/src/app/util/code_gen.cljs
View file

@ -7,6 +7,7 @@
(ns app.util.code-gen (ns app.util.code-gen
(:require (:require
[app.common.data :as d] [app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.pages.helpers :as cph] [app.common.pages.helpers :as cph]
[app.common.text :as txt] [app.common.text :as txt]
[app.main.ui.formats :as fmt] [app.main.ui.formats :as fmt]
@ -16,7 +17,7 @@
(defn shadow->css [shadow] (defn shadow->css [shadow]
(let [{:keys [style offset-x offset-y blur spread]} shadow (let [{:keys [style offset-x offset-y blur spread]} shadow
css-color (uc/color->background (:color shadow))] css-color (uc/color->background (:color shadow))]
(str (dm/str
(if (= style :inner-shadow) "inset " "") (if (= style :inner-shadow) "inset " "")
(str/fmt "%spx %spx %spx %spx %s" offset-x offset-y blur spread css-color)))) (str/fmt "%spx %spx %spx %spx %s" offset-x offset-y blur spread css-color))))
@ -49,7 +50,7 @@
(let [first-stroke (first (:strokes shape)) (let [first-stroke (first (:strokes shape))
width (:stroke-width first-stroke) width (:stroke-width first-stroke)
style (let [style (:stroke-style first-stroke)] style (let [style (:stroke-style first-stroke)]
(when (keyword? style) (name style))) (when (keyword? style) (d/name style)))
color {:color (:stroke-color first-stroke) color {:color (:stroke-color first-stroke)
:opacity (:stroke-opacity first-stroke) :opacity (:stroke-opacity first-stroke)
:gradient (:stroke-color-gradient first-stroke)}] :gradient (:stroke-color-gradient first-stroke)}]
@ -118,11 +119,11 @@
:layout-wrap-type "flex-wrap" :layout-wrap-type "flex-wrap"
:layout-gap "gap" :layout-gap "gap"
:layout-padding "padding"} :layout-padding "padding"}
:format {:layout name :format {:layout d/name
:layout-flex-dir name :layout-flex-dir d/name
:layout-align-items name :layout-align-items d/name
:layout-justify-content name :layout-justify-content d/name
:layout-wrap-type name :layout-wrap-type d/name
:layout-gap format-gap :layout-gap format-gap
:layout-padding fmt/format-padding}}}) :layout-padding fmt/format-padding}}})
@ -137,14 +138,14 @@
:text-decoration :text-decoration
:text-transform] :text-transform]
:to-prop {:fills "color"} :to-prop {:fills "color"}
:format {:font-family #(str "'" % "'") :format {:font-family #(dm/str "'" % "'")
:font-style #(str %) :font-style #(dm/str %)
:font-size #(str % "px") :font-size #(dm/str % "px")
:font-weight #(str %) :font-weight #(dm/str %)
:line-height #(str %) :line-height #(dm/str %)
:letter-spacing #(str % "px") :letter-spacing #(dm/str % "px")
:text-decoration name :text-decoration d/name
:text-transform name :text-transform d/name
:fills format-fill-color}}) :fills format-fill-color}})
(def layout-flex-item-params (def layout-flex-item-params
@ -161,16 +162,16 @@
:layout-item-min-w "min-width" :layout-item-min-w "min-width"
:layout-item-align-self "align-self"} :layout-item-align-self "align-self"}
:format {:layout-item-margin fmt/format-margin :format {:layout-item-margin fmt/format-margin
:layout-item-max-h #(str % "px") :layout-item-max-h #(dm/str % "px")
:layout-item-min-h #(str % "px") :layout-item-min-h #(dm/str % "px")
:layout-item-max-w #(str % "px") :layout-item-max-w #(dm/str % "px")
:layout-item-min-w #(str % "px") :layout-item-min-w #(dm/str % "px")
:layout-item-align-self name}}) :layout-item-align-self d/name}})
(def layout-align-content (def layout-align-content
{:props [:layout-align-content] {:props [:layout-align-content]
:to-prop {:layout-align-content "align-content"} :to-prop {:layout-align-content "align-content"}
:format {:layout-align-content name}}) :format {:layout-align-content d/name}})
(defn get-specific-value (defn get-specific-value
[values prop] [values prop]
@ -217,13 +218,13 @@
(every? #(or (nil? %) (= % 0)) value) (every? #(or (nil? %) (= % 0)) value)
(or (nil? value) (= value 0)))) (or (nil? value) (= value 0))))
default-format (fn [value] (str (fmt/format-pixels value))) default-format (fn [value] (dm/str (fmt/format-pixels value)))
format-property (fn [prop] format-property (fn [prop]
(let [css-prop (or (prop to-prop) (name prop)) (let [css-prop (or (prop to-prop) (d/name prop))
format-fn (or (prop format) default-format) format-fn (or (prop format) default-format)
css-val (format-fn (get-value prop) values)] css-val (format-fn (get-value prop) values)]
(when css-val (when css-val
(str (dm/str
(str/repeat " " tab-size) (str/repeat " " tab-size)
(str/fmt "%s: %s;" css-prop css-val)))))] (str/fmt "%s: %s;" css-prop css-val)))))]
@ -281,13 +282,13 @@
(cons [node-style (:text node "")] acc) (cons [node-style (:text node "")] acc)
:else :else
(cons [node-style (str head-text "" (:text node))] (rest acc))) (cons [node-style (dm/str head-text "" (:text node))] (rest acc)))
;; We add an end-of-line when finish a paragraph ;; We add an end-of-line when finish a paragraph
new-acc new-acc
(if (= (:type node) "paragraph") (if (= (:type node) "paragraph")
(let [[hs ht] (first new-acc)] (let [[hs ht] (first new-acc)]
(cons [hs (str ht "\n")] (rest new-acc))) (cons [hs (dm/str ht "\n")] (rest new-acc)))
new-acc)] new-acc)]
new-acc))] new-acc))]

4
frontend/translations/en.po
View file

@ -2598,7 +2598,7 @@ msgid "shortcuts.toggle-layers"
msgstr "Toggle layers" msgstr "Toggle layers"
msgid "shortcuts.toggle-layout-flex" msgid "shortcuts.toggle-layout-flex"
msgstr "Add/remove layout flex" msgstr "Add/remove flex layout"
msgid "shortcuts.toggle-lock" msgid "shortcuts.toggle-lock"
msgstr "Lock selected" msgstr "Lock selected"
@ -4316,7 +4316,7 @@ msgstr "Path"
#: src/app/main/ui/workspace/context_menu.cljs #: src/app/main/ui/workspace/context_menu.cljs
msgid "workspace.shape.menu.remove-flex" msgid "workspace.shape.menu.remove-flex"
msgstr "Remove layout flex" msgstr "Remove flex layout"
#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs, src/app/main/ui/workspace/sidebar/options/menus/component.cljs, src/app/main/ui/workspace/context_menu.cljs, src/app/main/ui/workspace/context_menu.cljs #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs, src/app/main/ui/workspace/sidebar/options/menus/component.cljs, src/app/main/ui/workspace/context_menu.cljs, src/app/main/ui/workspace/context_menu.cljs
msgid "workspace.shape.menu.reset-overrides" msgid "workspace.shape.menu.reset-overrides"

4
frontend/translations/es.po
View file

@ -2690,7 +2690,7 @@ msgid "shortcuts.toggle-layers"
msgstr "Mostrar/ocultar capas" msgstr "Mostrar/ocultar capas"
msgid "shortcuts.toggle-layout-flex" msgid "shortcuts.toggle-layout-flex"
msgstr "Añadir/eliminar layout flex" msgstr "Añadir/eliminar flex layout"
msgid "shortcuts.toggle-lock" msgid "shortcuts.toggle-lock"
msgstr "Bloquear/Desbloquear" msgstr "Bloquear/Desbloquear"
@ -4463,7 +4463,7 @@ msgstr "Ruta"
#: src/app/main/ui/workspace/context_menu.cljs #: src/app/main/ui/workspace/context_menu.cljs
msgid "workspace.shape.menu.remove-flex" msgid "workspace.shape.menu.remove-flex"
msgstr "Eliminar layout flex" msgstr "Eliminar flex layout"
#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs, #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs,
#: src/app/main/ui/workspace/context_menu.cljs, #: src/app/main/ui/workspace/context_menu.cljs,