diff --git a/CHANGES.md b/CHANGES.md index 219d55230..23f1e7280 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -47,8 +47,9 @@ ### :bug: Bugs fixed -- "Show in exports" is showing in multiselections [Taiga 3194](https://tree.taiga.io/project/penpot/issue/3194) -- Fix line gap between shapes [Taiga #3181](https://tree.taiga.io/project/penpot/issue/3181) +- Fix hidden file name on import [Taiga #3172](https://tree.taiga.io/project/penpot/issue/3172) +- Fix unneccessary scrollbars at the color list [Taiga #3211](https://tree.taiga.io/project/penpot/issue/3211) +- "Show in exports" is showing in multiselections [Taiga #3194](https://tree.taiga.io/project/penpot/issue/3194) - Edit file name navigates to the file workspace [Taiga #3183](https://tree.taiga.io/project/penpot/issue/3183) - Fix scroll into view behind fixed element [Taiga #3170](https://tree.taiga.io/project/penpot/issue/3170) - Fix sidebar icon in viewer mode [Taiga #3184](https://tree.taiga.io/project/penpot/issue/3184) diff --git a/frontend/deps.edn b/frontend/deps.edn index 7e87cafce..d4dd3597c 100644 --- a/frontend/deps.edn +++ b/frontend/deps.edn @@ -8,7 +8,7 @@ metosin/reitit-core {:mvn/version "0.5.17"} funcool/beicon {:mvn/version "2021.07.05-1"} - funcool/okulary {:mvn/version "2022.04.01-10"} + funcool/okulary {:mvn/version "2022.04.11-16"} funcool/potok {:mvn/version "2021.09.20-0"} funcool/rumext {:mvn/version "2022.03.31-133"} funcool/tubax {:mvn/version "2021.05.20-0"} diff --git a/frontend/resources/styles/main/partials/color-bullet.scss b/frontend/resources/styles/main/partials/color-bullet.scss index 3ee47482f..880dbe892 100644 --- a/frontend/resources/styles/main/partials/color-bullet.scss +++ b/frontend/resources/styles/main/partials/color-bullet.scss @@ -64,6 +64,7 @@ ul.palette-menu .color-bullet { height: 20px; border: 1px solid $color-gray-10; background-size: 8px; + overflow: hidden; } .asset-section .asset-list-item .color-bullet { diff --git a/frontend/resources/styles/main/partials/modal.scss b/frontend/resources/styles/main/partials/modal.scss index b5a8f3ce2..9d2894254 100644 --- a/frontend/resources/styles/main/partials/modal.scss +++ b/frontend/resources/styles/main/partials/modal.scss @@ -369,6 +369,7 @@ white-space: nowrap; .icon-library { + height: 14px; width: 14px; fill: $color-gray-20; margin-left: 0.5rem; diff --git a/frontend/src/app/main/render.cljs b/frontend/src/app/main/render.cljs index 1136002d6..9b61b96e9 100644 --- a/frontend/src/app/main/render.cljs +++ b/frontend/src/app/main/render.cljs @@ -234,7 +234,8 @@ :xmlns:penpot (when include-metadata? "https://penpot.app/xmlns") :style {:width "100%" :height "100%" - :background bgcolor}} + :background bgcolor} + :fill "none"} (when include-metadata? [:& export/export-page {:options (:options data)}]) @@ -300,7 +301,8 @@ :version "1.1" :xmlns "http://www.w3.org/2000/svg" :xmlnsXlink "http://www.w3.org/1999/xlink" - :xmlns:penpot (when include-metadata? "https://penpot.app/xmlns")} + :xmlns:penpot (when include-metadata? "https://penpot.app/xmlns") + :fill "none"} (if (or (not show-thumbnails?) (nil? (:thumbnail frame))) [:& wrapper {:shape frame :view-box vbox}] @@ -352,7 +354,8 @@ :version "1.1" :xmlns "http://www.w3.org/2000/svg" :xmlnsXlink "http://www.w3.org/1999/xlink" - :xmlns:penpot (when include-metadata? "https://penpot.app/xmlns")} + :xmlns:penpot (when include-metadata? "https://penpot.app/xmlns") + :fill "none"} [:> shape-container {:shape group} [:& group-wrapper {:shape group :view-box vbox}]]])) @@ -399,7 +402,8 @@ :xmlnsXlink "http://www.w3.org/1999/xlink" ;; Fix Chromium bug about color of html texts ;; https://bugs.chromium.org/p/chromium/issues/detail?id=1244560#c5 - :style {:-webkit-print-color-adjust :exact}} + :style {:-webkit-print-color-adjust :exact} + :fill "none"} (let [shapes (cph/get-children objects obj-id)] [:& ff/fontfaces-style {:shapes shapes}]) @@ -421,7 +425,8 @@ :height (:height object) :version "1.1" :xmlns "http://www.w3.org/2000/svg" - :xmlnsXlink "http://www.w3.org/1999/xlink"} + :xmlnsXlink "http://www.w3.org/1999/xlink" + :fill "none"} [:& shape-wrapper {:shape (assoc object :x 0 :y 0)}]]]))])) ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; @@ -464,7 +469,8 @@ :xmlns "http://www.w3.org/2000/svg" :xmlnsXlink "http://www.w3.org/1999/xlink" :xmlns:penpot (when include-metadata? "https://penpot.app/xmlns") - :style {:display (when-not (some? children) "none")}} + :style {:display (when-not (some? children) "none")} + :fill "none"} [:defs (for [[id data] (:components data)] [:& component-symbol {:id id :key (dm/str id) :data data}])] diff --git a/frontend/src/app/main/ui/components/tab_container.cljs b/frontend/src/app/main/ui/components/tab_container.cljs index 126acff2d..8c8d07ee0 100644 --- a/frontend/src/app/main/ui/components/tab_container.cljs +++ b/frontend/src/app/main/ui/components/tab_container.cljs @@ -5,29 +5,47 @@ ;; Copyright (c) UXBOX Labs SL (ns app.main.ui.components.tab-container - (:require [rumext.alpha :as mf])) + (:require + [app.common.data :as d] + [cuerdas.core :as str] + [rumext.alpha :as mf])) (mf/defc tab-element - [{:keys [children]}] - [:div.tab-element - [:div.tab-element-content children]]) + {::mf/wrap-props false} + [props] + (let [children (unchecked-get props "children")] + [:div.tab-element + [:div.tab-element-content children]])) (mf/defc tab-container - [{:keys [children selected on-change-tab]}] - (let [first-id (-> children first .-props .-id) - state (mf/use-state {:selected first-id}) - selected (or selected (:selected @state)) - handle-select (fn [tab] - (let [id (-> tab .-props .-id)] - (swap! state assoc :selected id) - (when on-change-tab (on-change-tab id))))] + {::mf/wrap-props false} + [props] + (let [children (unchecked-get props "children") + selected (unchecked-get props "selected") + on-change (unchecked-get props "on-change-tab") + + state (mf/use-state #(or selected (-> children first .-props .-id))) + selected (or selected @state) + + select-fn + (mf/use-fn + (mf/deps on-change) + (fn [event] + (let [id (d/read-string (.. event -target -dataset -id))] + (reset! state id) + (when (fn? on-change) (on-change id)))))] + [:div.tab-container [:div.tab-container-tabs (for [tab children] - [:div.tab-container-tab-title - {:key (str "tab-" (-> tab .-props .-id)) - :on-click (partial handle-select tab) - :class (when (= selected (-> tab .-props .-id)) "current")} - (-> tab .-props .-title)])] + (let [props (.-props tab) + id (.-id props) + title (.-title props)] + [:div.tab-container-tab-title + {:key (str/concat "tab-" (d/name id)) + :data-id (pr-str id) + :on-click select-fn + :class (when (= selected id) "current")} + title]))] [:div.tab-container-content - (filter #(= selected (-> % .-props .-id)) children)]])) + (d/seek #(= selected (-> % .-props .-id)) children)]])) diff --git a/frontend/src/app/main/ui/export.cljs b/frontend/src/app/main/ui/export.cljs index da0e639d0..20e4bde73 100644 --- a/frontend/src/app/main/ui/export.cljs +++ b/frontend/src/app/main/ui/export.cljs @@ -104,7 +104,8 @@ :xmlnsXlink "http://www.w3.org/1999/xlink" ;; Fix Chromium bug about color of html texts ;; https://bugs.chromium.org/p/chromium/issues/detail?id=1244560#c5 - :style {:-webkit-print-color-adjust :exact}} + :style {:-webkit-print-color-adjust :exact} + :fill "none"} [:& shape-wrapper {:shape shape}]])] diff --git a/frontend/src/app/main/ui/shapes/custom_stroke.cljs b/frontend/src/app/main/ui/shapes/custom_stroke.cljs index 193ba39e7..18bd62c00 100644 --- a/frontend/src/app/main/ui/shapes/custom_stroke.cljs +++ b/frontend/src/app/main/ui/shapes/custom_stroke.cljs @@ -332,9 +332,9 @@ ;; There are any shadows (and (seq (->> (:shadow shape) (remove :hidden))) (not (cph/frame-shape? shape))) - ;; There are no strokes and a blur - (and (:blur shape) (-> shape :blur :hidden not) (not (cph/frame-shape? shape)) (empty? (:strokes shape)))) - (obj/set! "filter" (dm/fmt "url(#filter_%)" render-id))) + ;; There is a blur + (and (:blur shape) (-> shape :blur :hidden not) (not (cph/frame-shape? shape)))) + (obj/set! "filter" (dm/fmt "url(#filter_%)" render-id))) svg-defs (:svg-defs shape {}) svg-attrs (:svg-attrs shape {}) @@ -380,7 +380,10 @@ (cond-> (obj/merge! props fill-props) (some? style) - (obj/set! "style" style)))))) + (obj/set! "style" style))) + + :else + props))) (defn build-stroke-props [position child value render-id] (let [props (-> (obj/get child "props") diff --git a/frontend/src/app/main/ui/shapes/text/fo_text.cljs b/frontend/src/app/main/ui/shapes/text/fo_text.cljs index 52f9915bb..86ef063ed 100644 --- a/frontend/src/app/main/ui/shapes/text/fo_text.cljs +++ b/frontend/src/app/main/ui/shapes/text/fo_text.cljs @@ -201,9 +201,7 @@ content (cond-> content plain-colors? - (remap-colors color-mapping)) - - ] + (remap-colors color-mapping))] [:foreignObject {:x x diff --git a/frontend/src/app/main/ui/shapes/text/styles.cljs b/frontend/src/app/main/ui/shapes/text/styles.cljs index db1f75013..bfa35f81f 100644 --- a/frontend/src/app/main/ui/shapes/text/styles.cljs +++ b/frontend/src/app/main/ui/shapes/text/styles.cljs @@ -15,10 +15,11 @@ [cuerdas.core :as str])) (defn generate-root-styles - [_shape node] + [shape node] (let [valign (:vertical-align node "top") - base #js {:height "100%" - :width "100%" + {:keys [width height]} shape + base #js {:height height + :width width :fontFamily "sourcesanspro" :display "flex"}] (cond-> base diff --git a/frontend/src/app/main/ui/viewer/handoff/render.cljs b/frontend/src/app/main/ui/viewer/handoff/render.cljs index c7e4bfe02..a016077cc 100644 --- a/frontend/src/app/main/ui/viewer/handoff/render.cljs +++ b/frontend/src/app/main/ui/viewer/handoff/render.cljs @@ -215,7 +215,8 @@ :height height :version "1.1" :xmlnsXlink "http://www.w3.org/1999/xlink" - :xmlns "http://www.w3.org/2000/svg"} + :xmlns "http://www.w3.org/2000/svg" + :fill "none"} [:& render {:shape frame :view-box vbox}] [:& selection-feedback diff --git a/frontend/src/app/main/ui/viewer/interactions.cljs b/frontend/src/app/main/ui/viewer/interactions.cljs index 587b41ac9..449e47aa9 100644 --- a/frontend/src/app/main/ui/viewer/interactions.cljs +++ b/frontend/src/app/main/ui/viewer/interactions.cljs @@ -94,7 +94,8 @@ :height (:height size) :version "1.1" :xmlnsXlink "http://www.w3.org/1999/xlink" - :xmlns "http://www.w3.org/2000/svg"} + :xmlns "http://www.w3.org/2000/svg" + :fill "none"} [:& wrapper {:shape frame :view-box (:vbox size)}]]]])) diff --git a/frontend/src/app/main/ui/workspace/sidebar.cljs b/frontend/src/app/main/ui/workspace/sidebar.cljs index 1b77fd22a..deb44f7b9 100644 --- a/frontend/src/app/main/ui/workspace/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar.cljs @@ -27,7 +27,7 @@ (mf/defc left-sidebar {:wrap [mf/memo]} - [{:keys [layout ] :as props}] + [{:keys [layout] :as props}] (let [section (cond (contains? layout :layers) :layers (contains? layout :assets) :assets) diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index 4d70a247a..9c4d52ed1 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -212,13 +212,13 @@ :xmlnsXlink "http://www.w3.org/1999/xlink" :xmlns:penpot "https://penpot.app/xmlns" :preserveAspectRatio "xMidYMid meet" - :shape-rendering "crispEdges" :key (str "render" page-id) :width (:width vport 0) :height (:height vport 0) :view-box (utils/format-viewbox vbox) :style {:background-color background - :pointer-events "none"}} + :pointer-events "none"} + :fill "none"} (when (debug? :show-export-metadata) [:& use/export-page {:options options}])