minor patch

- Added hotkey for manual inpaint: Shift +  R (Updated the hotkey list to display this)
- Moved Settings icon in the header to the end which is consistent with how most programs do it.
- Fixed some missing useEffect dependencies.
- Made the formatting of the Shorcut description text consistent.
- Removed the borders around the bottom toolkit buttons. The 1px border was choppy and the entire region was looking boxed and cluttered. Now I feel it looks cleaner and is consistent with the button in the header.
This commit is contained in:
blessedcoolant 2022-05-03 23:47:03 +12:00 committed by Sanster
parent a297a6d3d0
commit 92900933e5
6 changed files with 25 additions and 13 deletions

View File

@ -555,6 +555,13 @@ export default function Editor(props: EditorProps) {
}) })
}) })
// Manual Inpainting Hotkey
useKeyPressEvent('R', () => {
if (settings.runInpaintingManually && hadDrawSomething()) {
runInpainting()
}
})
// Toggle clean/zoom tool on spacebar. // Toggle clean/zoom tool on spacebar.
useKeyPressEvent( useKeyPressEvent(
' ', ' ',

View File

@ -26,15 +26,15 @@ const Header = () => {
{resolution === 'desktop' ? 'Start New' : undefined} {resolution === 'desktop' ? 'Start New' : undefined}
</Button> </Button>
</div> </div>
<div className="header-icons-wrapper"> <div className="header-icons-wrapper">
<div
className="header-icons"
style={{ visibility: file ? 'visible' : 'hidden' }}
>
<SettingIcon />
<Shortcuts />
</div>
<ThemeChanger /> <ThemeChanger />
{file && (
<div className="header-icons">
<Shortcuts />
<SettingIcon />
</div>
)}
</div> </div>
</header> </header>
) )

View File

@ -34,24 +34,27 @@ export default function ShortcutsModal() {
show={shortcutsShow} show={shortcutsShow}
> >
<div className="shortcut-options"> <div className="shortcut-options">
<ShortCut content="Enable multi-stroke mask drawing"> <ShortCut content="Enable Multi-Stroke Mask Drawing">
<p>Hold Cmd/Ctrl</p> <p>Hold Cmd/Ctrl</p>
</ShortCut> </ShortCut>
<ShortCut content="Undo inpainting"> <ShortCut content="Undo Inpainting">
<p>Cmd/Ctrl + Z</p> <p>Cmd/Ctrl + Z</p>
</ShortCut> </ShortCut>
<ShortCut content="Pan"> <ShortCut content="Pan">
<p>Space & Drag</p> <p>Space & Drag</p>
</ShortCut> </ShortCut>
<ShortCut content="View original image"> <ShortCut content="View Original Image">
<p>Hold Tab</p> <p>Hold Tab</p>
</ShortCut> </ShortCut>
<ShortCut content="Reset zoom/pan"> <ShortCut content="Reset Zoom/Pan">
<p>Esc</p> <p>Esc</p>
</ShortCut> </ShortCut>
<ShortCut content="Cancel mask drawing"> <ShortCut content="Cancel Mask Drawing">
<p>Esc</p> <p>Esc</p>
</ShortCut> </ShortCut>
<ShortCut content="Run Inpainting Manually">
<p>Shift + R</p>
</ShortCut>
<ShortCut content="Decrease Brush Size"> <ShortCut content="Decrease Brush Size">
<p>[</p> <p>[</p>
</ShortCut> </ShortCut>

View File

@ -2,7 +2,7 @@
display: grid; display: grid;
grid-auto-flow: column; grid-auto-flow: column;
column-gap: 1rem; column-gap: 1rem;
border: 1px solid var(--btn-border-color); // border: 1px solid var(--btn-border-color);
color: var(--btn-text-color); color: var(--btn-text-color);
font-family: 'WorkSans', sans-serif; font-family: 'WorkSans', sans-serif;
width: max-content; width: max-content;

View File

@ -15,6 +15,7 @@
// Editor // Editor
--editor-toolkit-bg: rgba(255, 255, 255, 0.5); --editor-toolkit-bg: rgba(255, 255, 255, 0.5);
--editor-options-bg: rgb(230, 230, 234);
--options-text-color: var(--page-text-color); --options-text-color: var(--page-text-color);
--editor-size-border-color: var(--border-color); --editor-size-border-color: var(--border-color);
--editor-toolkit-panel-border: 0; --editor-toolkit-panel-border: 0;

View File

@ -12,6 +12,7 @@
// Editor // Editor
--editor-toolkit-bg: rgba(0, 0, 0, 0.5); --editor-toolkit-bg: rgba(0, 0, 0, 0.5);
--editor-options-bg: rgb(33, 33, 33);
--options-text-color: var(--page-text-color); --options-text-color: var(--page-text-color);
--editor-size-border-color: var(--yellow-accent); --editor-size-border-color: var(--yellow-accent);
--editor-toolkit-panel-border: 1px solid rgb(100, 100, 120, 0.4); --editor-toolkit-panel-border: 1px solid rgb(100, 100, 120, 0.4);