Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-13 00:01:51 -05:00
Code Issues Activity

New actions menu in file thumbnails

Browse source
This commit is contained in:
Andrés Moya 2020-03-18 13:39:59 +01:00 • committed by Andrey Antukh
parent 74c8107a92
commit 6838b9e769
3 changed files with 41 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/resources/locales.json
View file

@ -5,6 +5,8 @@
"en" : "You still have no files here" "en" : "You still have no files here"
} }
}, },
"dashboard.grid.edit": "Edit",
"dashboard.grid.delete": "Delete",
"dashboard.header.colors" : { "dashboard.header.colors" : {
"translations" : { "translations" : {
"en" : "COLORS", "en" : "COLORS",

25
frontend/resources/styles/main/partials/dashboard-grid.scss
View file

@ -180,12 +180,16 @@
&:hover { &:hover {
border-color: $color-primary; border-color: $color-primary;
.project-th-actions {
display: flex;
}
} }
.project-th-actions { .project-th-actions {
align-items: center; align-items: center;
bottom: 0; bottom: 0;
display: flex; display: none;
left: 0; left: 0;
justify-content: flex-end; justify-content: flex-end;
padding: $small; padding: $small;
@ -208,6 +212,25 @@
display: flex; display: flex;
margin-right: $small; margin-right: $small;
&.menu {
margin-right: 0;
svg {
fill: $color-gray-30;
margin-right: 0;
}
&:hover {
transform: scale(1.4);
svg {
fill: $color-danger;
}
}
}
&.delete { &.delete {
margin-right: 0; margin-right: 0;

23
frontend/src/uxbox/main/ui/dashboard/grid.cljs
View file

@ -10,6 +10,7 @@
[uxbox.main.ui.modal :as modal] [uxbox.main.ui.modal :as modal]
[uxbox.main.ui.keyboard :as kbd] [uxbox.main.ui.keyboard :as kbd]
[uxbox.main.ui.confirm :refer [confirm-dialog]] [uxbox.main.ui.confirm :refer [confirm-dialog]]
[uxbox.main.ui.components.context-menu :refer [context-menu]]
[uxbox.util.dom :as dom] [uxbox.util.dom :as dom]
[uxbox.util.i18n :as i18n :refer [t tr]] [uxbox.util.i18n :as i18n :refer [t tr]]
[uxbox.util.router :as rt] [uxbox.util.router :as rt]
@ -35,7 +36,9 @@
(mf/defc grid-item (mf/defc grid-item
{:wrap [mf/wrap-memo]} {:wrap [mf/wrap-memo]}
[{:keys [file] :as props}] [{:keys [file] :as props}]
(let [local (mf/use-state {}) (let [local (mf/use-state {:menu-open false
:edition false})
locale (i18n/use-locale)
on-navigate #(st/emit! (rt/nav :workspace on-navigate #(st/emit! (rt/nav :workspace
{:file-id (:id file)} {:file-id (:id file)}
{:page-id (first (:pages file))})) {:page-id (first (:pages file))}))
@ -49,9 +52,12 @@
(swap! local assoc :edition false)) (swap! local assoc :edition false))
on-key-down #(when (kbd/enter? %) (on-blur %)) on-key-down #(when (kbd/enter? %) (on-blur %))
on-menu-click #(do
(dom/stop-propagation %)
(swap! local assoc :menu-open true))
on-menu-close #(swap! local assoc :menu-open false)
on-edit #(do on-edit #(do
(dom/stop-propagation %) (dom/stop-propagation %)
(dom/prevent-default %)
(swap! local assoc :edition true))] (swap! local assoc :edition true))]
[:div.grid-item.project-th {:on-click on-navigate} [:div.grid-item.project-th {:on-click on-navigate}
[:div.overlay] [:div.overlay]
@ -73,12 +79,13 @@
;; [:div.project-th-icon.comments ;; [:div.project-th-icon.comments
;; i/chat ;; i/chat
;; [:span "0"]] ;; [:span "0"]]
[:div.project-th-icon.edit [:div.project-th-icon.menu
{:on-click on-edit} {:on-click on-menu-click}
i/pencil] i/actions]
[:div.project-th-icon.delete [:& context-menu {:on-close on-menu-close
{:on-click on-delete} :show (:menu-open @local)
i/trash]]])) :options [[(t locale "dashboard.grid.edit") on-edit]
[(t locale "dashboard.grid.delete") on-delete]]}]]]))
;; --- Grid ;; --- Grid