diff --git a/CHANGES.md b/CHANGES.md index c517fbf8e..ee8f56c3a 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -25,6 +25,15 @@ - Dashboard search, set focus after shortcut (by @akshay-gupta7) [Github #3196](https://github.com/penpot/penpot/pull/3196) - Library name dropdown arrow is overlapped by library name (by @ondrejkonec) [Taiga #5200](https://tree.taiga.io/project/penpot/issue/5200) +## 1.18.4 + +### :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) +- 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 diff --git a/frontend/resources/styles/main/partials/sidebar-assets.scss b/frontend/resources/styles/main/partials/sidebar-assets.scss index 1d6d3b750..aa1750b8d 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 e611d4a76..45196fc41 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/data/workspace/shapes.cljs b/frontend/src/app/main/data/workspace/shapes.cljs index 5d33139c8..e259a6c2e 100644 --- a/frontend/src/app/main/data/workspace/shapes.cljs +++ b/frontend/src/app/main/data/workspace/shapes.cljs @@ -334,9 +334,11 @@ (->> (map :id starting-flows) (reduce ctp/remove-flow flows))))))] - (rx/of (dc/detach-comment-thread ids) + (rx/of (dwu/start-undo-transaction undo-id) + (dc/detach-comment-thread ids) + (dch/commit-changes changes) (ptk/data-event :layout/update all-parents) - (dch/commit-changes changes)))) + (dwu/commit-undo-transaction undo-id)))) (defn create-and-add-shape [type frame-x frame-y data] diff --git a/frontend/src/app/main/ui/workspace/sidebar/assets.cljs b/frontend/src/app/main/ui/workspace/sidebar/assets.cljs index 80a272229..06cba9330 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/assets.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/assets.cljs @@ -1316,7 +1316,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 80aa8a317..7f5e210b1 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 @@ -509,7 +509,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 @@ -527,7 +527,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 89897d7e7..9877b9c46 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) 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 705bb7e15..0ab8eee81 100644 --- a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs @@ -211,7 +211,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/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"}