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

Merge pull request #4017 from penpot/azazeln28-bugfixes-3

Browse source 
🐛 Bugfixes
This commit is contained in:
Eva Marco 2024-01-18 11:15:01 +01:00 • committed by GitHub
commit 04d8a64f63
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
22 changed files with 60 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/resources/images/icons/cap-circle-marker.svg
View file

@ -1 +1,3 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><rect rx="6" ry="6" x="10" width="6" height="6"/><path d="M0 3h14.5" fill="none"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 8H1m7 0a3.5 3.5 0 107 0 3.5 3.5 0 00-7 0zm1 1.25h.295m.882 1.25h.294M9 6.75h.295M10.177 8h.294m.882 1.25h.294m.882 1.25h.295m-2.647-5h.294m.882 1.25h.294M12.529 8h.295m.882 1.25H14M12.53 5.5h.294m.882 1.25H14"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 151 B

After

Width:  |  Height:  |  Size: 343 B

Before After
Before After

4
frontend/resources/images/icons/cap-diamond-marker.svg
View file

@ -1 +1,3 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><rect rx="0" ry="0" x="11" y="1" transform="rotate(45 13 3)" width="4" height="4"/><path d="M0 3h14.5" fill="none"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M7.5 8H1m8 1.25h.295m.882 1.25h.294M9 6.75h.295M10.177 8h.294m.882 1.25h.294m.882 1.25h.295m-2.647-5h.294m.882 1.25h.294M12.529 8h.295m.882 1.25H14M12.53 5.5h.294m.882 1.25H14M7.556 8.136l3.808 3.808a.192.192 0 00.272 0l3.808-3.808a.192.192 0 000-.272l-3.808-3.808a.192.192 0 00-.272 0L7.556 7.864a.192.192 0 000 .272z"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 185 B

After

Width:  |  Height:  |  Size: 450 B

Before After
Before After

4
frontend/resources/images/icons/cap-line-arrow.svg
View file

@ -1 +1,3 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><path d="M0 3h14.5M11.7 0l1 1 1.6 2-2.6 3" fill="none"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M14.667 8H1.333M9.5 4l5.278 3.838a.2.2 0 010 .324L9.5 12.5"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 125 B

After

Width:  |  Height:  |  Size: 190 B

Before After
Before After

4
frontend/resources/images/icons/cap-round.svg
View file

@ -1 +1,3 @@
<svg viewBox="1863 1374 16 8" width="16" height="8" xmlns="http://www.w3.org/2000/svg"><path d="M1879 1374h-12s-4 0-4 4 4 4 4 4h12" fill="none"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 5h9.823C13.578 5 15 6.343 15 8s-1.422 3-3.177 3H2"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 152 B

After

Width:  |  Height:  |  Size: 184 B

Before After
Before After

4
frontend/resources/images/icons/cap-square-marker.svg
View file

@ -1 +1,3 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><rect rx="0" ry="0" x="10" width="6" height="6"/><path d="M0 3h14.5" fill="none"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 8H1m8 1.25h.295m.882 1.25h.294M9 6.75h.295M10.177 8h.294m.882 1.25h.294m.882 1.25h.295m-2.647-5h.294m.882 1.25h.294M12.529 8h.295m.882 1.25H14M12.53 5.5h.294m.882 1.25H14M8.5 5h6v6h-6V5z"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 151 B

After

Width:  |  Height:  |  Size: 321 B

Before After
Before After

4
frontend/resources/images/icons/cap-square.svg
View file

@ -1 +1,3 @@
<svg viewBox="1863 1407 16 8" width="16" height="8" xmlns="http://www.w3.org/2000/svg"><path d="M1879 1407h-16v8h16" fill="none"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 5h13v6H2"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 137 B

After

Width:  |  Height:  |  Size: 143 B

Before After
Before After

4
frontend/resources/images/icons/cap-triangle-arrow.svg
View file

@ -1 +1,3 @@
<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><path d="M0 3h14.5" fill="none"/><path d="M13 0l2.9 3L13 6V0z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" stroke-linecap="round" stroke-linejoin="round">
<path d="M9 9.25h.295m.882 1.25h.294M9 6.75h.295M10.177 8h.294m.882 1.25h.294m-1.47-3.75h.294m.882 1.25h.294M12.529 8h.295M8 8H1m13.723-.17L8.805 4.188a.2.2 0 00-.305.17v7.284a.2.2 0 00.305.17l5.918-3.642a.2.2 0 000-.34z"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 133 B

After

Width:  |  Height:  |  Size: 343 B

Before After
Before After

2
frontend/resources/styles/common/refactor/z-index.scss
View file

@ -5,7 +5,7 @@
// Copyright (c) KALEIDOS INC // Copyright (c) KALEIDOS INC
$z-index-1: 1; // floating elements $z-index-1: 1; // floating elements
$z-index-2: 2; //sidebars $z-index-2: 2; // sidebars
$z-index-3: 3; // context menu $z-index-3: 3; // context menu
$z-index-4: 4; // modal $z-index-4: 4; // modal
$z-index-10: 10; $z-index-10: 10;

