github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-04-23 03:00:31 -04:00
Code Issues Packages Projects Releases Wiki Activity

Improves bounding box hotkeys/UX

Browse Source
This commit is contained in:
psychedelicious
2022-10-28 14:53:07 +11:00
parent a8a30065a4
commit 4ea954fd66
7 changed files with 57 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/features/system/HotkeysModal/HotkeysModal.scss
View File

@@ -1,6 +1,8 @@
@use '../../../styles/Mixins/' as *;
.hotkeys-modal {
width: 36rem !important;
max-width: 36rem !important;
display: grid;
padding: 1rem;
background-color: var(--settings-modal-bg) !important;
@@ -17,8 +19,14 @@
}
}
.hotkeys-modal-button {
display: flex;
align-items: center;
justify-content: space-between;
}
.hotkeys-modal-items {
max-height: 32rem;
max-height: 36rem;
overflow-y: scroll;
@include HideScrollbar;

22
frontend/src/features/system/HotkeysModal/HotkeysModal.tsx
View File

@@ -1,6 +1,7 @@
import {
Accordion,
AccordionButton,
AccordionIcon,
AccordionItem,
AccordionPanel,
Modal,
@@ -181,8 +182,13 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
hotkey: 'Ctrl+Shift+Z, Ctrl+Y',
},
{
title: 'Move Bounding Box',
desc: 'Hold to move bounding box',
title: 'Lock Bounding Box',
desc: 'Locks the bounding box',
hotkey: 'M',
},
{
title: 'Quick Toggle Lock Bounding Box',
desc: 'Hold to toggle locking the bounding box',
hotkey: 'Space',
},
{
@@ -225,8 +231,9 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
<div className="hotkeys-modal-items">
<Accordion allowToggle allowMultiple>
<AccordionItem>
<AccordionButton>
<AccordionButton className="hotkeys-modal-button">
<h2>App Hotkeys</h2>
<AccordionIcon />
</AccordionButton>
<AccordionPanel>
{renderHotkeyModalItems(appHotkeys)}
@@ -234,8 +241,9 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
</AccordionItem>
<AccordionItem>
<AccordionButton>
<AccordionButton className="hotkeys-modal-button">
<h2>General Hotkeys</h2>
<AccordionIcon />
</AccordionButton>
<AccordionPanel>
{renderHotkeyModalItems(generalHotkeys)}
@@ -243,8 +251,9 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
</AccordionItem>
<AccordionItem>
<AccordionButton>
<AccordionButton className="hotkeys-modal-button">
<h2>Gallery Hotkeys</h2>
<AccordionIcon />
</AccordionButton>
<AccordionPanel>
{renderHotkeyModalItems(galleryHotkeys)}
@@ -252,8 +261,9 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
</AccordionItem>
<AccordionItem>
<AccordionButton>
<AccordionButton className="hotkeys-modal-button">
<h2>Inpainting Hotkeys</h2>
<AccordionIcon />
</AccordionButton>
<AccordionPanel>
{renderHotkeyModalItems(inpaintingHotkeys)}