Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-24 07:29:08 -05:00
Code Issues Activity

Merge pull request #147 from uxbox/task/151/workspace-menu-integration

Browse source 
🎉 Add workspace menu integration.
This commit is contained in:
Andrey Antukh 2020-03-22 10:36:11 +01:00 • committed by GitHub
commit f2fa7d4e5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 69 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontend/resources/locales.json
View file

@ -804,6 +804,17 @@
"fr" : "MOT DE PASSE"
}
},
"workspace.header.menu.hide-rules": "Hide rules",
"workspace.header.menu.show-rules": "Show rules",
"workspace.header.menu.hide-grid": "Hide grid",
"workspace.header.menu.show-grid": "Show grid",
"workspace.header.menu.hide-layers": "Hide layers",
"workspace.header.menu.show-layers": "Show layers",
"workspace.header.menu.hide-palette": "Hide color palette",
"workspace.header.menu.show-palette": "Show color palette",
"workspace.header.menu.hide-libraries": "Hide libraries",
"workspace.header.menu.show-libraries": "Show libraries",
"settings.password.change-password" : {
"used-in" : [ "src/uxbox/main/ui/settings/password.cljs:64" ],
"translations" : {

2
frontend/resources/styles/main/partials/context-menu.scss
View file

@ -30,6 +30,6 @@
&:hover {
color: $color-black;
background: $color-gray-lightest;
background: $color-primary-lighter;
}
}

22
frontend/resources/styles/main/partials/workspace-bar.scss
View file

@ -23,32 +23,28 @@
z-index: 12;
@include animation(0,.2s,fadeInDown);
background-color: $color-gray-60;
background-color: $color-white;
border-radius: $br-small;
padding: 0 $small;
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.25);
li {
font-size: $fs13;
padding: $small 0;
cursor: pointer;
font-size: $fs12;
padding: $small $x-small;
svg {
fill: $color-gray-20;
fill: $color-gray-60;
height: 12px;
width: 12px;
}
span {
color: $color-white;
color: $color-gray-60;
margin: 0 $x-small;
}
&:hover {
span {
color: $color-primary;
}
svg {
fill: $color-primary;
}
background-color: $color-primary-lighter;
}
}
}

57
frontend/src/uxbox/main/ui/workspace/header.cljs
View file

@ -60,6 +60,53 @@
[:& user-widget {:user (get-in users [:by-id id])
:key id}])]))
(mf/defc menu
[{:keys [layout] :as props}]
(let [show-menu? (mf/use-state false)
locale (i18n/use-locale)]
[:*
[:div.menu-btn {:on-click #(reset! show-menu? true)} i/actions]
[:& dropdown {:show @show-menu?
:on-close #(reset! show-menu? false)}
[:ul.workspace-menu
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :rules))}
[:span i/ruler]
[:span
(if (contains? layout :rules)
(t locale "workspace.header.menu.hide-rules")
(t locale "workspace.header.menu.show-rules"))]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :grid))}
[:span i/grid]
[:span
(if (contains? layout :grid)
(t locale "workspace.header.menu.hide-grid")
(t locale "workspace.header.menu.show-grid"))]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :layers))}
[:span i/layers]
[:span
(if (contains? layout :layers)
(t locale "workspace.header.menu.hide-layers")
(t locale "workspace.header.menu.show-layers"))]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :colorpalette))}
[:span i/palette]
[:span
(if (contains? layout :colorpalette)
(t locale "workspace.header.menu.hide-palette")
(t locale "workspace.header.menu.show-palette"))]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :libraries))}
[:span i/icon-set]
[:span
(if (contains? layout :libraries)
(t locale "workspace.header.menu.hide-libraries")
(t locale "workspace.header.menu.show-libraries"))]]
]]]))
;; --- Header Component
(mf/defc header
@ -69,8 +116,6 @@
on-redo (constantly nil)
locale (i18n/use-locale)
show-menu? (mf/use-state false)
on-image #(modal/show! import-image-modal {})
;;on-download #(udl/open! :download)
selected-drawtool (mf/deref refs/selected-drawing-tool)
@ -83,14 +128,8 @@
[:a {:on-click #(st/emit! (rt/nav :dashboard-team {:team-id "self"}))}
i/logo-icon]]
[:div.menu-btn {:on-click #(reset! show-menu? true)} i/actions]
[:& dropdown {:show @show-menu?
:on-close #(reset! show-menu? false)}
[:ul.workspace-menu
[:li i/user [:span (t locale "dashboard.header.profile-menu.profile")]]
[:li i/lock [:span (t locale "dashboard.header.profile-menu.password")]]
[:li i/exit [:span (t locale "dashboard.header.profile-menu.logout")]]]]
[:& menu {:layout layout}]
[:div.project-tree-btn
{:alt (tr "header.sitemap")