3
frontend/src/app/main/data/workspace/libraries.cljs
View file

@ -1054,8 +1054,7 @@
ignore-until (dm/get-in state [:workspace-file :ignore-sync-until]) ignore-until (dm/get-in state [:workspace-file :ignore-sync-until])
libraries-need-sync (filter #(seq (assets-need-sync % file-data ignore-until)) libraries-need-sync (filter #(seq (assets-need-sync % file-data ignore-until))
(vals (get state :workspace-libraries))) (vals (get state :workspace-libraries)))
do-more-info #(do (modal/show! :libraries-dialog {:starting-tab :updates}) do-more-info #(modal/show! :libraries-dialog {:starting-tab :updates})
(st/emit! msg/hide))
do-update #(do (apply st/emit! (map (fn [library] do-update #(do (apply st/emit! (map (fn [library]
(sync-file (:current-file-id state) (sync-file (:current-file-id state)
(:id library))) (:id library)))

8
frontend/src/app/main/ui/components/color_bullet_new.cljs
View file

@ -26,7 +26,9 @@
(^function on-click color event))))] (^function on-click color event))))]
(if (uc/multiple? color) (if (uc/multiple? color)
[:div {:on-click on-click :class (stl/css :color-bullet :multiple)}] [:div {:class (stl/css :color-bullet :multiple)
:on-click on-click
:title (:color color)}]
;; No multiple selection ;; No multiple selection
(let [color (if (string? color) {:color color :opacity 1} color) (let [color (if (string? color) {:color color :opacity 1} color)
id (:id color) id (:id color)
@ -44,7 +46,8 @@
:grid-area area :grid-area area
:read-only read-only?) :read-only read-only?)
:data-readonly (str read-only?) :data-readonly (str read-only?)
:on-click on-click} :on-click on-click
:title (:color color)}
(cond (cond
(some? gradient) (some? gradient)
@ -72,6 +75,7 @@
:color-text (< size 72) :color-text (< size 72)
:small-text (and (>= size 64) (< size 72)) :small-text (and (>= size 64) (< size 72))
:big-text (>= size 72)) :big-text (>= size 72))
:title name
:on-click on-click :on-click on-click
:on-double-click on-double-click} :on-double-click on-double-click}
(if (some? image) (if (some? image)

3
frontend/src/app/main/ui/components/color_bullet_new.scss
View file

@ -85,8 +85,9 @@
.big-text { .big-text {
@include inspectValue; @include inspectValue;
@include twoLineTextEllipsis;
color: var(--palette-text-color); color: var(--palette-text-color);
height: $s-16; height: $s-28;
text-align: center; text-align: center;
} }

1
frontend/src/app/main/ui/components/select.scss
View file

@ -28,7 +28,6 @@
.current-icon { .current-icon {
@include flexCenter; @include flexCenter;
height: $s-24;
width: $s-24; width: $s-24;
padding-right: $s-4; padding-right: $s-4;
svg { svg {

11
frontend/src/app/main/ui/viewer.cljs
View file

@ -542,12 +542,11 @@
:index index :index index
:thumbnail-data (:thumbnails file)}] :thumbnail-data (:thumbnails file)}]
[:section {:id "viewer-section" [:section#viewer-section {:ref viewer-section-ref
:ref viewer-section-ref :data-viewer-section true
:data-viewer-section true :class (stl/css-case :viewer-section true
:class (stl/css-case :viewer-section true :fulscreen fullscreen?)
:fulscreen fullscreen?) :on-click click-on-screen}
:on-click click-on-screen}
(cond (cond
(empty? frames) (empty? frames)
[:section {:class (stl/css :empty-state)} [:section {:class (stl/css :empty-state)}

1
frontend/src/app/main/ui/viewer.scss
View file

@ -62,6 +62,7 @@
flex-wrap: nowrap; flex-wrap: nowrap;
margin-top: 0; margin-top: 0;
height: 100%; height: 100%;
overflow: hidden;
} }
.viewer-go-prev, .viewer-go-prev,

1
frontend/src/app/main/ui/viewer/inspect/code.scss
View file

@ -28,7 +28,6 @@
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
min-height: 0; min-height: 0;
overflow: hidden;
padding: 0 $s-4 $s-8 0; padding: 0 $s-4 $s-8 0;
pre { pre {

14
frontend/src/app/main/ui/workspace/colorpicker.cljs
View file

@ -378,17 +378,21 @@
[{vh :height} position x y] [{vh :height} position x y]
(let [;; picker height in pixels (let [;; picker height in pixels
h 510 h 510
;; Checks for overflow outside the viewport height ;; Checks for overflow outside the viewport height
overflow-fix (max 0 (+ y (- 50) h (- vh))) max-y (- vh h)
x-pos 325] x-pos 325]
(cond (cond
(or (nil? x) (nil? y)) {:left "auto" :right "16rem" :top "4rem"} (or (nil? x) (nil? y)) {:left "auto" :right "16rem" :top "4rem"}
(= position :left) {:left (str (- x x-pos) "px") (= position :left)
:top (str (- y 50 overflow-fix) "px")} (if (> y max-y)
{:left (str (- x x-pos) "px")
:bottom "1rem"}
{:left (str (- x x-pos) "px")
:top (str (- y 70) "px")})
:else {:left (str (+ x 80) "px") :else {:left (str (+ x 80) "px")
:top (str (- y 70 overflow-fix) "px")}))) :top (str (- y 70) "px")})))
(mf/defc colorpicker-modal (mf/defc colorpicker-modal
{::mf/register modal/components {::mf/register modal/components

1
frontend/src/app/main/ui/workspace/colorpicker.scss
View file

@ -8,7 +8,6 @@
.colorpicker-tooltip { .colorpicker-tooltip {
@extend .modal-background; @extend .modal-background;
top: $s-100;
left: calc(10 * $s-140); left: calc(10 * $s-140);
width: auto; width: auto;
} }

4
frontend/src/app/main/ui/workspace/left_header.cljs
View file

@ -626,7 +626,9 @@
(keyword))] (keyword))]
(st/emit! (st/emit!
(-> (dw/toggle-layout-flag flag) (-> (dw/toggle-layout-flag flag)
(vary-meta assoc ::ev/origin "workspace-menu"))))))] (vary-meta assoc ::ev/origin "workspace-menu")))
(reset! show-menu* false)
(reset! sub-menu* nil))))]
[:* [:*

7
frontend/src/app/main/ui/workspace/libraries.cljs
View file

@ -481,6 +481,11 @@
on-tab-change on-tab-change
(mf/use-fn #(reset! selected-tab* %)) (mf/use-fn #(reset! selected-tab* %))
close-dialog-outside
(mf/use-fn (fn [event]
(when (= (dom/get-target event) (dom/get-current-target event))
(modal/hide!))))
close-dialog close-dialog
(mf/use-fn (fn [_] (mf/use-fn (fn [_]
(modal/hide!) (modal/hide!)
@ -490,7 +495,7 @@
(when team-id (when team-id
(st/emit! (dwl/fetch-shared-files {:team-id team-id})))) (st/emit! (dwl/fetch-shared-files {:team-id team-id}))))
[:div {:class (stl/css :modal-overlay)} [:div {:class (stl/css :modal-overlay) :on-click close-dialog-outside}
[:div {:class (stl/css :modal-dialog)} [:div {:class (stl/css :modal-dialog)}
[:button {:class (stl/css :close) [:button {:class (stl/css :close)
:on-click close-dialog} :on-click close-dialog}

4
frontend/src/app/main/ui/workspace/libraries.scss
View file

@ -15,7 +15,6 @@
width: 100%; width: 100%;
z-index: $z-index-modal; z-index: $z-index-modal;
background-color: var(--overlay-color); background-color: var(--overlay-color);
pointer-events: none; // This is to allow outside click that closes modal.
.modal-dialog { .modal-dialog {
position: relative; position: relative;
@ -25,7 +24,6 @@
padding: $s-32; padding: $s-32;
border-radius: $br-10; border-radius: $br-10;
background-color: var(--modal-background-color); background-color: var(--modal-background-color);
pointer-events: all;
.close { .close {
@extend .button-tertiary; @extend .button-tertiary;
position: absolute; position: absolute;
@ -146,8 +144,10 @@
.section-title { .section-title {
@include titleTipography; @include titleTipography;
color: var(--modal-title-foreground-color);
margin-bottom: $s-12; margin-bottom: $s-12;
} }
.libraries-search { .libraries-search {
margin: $s-12 0; margin: $s-12 0;
.search-icon { .search-icon {

8
frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.scss
View file

@ -49,13 +49,9 @@
} }
.color-name { .color-name {
@include titleTipography; @include titleTipography;
display: flex; @include textEllipsis;
align-items: center; padding-inline: $s-6;
height: $s-28;
padding-left: $s-6;
border-radius: $br-8; border-radius: $br-8;
width: 100%;
flex-grow: 1;
color: var(--input-foreground-color-active); color: var(--input-foreground-color-active);
} }
.detach-btn { .detach-btn {

2
frontend/src/app/main/ui/workspace/top_toolbar.scss
View file

@ -16,7 +16,7 @@
height: $s-56; height: $s-56;
padding: $s-8 $s-16; padding: $s-8 $s-16;
border-radius: $s-8; border-radius: $s-8;
z-index: $z-index-2; z-index: $z-index-10;
background-color: var(--color-background-primary); background-color: var(--color-background-primary);
transition: transition:
top 0.3s, top 0.3s,