feat: redesign toolbar & tweaks (#4387)

This commit is contained in:
David Luzar 2021-12-15 15:31:44 +01:00 committed by GitHub
parent 390da3fd0f
commit 7db63bd397
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 233 additions and 60 deletions

View file

@ -19,7 +19,6 @@ import { ExportCB, ImageExportDialog } from "./ImageExportDialog";
import { FixedSideContainer } from "./FixedSideContainer";
import { HintViewer } from "./HintViewer";
import { Island } from "./Island";
import "./LayerUI.scss";
import { LoadingMessage } from "./LoadingMessage";
import { LockButton } from "./LockButton";
import { MobileMenu } from "./MobileMenu";
@ -35,6 +34,9 @@ import { LibraryButton } from "./LibraryButton";
import { isImageFileHandle } from "../data/blob";
import { LibraryMenu } from "./LibraryMenu";
import "./LayerUI.scss";
import "./Toolbar.scss";
interface LayerUIProps {
actionManager: ActionManager;
appState: AppState;
@ -305,7 +307,12 @@ const LayerUI = ({
<Section heading="shapes">
{(heading) => (
<Stack.Col gap={4} align="start">
<Stack.Row gap={1}>
<Stack.Row
gap={1}
className={clsx("App-toolbar-container", {
"zen-mode": zenModeEnabled,
})}
>
<LockButton
zenModeEnabled={zenModeEnabled}
checked={appState.elementLocked}
@ -314,7 +321,9 @@ const LayerUI = ({
/>
<Island
padding={1}
className={clsx({ "zen-mode": zenModeEnabled })}
className={clsx("App-toolbar", {
"zen-mode": zenModeEnabled,
})}
>
<HintViewer
appState={appState}