diff --git a/src/components/ClearCanvas.tsx b/src/components/ClearCanvas.tsx index abd22409..4f325df5 100644 --- a/src/components/ClearCanvas.tsx +++ b/src/components/ClearCanvas.tsx @@ -1,11 +1,10 @@ import { useState } from "react"; import { t } from "../i18n"; import { useIsMobile } from "./App"; -import { Dialog } from "./Dialog"; import { trash } from "./icons"; import { ToolButton } from "./ToolButton"; -import "./ClearCanvas.scss"; +import ConfirmDialog from "./ConfirmDialog"; const ClearCanvas = ({ onConfirm }: { onConfirm: () => void }) => { const [showDialog, setShowDialog] = useState(false); @@ -26,39 +25,16 @@ const ClearCanvas = ({ onConfirm }: { onConfirm: () => void }) => { /> {showDialog && ( - +
{t("alerts.clearReset")}
+ )} > ); diff --git a/src/components/ClearCanvas.scss b/src/components/ConfirmDialog.scss similarity index 58% rename from src/components/ClearCanvas.scss rename to src/components/ConfirmDialog.scss index 3a74761f..d3987fcc 100644 --- a/src/components/ClearCanvas.scss +++ b/src/components/ConfirmDialog.scss @@ -1,22 +1,21 @@ @import "../css/variables.module"; .excalidraw { - .clear-canvas { + .confirm-dialog { &-buttons { display: flex; padding: 0.2rem 0; justify-content: flex-end; + } + .ToolIcon__icon { + min-width: 2.5rem; + width: auto; + font-size: 1rem; + } - .ToolIcon__icon { - min-width: 2.5rem; - width: auto; - font-size: 1rem; - } - - .ToolIcon_type_button { - margin-left: 1.5rem; - padding: 0 0.5rem; - } + .ToolIcon_type_button { + margin-left: 0.8rem; + padding: 0 0.5rem; } &__content { @@ -34,9 +33,5 @@ color: $oc-white; } } - - &--cancel.ToolIcon_type_button { - background-color: $oc-gray-2; - } } } diff --git a/src/components/ConfirmDialog.tsx b/src/components/ConfirmDialog.tsx new file mode 100644 index 00000000..459787df --- /dev/null +++ b/src/components/ConfirmDialog.tsx @@ -0,0 +1,52 @@ +import { t } from "../i18n"; +import { Dialog, DialogProps } from "./Dialog"; +import { ToolButton } from "./ToolButton"; + +import "./ConfirmDialog.scss"; + +interface Props extends Omit