From e8b87b0db1092bb4935c2a7e4b3db1443753c595 Mon Sep 17 00:00:00 2001 From: Pablo Alba Date: Wed, 17 May 2023 13:31:02 +0200 Subject: [PATCH 1/4] :bug: Fix zooming while color picker breaks UI --- CHANGES.md | 6 ++++++ frontend/src/app/main/ui/workspace/viewport/actions.cljs | 5 +++-- .../src/app/main/ui/workspace/viewport/pixel_overlay.cljs | 3 ++- version.txt | 2 +- 4 files changed, 12 insertions(+), 4 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index b6f20465a..57c749035 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -1,5 +1,11 @@ # CHANGELOG +## 1.18.4 + +### :bug: Bugs fixed + +- Fix zooming while color picker breaks UI [GH #3214](https://github.com/penpot/penpot/issues/3214) + ## 1.18.3 ### :bug: Bugs fixed diff --git a/frontend/src/app/main/ui/workspace/viewport/actions.cljs b/frontend/src/app/main/ui/workspace/viewport/actions.cljs index eef5890df..821ab50c6 100644 --- a/frontend/src/app/main/ui/workspace/viewport/actions.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/actions.cljs @@ -361,9 +361,10 @@ (fn [event] (let [event (.getBrowserEvent ^js event) target (dom/get-target event) - mod? (kbd/mod? event)] + mod? (kbd/mod? event) + picking-color? (= "pixel-overlay" (.-id target))] - (when (uwvv/inside-viewport? target) + (when (or (uwvv/inside-viewport? target) picking-color?) (dom/prevent-default event) (dom/stop-propagation event) (let [raw-pt (dom/get-client-position event) diff --git a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs index ceab081f3..9e5d95369 100644 --- a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs @@ -183,7 +183,8 @@ [:* [:div.pixel-overlay - {:tab-index 0 + {:id "pixel-overlay" + :tab-index 0 :style {:cursor cur/picker} :on-pointer-down handle-pointer-down-picker :on-pointer-up handle-pointer-up-picker diff --git a/version.txt b/version.txt index b9fb27ab4..a67b05e87 100644 --- a/version.txt +++ b/version.txt @@ -1 +1 @@ -1.18.3 +1.18.4 From 35e3ac584117467758ddb97f49c68774335797d1 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Fri, 19 May 2023 11:38:56 +0200 Subject: [PATCH 2/4] :bug: Fix problem with layout not reflowing on shape deletion --- CHANGES.md | 1 + frontend/src/app/main/data/workspace/shapes.cljs | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGES.md b/CHANGES.md index 57c749035..a976e1b8c 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -5,6 +5,7 @@ ### :bug: Bugs fixed - Fix zooming while color picker breaks UI [GH #3214](https://github.com/penpot/penpot/issues/3214) +- Fix problem with layout not reflowing on shape deletion [Taiga #5289](https://tree.taiga.io/project/penpot/issue/5289) ## 1.18.3 diff --git a/frontend/src/app/main/data/workspace/shapes.cljs b/frontend/src/app/main/data/workspace/shapes.cljs index 17fd1bed8..a806d5125 100644 --- a/frontend/src/app/main/data/workspace/shapes.cljs +++ b/frontend/src/app/main/data/workspace/shapes.cljs @@ -323,8 +323,8 @@ (rx/of (dwu/start-undo-transaction undo-id) (dc/detach-comment-thread ids) - (ptk/data-event :layout/update all-parents) (dch/commit-changes changes) + (ptk/data-event :layout/update all-parents) (dwu/commit-undo-transaction undo-id)))) (defn create-and-add-shape From fbfff07decffef9f1ac452b2ce55bf6dbc7bb303 Mon Sep 17 00:00:00 2001 From: Eva Date: Mon, 22 May 2023 09:27:18 +0200 Subject: [PATCH 3/4] :bug: Fix background property changing it for background-color --- CHANGES.md | 1 + frontend/src/app/util/code_gen.cljs | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGES.md b/CHANGES.md index a976e1b8c..be830a0e6 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -11,6 +11,7 @@ ### :bug: Bugs fixed +- Fix background-color property on inspect code [Taiga #5300](https://tree.taiga.io/project/penpot/issue/5300) - Fix problem with rulers not placing correctly [Taiga #5093](https://tree.taiga.io/project/penpot/issue/5093) - Fix page context menu [Taiga #5145](https://tree.taiga.io/project/penpot/issue/5145) - Fix project file count [Taiga #5148](https://tree.taiga.io/project/penpot/issue/5148) diff --git a/frontend/src/app/util/code_gen.cljs b/frontend/src/app/util/code_gen.cljs index 321119509..f3cf5eea4 100644 --- a/frontend/src/app/util/code_gen.cljs +++ b/frontend/src/app/util/code_gen.cljs @@ -95,7 +95,7 @@ :height #(get-size :height %)} :multi {:r1 [:r1 :r2 :r3 :r4]}} :fill {:props [:fills] - :to-prop {:fills (if (> (count (:fills shape)) 1) "background-image" "background")} + :to-prop {:fills (if (> (count (:fills shape)) 1) "background-image" "background-color")} :format {:fills format-fill-color}} :stroke {:props [:strokes] :to-prop {:strokes "border"} From defec189e2607dc8595cbfc26913e849d58e1d65 Mon Sep 17 00:00:00 2001 From: Eva Date: Mon, 22 May 2023 12:39:35 +0200 Subject: [PATCH 4/4] :bug: Fix extra long names on typography assets --- CHANGES.md | 3 ++- .../resources/styles/main/partials/sidebar-assets.scss | 8 ++++++++ .../styles/main/partials/sidebar-element-options.scss | 3 +++ frontend/resources/styles/main/partials/text-palette.scss | 4 ++++ frontend/src/app/main/ui/workspace/sidebar/assets.cljs | 3 ++- .../ui/workspace/sidebar/options/menus/typography.cljs | 4 ++-- frontend/src/app/main/ui/workspace/textpalette.cljs | 3 ++- 7 files changed, 23 insertions(+), 5 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index be830a0e6..a3d6cbbd9 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -6,12 +6,13 @@ - Fix zooming while color picker breaks UI [GH #3214](https://github.com/penpot/penpot/issues/3214) - Fix problem with layout not reflowing on shape deletion [Taiga #5289](https://tree.taiga.io/project/penpot/issue/5289) +- Fix extra long typography names on assets and palette [Taiga #5199](https://tree.taiga.io/project/penpot/issue/5199) +- Fix background-color property on inspect code [Taiga #5300](https://tree.taiga.io/project/penpot/issue/5300) ## 1.18.3 ### :bug: Bugs fixed -- Fix background-color property on inspect code [Taiga #5300](https://tree.taiga.io/project/penpot/issue/5300) - Fix problem with rulers not placing correctly [Taiga #5093](https://tree.taiga.io/project/penpot/issue/5093) - Fix page context menu [Taiga #5145](https://tree.taiga.io/project/penpot/issue/5145) - Fix project file count [Taiga #5148](https://tree.taiga.io/project/penpot/issue/5148) diff --git a/frontend/resources/styles/main/partials/sidebar-assets.scss b/frontend/resources/styles/main/partials/sidebar-assets.scss index 4671381f1..0744f3970 100644 --- a/frontend/resources/styles/main/partials/sidebar-assets.scss +++ b/frontend/resources/styles/main/partials/sidebar-assets.scss @@ -434,6 +434,14 @@ cursor: pointer; position: relative; + .name-block { + color: $color-gray-20; + width: calc(100% - 24px - #{$size-2}); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + & span { margin-left: $size-1; color: $color-gray-30; diff --git a/frontend/resources/styles/main/partials/sidebar-element-options.scss b/frontend/resources/styles/main/partials/sidebar-element-options.scss index ef3608c28..5481d70ad 100644 --- a/frontend/resources/styles/main/partials/sidebar-element-options.scss +++ b/frontend/resources/styles/main/partials/sidebar-element-options.scss @@ -1095,7 +1095,10 @@ flex-grow: 1; font-size: $fs11; margin-top: 4px; + max-width: calc(var(--width, 256px) - 100px); + overflow: hidden; white-space: nowrap; + text-overflow: ellipsis; } .element-set-actions-button svg { diff --git a/frontend/resources/styles/main/partials/text-palette.scss b/frontend/resources/styles/main/partials/text-palette.scss index 4bb667f3d..677b98145 100644 --- a/frontend/resources/styles/main/partials/text-palette.scss +++ b/frontend/resources/styles/main/partials/text-palette.scss @@ -9,6 +9,10 @@ & .typography-name { color: $color-white; + max-width: 160px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } & .typography-font, diff --git a/frontend/src/app/main/ui/workspace/sidebar/assets.cljs b/frontend/src/app/main/ui/workspace/sidebar/assets.cljs index 6009b1613..09c031a6c 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/assets.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/assets.cljs @@ -1280,7 +1280,8 @@ :auto-focus true :default-value (cph/merge-path-item (:path color) (:name color))}] - [:div.name-block {:on-double-click rename-color-clicked} + [:div.name-block {:title (:name color) + :on-double-click rename-color-clicked} (:name color) (when-not (= (:name color) default-name) [:span default-name])]) diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/typography.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/typography.cljs index 4d51e1480..600c95d19 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/typography.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/typography.cljs @@ -499,7 +499,7 @@ :font-weight (:font-weight typography) :font-style (:font-style typography)}} (tr "workspace.assets.typography.sample")] - [:div.typography-name (:name typography)]] + [:div.typography-name {:title (:name typography)}(:name typography)]] [:div.element-set-actions (when on-detach [:div.element-set-actions-button @@ -517,7 +517,7 @@ (if (not editable?) [:div.element-set-content.typography-read-only-data [:div.row-flex.typography-name - [:span (:name typography)]] + [:span {:title (:name typography)} (:name typography)]] [:div.row-flex [:span.label (tr "workspace.assets.typography.font-id")] diff --git a/frontend/src/app/main/ui/workspace/textpalette.cljs b/frontend/src/app/main/ui/workspace/textpalette.cljs index fac5ce536..fa39bcd01 100644 --- a/frontend/src/app/main/ui/workspace/textpalette.cljs +++ b/frontend/src/app/main/ui/workspace/textpalette.cljs @@ -42,7 +42,8 @@ :attrs attrs})) selected-ids))))] - [:div.typography-item {:on-click handle-click} + [:div.typography-item {:title (:name typography) + :on-click handle-click} [:div.typography-name {:style {:font-family (:font-family typography) :font-weight (:font-weight typography)