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

🐛 Fix viewer header hover

Browse source
This commit is contained in:
Aitor 2024-01-24 14:14:08 +01:00
parent 748bc45eb7
commit 74e10c3629
2 changed files with 27 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -354,7 +354,6 @@
wrapper (dom/get-element "inspect-svg-wrapper") wrapper (dom/get-element "inspect-svg-wrapper")
section (dom/get-element "inspect-svg-container") section (dom/get-element "inspect-svg-container")
target (.-target event)] target (.-target event)]
;; TODO: Reemplazar el dom/class? por un data-attribute
(when (or (dom/child? target wrapper) (dom/id? target "inspect-svg-container")) (when (or (dom/child? target wrapper) (dom/id? target "inspect-svg-container"))
(let [norm-event ^js (nw/normalize-wheel event) (let [norm-event ^js (nw/normalize-wheel event)
mod? (kbd/mod? event) mod? (kbd/mod? event)
@ -436,7 +435,9 @@
fullscreen-dom? (dom/fullscreen?)] fullscreen-dom? (dom/fullscreen?)]
(when (not= fullscreen? fullscreen-dom?) (when (not= fullscreen? fullscreen-dom?)
(if fullscreen? (if fullscreen?
(wapi/request-fullscreen wrapper) (let [layout (dom/get-element "viewer-layout")]
(dom/set-data! layout "force-visible" false)
(wapi/request-fullscreen wrapper))
(wapi/exit-fullscreen)))))) (wapi/exit-fullscreen))))))
(mf/use-effect (mf/use-effect
@ -521,16 +522,9 @@
:data-fullscreen fullscreen? :data-fullscreen fullscreen?
:data-force-visible (:show-thumbnails local)} :data-force-visible (:show-thumbnails local)}
[:div {:class (stl/css :viewer-content)} [:div {:class (stl/css :viewer-content)}
[:& header/header {:project project
:index index
:file file
:page page
:frame frame
:permissions permissions
:zoom zoom
:section section
:interactions-mode interactions-mode}]
[:button {:on-click on-thumbnails-close [:button {:on-click on-thumbnails-close
:class (stl/css-case :thumbnails-close true :class (stl/css-case :thumbnails-close true
@ -587,7 +581,17 @@
:overlays overlays :overlays overlays
:zoom zoom :zoom zoom
:section section :section section
:index index}]]))]]])) :index index}]]))]]
[:& header/header {:project project
:index index
:file file
:page page
:frame frame
:permissions permissions
:zoom zoom
:section section
:interactions-mode interactions-mode}]]))
;; --- Component: Viewer ;; --- Component: Viewer

12
frontend/src/app/main/ui/viewer/header.scss
View file

@ -303,10 +303,20 @@
} }
/** FULLSCREEN */ /** FULLSCREEN */
[data-fullscreen="true"] .viewer-header::after {
content: " ";
position: absolute;
width: 100%;
height: $s-48;
left: 0;
top: $s-48;
}
[data-fullscreen="true"] .viewer-header { [data-fullscreen="true"] .viewer-header {
transform: translateY(-$s-48); transform: translateY(-$s-48);
} }
[data-force-visible="true"] .viewer-header { [data-force-visible="true"] .viewer-header,
[data-fullscreen="true"] .viewer-header:hover {
transform: translateY(0); transform: translateY(0);
} }