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

✨ Adds shortcuts to header menu

Browse source
This commit is contained in:
alonso.torres 2020-05-20 15:36:02 +02:00
parent e3f7e352d4
commit 283a13acc1
3 changed files with 29 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
frontend/resources/styles/main/partials/workspace-header.scss
View file

@ -36,7 +36,7 @@
height: 30px; height: 30px;
width: 28px; width: 28px;
} }
&:hover { &:hover {
@ -118,6 +118,8 @@
cursor: pointer; cursor: pointer;
font-size: $fs12; font-size: $fs12;
padding: $small $x-small; padding: $small $x-small;
display: flex;
justify-content: space-between;
svg { svg {
fill: $color-gray-60; fill: $color-gray-60;
@ -130,6 +132,10 @@
margin: 0 $x-small; margin: 0 $x-small;
} }
.shortcut {
color: $color-gray-20;
}
&:hover { &:hover {
background-color: $color-primary-lighter; background-color: $color-primary-lighter;
} }

13
frontend/src/uxbox/main/data/workspace.cljs
View file

@ -1516,11 +1516,14 @@
;; Shortcuts impl https://github.com/ccampbell/mousetrap ;; Shortcuts impl https://github.com/ccampbell/mousetrap
(def shortcuts (def shortcuts
{"ctrl+shift+m" #(st/emit! (toggle-layout-flag :sitemap)) {"ctrl+m" #(st/emit! (toggle-layout-flag :sitemap))
"ctrl+shift+i" #(st/emit! (toggle-layout-flag :libraries)) "ctrl+i" #(st/emit! (toggle-layout-flag :libraries))
"ctrl+shift+l" #(st/emit! (toggle-layout-flag :layers)) "ctrl+l" #(st/emit! (toggle-layout-flag :layers))
"ctrl+shift+r" #(st/emit! (toggle-layout-flag :rules)) "ctrl+r" #(st/emit! (toggle-layout-flag :rules))
"ctrl+shift+d" #(st/emit! (toggle-layout-flag :dynamic-alignment)) "ctrl+a" #(st/emit! (toggle-layout-flag :dynamic-alignment))
"ctrl+p" #(st/emit! (toggle-layout-flag :colorpalette))
"ctrl+'" #(st/emit! (toggle-layout-flag :display-grid))
"ctrl+shift+'" #(st/emit! (toggle-layout-flag :snap-grid))
"+" #(st/emit! (increase-zoom nil)) "+" #(st/emit! (increase-zoom nil))
"-" #(st/emit! (decrease-zoom nil)) "-" #(st/emit! (decrease-zoom nil))
"g" #(st/emit! create-group) "g" #(st/emit! create-group)

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

@ -75,43 +75,50 @@
[:span [:span
(if (contains? layout :rules) (if (contains? layout :rules)
(t locale "workspace.header.menu.hide-rules") (t locale "workspace.header.menu.hide-rules")
(t locale "workspace.header.menu.show-rules"))]] (t locale "workspace.header.menu.show-rules"))]
[:span.shortcut "Ctrl+r"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :display-grid))} [:li {:on-click #(st/emit! (dw/toggle-layout-flag :display-grid))}
[:span [:span
(if (contains? layout :display-grid) (if (contains? layout :display-grid)
(t locale "workspace.header.menu.hide-grid") (t locale "workspace.header.menu.hide-grid")
(t locale "workspace.header.menu.show-grid"))]] (t locale "workspace.header.menu.show-grid"))]
[:span.shortcut "Ctrl+'"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :snap-grid))} [:li {:on-click #(st/emit! (dw/toggle-layout-flag :snap-grid))}
[:span [:span
(if (contains? layout :snap-grid) (if (contains? layout :snap-grid)
(t locale "workspace.header.menu.disable-snap-grid") (t locale "workspace.header.menu.disable-snap-grid")
(t locale "workspace.header.menu.enable-snap-grid"))]] (t locale "workspace.header.menu.enable-snap-grid"))]
[:span.shortcut "Ctrl+Shift+'"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :sitemap :layers))} [:li {:on-click #(st/emit! (dw/toggle-layout-flag :sitemap :layers))}
[:span [:span
(if (or (contains? layout :sitemap) (contains? layout :layers)) (if (or (contains? layout :sitemap) (contains? layout :layers))
(t locale "workspace.header.menu.hide-layers") (t locale "workspace.header.menu.hide-layers")
(t locale "workspace.header.menu.show-layers"))]] (t locale "workspace.header.menu.show-layers"))]
[:span.shortcut "Ctrl+l"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :colorpalette))} [:li {:on-click #(st/emit! (dw/toggle-layout-flag :colorpalette))}
[:span [:span
(if (contains? layout :colorpalette) (if (contains? layout :colorpalette)
(t locale "workspace.header.menu.hide-palette") (t locale "workspace.header.menu.hide-palette")
(t locale "workspace.header.menu.show-palette"))]] (t locale "workspace.header.menu.show-palette"))]
[:span.shortcut "Ctrl+p"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :libraries))} [:li {:on-click #(st/emit! (dw/toggle-layout-flag :libraries))}
[:span [:span
(if (contains? layout :libraries) (if (contains? layout :libraries)
(t locale "workspace.header.menu.hide-libraries") (t locale "workspace.header.menu.hide-libraries")
(t locale "workspace.header.menu.show-libraries"))]] (t locale "workspace.header.menu.show-libraries"))]
[:span.shortcut "Ctrl+i"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :dynamic-alignment))} [:li {:on-click #(st/emit! (dw/toggle-layout-flag :dynamic-alignment))}
[:span [:span
(if (contains? layout :dynamic-alignment) (if (contains? layout :dynamic-alignment)
(t locale "workspace.header.menu.disable-dynamic-alignment") (t locale "workspace.header.menu.disable-dynamic-alignment")
(t locale "workspace.header.menu.enable-dynamic-alignment"))]] (t locale "workspace.header.menu.enable-dynamic-alignment"))]
[:span.shortcut "Ctrl+a"]]
]]])) ]]]))
;; --- Header Component ;; --- Header Component