mirror of
https://github.com/docmost/docmost.git
synced 2026-05-07 06:23:06 +08:00
fix color scheme
This commit is contained in:
@@ -135,7 +135,6 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Info")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isInfo })}
|
||||
>
|
||||
<IconInfoCircleFilled size={18} color="var(--mantine-color-blue-5)" />
|
||||
@@ -148,7 +147,6 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Success")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isSuccess })}
|
||||
>
|
||||
<IconCircleCheckFilled size={18} color="var(--mantine-color-green-5)" />
|
||||
@@ -161,7 +159,6 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Warning")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isWarning })}
|
||||
>
|
||||
<IconAlertTriangleFilled size={18} color="var(--mantine-color-orange-5)" />
|
||||
@@ -174,7 +171,6 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Danger")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isDanger })}
|
||||
>
|
||||
<IconCircleXFilled size={18} color="var(--mantine-color-red-5)" />
|
||||
@@ -189,7 +185,6 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
actionIconProps={{
|
||||
size: "lg",
|
||||
variant: "subtle",
|
||||
c: "dark",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -9,6 +9,17 @@
|
||||
box-shadow: 0 2px 12px light-dark(rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.35));
|
||||
}
|
||||
|
||||
.toolbar :global(.mantine-ActionIcon-root) {
|
||||
--ai-color: light-dark(var(--mantine-color-dark-7), var(--mantine-color-gray-4)) !important;
|
||||
--ai-hover: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-5)) !important;
|
||||
}
|
||||
|
||||
.toolbar .active {
|
||||
--ai-color: light-dark(var(--mantine-color-blue-7), var(--mantine-color-blue-3)) !important;
|
||||
--ai-hover: light-dark(var(--mantine-color-blue-0), var(--mantine-color-dark-5)) !important;
|
||||
background-color: light-dark(var(--mantine-color-blue-0), var(--mantine-color-dark-5));
|
||||
}
|
||||
|
||||
.divider {
|
||||
width: 1px;
|
||||
height: 16px;
|
||||
@@ -16,8 +27,3 @@
|
||||
margin: 0 2px;
|
||||
background-color: light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-3));
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: light-dark(var(--mantine-color-blue-0), var(--mantine-color-dark-5));
|
||||
color: light-dark(var(--mantine-color-blue-7), var(--mantine-color-blue-4));
|
||||
}
|
||||
|
||||
@@ -200,7 +200,6 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align left")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignLeft })}
|
||||
>
|
||||
<IconLayoutAlignLeft size={18} />
|
||||
@@ -213,7 +212,6 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align center")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignCenter })}
|
||||
>
|
||||
<IconLayoutAlignCenter size={18} />
|
||||
@@ -226,7 +224,6 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align right")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignRight })}
|
||||
>
|
||||
<IconLayoutAlignRight size={18} />
|
||||
@@ -241,7 +238,6 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Edit")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconEdit size={18} />
|
||||
</ActionIcon>
|
||||
@@ -253,7 +249,6 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Download")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconDownload size={18} />
|
||||
</ActionIcon>
|
||||
@@ -265,7 +260,6 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Delete")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconTrash size={18} />
|
||||
</ActionIcon>
|
||||
|
||||
@@ -234,7 +234,6 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align left")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({
|
||||
[classes.active]: editorState?.isAlignLeft,
|
||||
})}
|
||||
@@ -249,7 +248,6 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align center")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({
|
||||
[classes.active]: editorState?.isAlignCenter,
|
||||
})}
|
||||
@@ -264,7 +262,6 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align right")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({
|
||||
[classes.active]: editorState?.isAlignRight,
|
||||
})}
|
||||
@@ -281,7 +278,6 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Edit")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconEdit size={18} />
|
||||
</ActionIcon>
|
||||
@@ -293,7 +289,6 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Download")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconDownload size={18} />
|
||||
</ActionIcon>
|
||||
@@ -305,7 +300,6 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Delete")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconTrash size={18} />
|
||||
</ActionIcon>
|
||||
|
||||
@@ -155,7 +155,6 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align left")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignLeft })}
|
||||
>
|
||||
<IconLayoutAlignLeft size={18} />
|
||||
@@ -168,7 +167,6 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align center")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignCenter })}
|
||||
>
|
||||
<IconLayoutAlignCenter size={18} />
|
||||
@@ -181,7 +179,6 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align right")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignRight })}
|
||||
>
|
||||
<IconLayoutAlignRight size={18} />
|
||||
@@ -196,7 +193,6 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Download")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconDownload size={18} />
|
||||
</ActionIcon>
|
||||
@@ -208,7 +204,6 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Replace image")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconRefresh size={18} />
|
||||
</ActionIcon>
|
||||
@@ -220,7 +215,6 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Delete")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconTrash size={18} />
|
||||
</ActionIcon>
|
||||
|
||||
@@ -96,7 +96,6 @@ export const TableBackgroundColor: FC<TableBackgroundColorProps> = ({
|
||||
<Tooltip label={t("Background color")} withArrow>
|
||||
<ActionIcon
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Background color")}
|
||||
onClick={() => setOpened(!opened)}
|
||||
|
||||
@@ -80,7 +80,6 @@ export const TableCellMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={mergeCells}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Merge cells")}
|
||||
>
|
||||
@@ -92,7 +91,6 @@ export const TableCellMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={splitCell}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Split cell")}
|
||||
>
|
||||
@@ -106,7 +104,6 @@ export const TableCellMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={deleteColumn}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Delete column")}
|
||||
>
|
||||
@@ -118,7 +115,6 @@ export const TableCellMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={deleteRow}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Delete row")}
|
||||
>
|
||||
@@ -132,7 +128,6 @@ export const TableCellMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={toggleHeaderCell}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Toggle header cell")}
|
||||
>
|
||||
|
||||
@@ -124,7 +124,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={addColumnLeft}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Add left column")}
|
||||
>
|
||||
@@ -136,7 +135,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={addColumnRight}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Add right column")}
|
||||
>
|
||||
@@ -148,7 +146,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={deleteColumn}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Delete column")}
|
||||
>
|
||||
@@ -162,7 +159,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={addRowAbove}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Add row above")}
|
||||
>
|
||||
@@ -174,7 +170,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={addRowBelow}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Add row below")}
|
||||
>
|
||||
@@ -186,7 +181,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={deleteRow}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Delete row")}
|
||||
>
|
||||
@@ -200,7 +194,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={toggleHeaderRow}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Toggle header row")}
|
||||
>
|
||||
@@ -212,7 +205,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={toggleHeaderColumn}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Toggle header column")}
|
||||
>
|
||||
@@ -226,7 +218,6 @@ export const TableMenu = React.memo(
|
||||
<ActionIcon
|
||||
onClick={deleteTable}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Delete table")}
|
||||
>
|
||||
|
||||
@@ -89,7 +89,6 @@ export const TableTextAlignment: FC<TableTextAlignmentProps> = ({ editor }) => {
|
||||
<Tooltip label={t("Text alignment")} withArrow>
|
||||
<ActionIcon
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
size="lg"
|
||||
aria-label={t("Text alignment")}
|
||||
onClick={() => setOpened(!opened)}
|
||||
|
||||
@@ -131,7 +131,6 @@ export function VideoMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align left")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignLeft })}
|
||||
>
|
||||
<IconLayoutAlignLeft size={18} />
|
||||
@@ -144,7 +143,6 @@ export function VideoMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align center")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignCenter })}
|
||||
>
|
||||
<IconLayoutAlignCenter size={18} />
|
||||
@@ -157,7 +155,6 @@ export function VideoMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Align right")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
className={clsx({ [classes.active]: editorState?.isAlignRight })}
|
||||
>
|
||||
<IconLayoutAlignRight size={18} />
|
||||
@@ -172,7 +169,6 @@ export function VideoMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Download")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconDownload size={18} />
|
||||
</ActionIcon>
|
||||
@@ -184,7 +180,6 @@ export function VideoMenu({ editor }: EditorMenuProps) {
|
||||
size="lg"
|
||||
aria-label={t("Delete")}
|
||||
variant="subtle"
|
||||
c="dark"
|
||||
>
|
||||
<IconTrash size={18} />
|
||||
</ActionIcon>
|
||||
|
||||
Reference in New Issue
Block a user