yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Combine z-index from editor

Browse Source
This commit is contained in:
Tom Moor
2022-04-04 21:50:52 -07:00
parent 0d87de9f80
commit cefceaac3e
5 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/editor/components/CommandMenu.tsx
View File

@@ -10,6 +10,7 @@ import insertFiles from "@shared/editor/commands/insertFiles";
import { CommandFactory } from "@shared/editor/lib/Extension"; import { CommandFactory } from "@shared/editor/lib/Extension";
import filterExcessSeparators from "@shared/editor/lib/filterExcessSeparators"; import filterExcessSeparators from "@shared/editor/lib/filterExcessSeparators";
import { EmbedDescriptor, MenuItem } from "@shared/editor/types"; import { EmbedDescriptor, MenuItem } from "@shared/editor/types";
import { depths } from "@shared/styles";
import { supportedImageMimeTypes } from "@shared/utils/files"; import { supportedImageMimeTypes } from "@shared/utils/files";
import getDataTransferFiles from "@shared/utils/getDataTransferFiles"; import getDataTransferFiles from "@shared/utils/getDataTransferFiles";
import { Dictionary } from "~/hooks/useDictionary"; import { Dictionary } from "~/hooks/useDictionary";
@@ -605,7 +606,7 @@ export const Wrapper = styled.div<{
color: ${(props) => props.theme.text}; color: ${(props) => props.theme.text};
font-family: ${(props) => props.theme.fontFamily}; font-family: ${(props) => props.theme.fontFamily};
position: absolute; position: absolute;
z-index: ${(props) => props.theme.zIndex + 100}; z-index: ${depths.editorToolbar};
${(props) => props.top !== undefined && `top: ${props.top}px`}; ${(props) => props.top !== undefined && `top: ${props.top}px`};
${(props) => props.bottom !== undefined && `bottom: ${props.bottom}px`}; ${(props) => props.bottom !== undefined && `bottom: ${props.bottom}px`};
left: ${(props) => props.left}px; left: ${(props) => props.left}px;

3
app/editor/components/FloatingToolbar.tsx
View File

@@ -4,6 +4,7 @@ import { EditorView } from "prosemirror-view";
import * as React from "react"; import * as React from "react";
import { Portal } from "react-portal"; import { Portal } from "react-portal";
import styled from "styled-components"; import styled from "styled-components";
import { depths } from "@shared/styles";
import useComponentSize from "~/hooks/useComponentSize"; import useComponentSize from "~/hooks/useComponentSize";
import useMediaQuery from "~/hooks/useMediaQuery"; import useMediaQuery from "~/hooks/useMediaQuery";
import useViewportHeight from "~/hooks/useViewportHeight"; import useViewportHeight from "~/hooks/useViewportHeight";
@@ -208,7 +209,7 @@ const Wrapper = styled.div<{
will-change: opacity, transform; will-change: opacity, transform;
padding: 8px 16px; padding: 8px 16px;
position: absolute; position: absolute;
z-index: ${(props) => props.theme.zIndex + 100}; z-index: ${depths.editorToolbar};
opacity: 0; opacity: 0;
background-color: ${(props) => props.theme.toolbarBackground}; background-color: ${(props) => props.theme.toolbarBackground};
border-radius: 4px; border-radius: 4px;

1
app/typings/styled-components.d.ts vendored
View File

@@ -25,7 +25,6 @@ declare module "styled-components" {
fontFamily: string; fontFamily: string;
fontFamilyMono: string; fontFamilyMono: string;
fontWeight: number; fontWeight: number;
zIndex: number;
link: string; link: string;
placeholder: string; placeholder: string;
textSecondary: string; textSecondary: string;

4
shared/styles/depths.ts
View File

@@ -1,8 +1,8 @@
const depths = { const depths = {
header: 800, header: 800,
sidebar: 900, sidebar: 900,
// Note: editor toolbars are 900 editorToolbar: 925,
hoverPreview: 998, hoverPreview: 950,
// Note: editor lightbox is z-index 999 // Note: editor lightbox is z-index 999
modalOverlay: 2000, modalOverlay: 2000,
modal: 3000, modal: 3000,

1
shared/styles/theme.ts
View File

@@ -58,7 +58,6 @@ export const base = {
"'SFMono-Regular',Consolas,'Liberation Mono', Menlo, Courier,monospace", "'SFMono-Regular',Consolas,'Liberation Mono', Menlo, Courier,monospace",
fontWeight: 400, fontWeight: 400,
backgroundTransition: "background 100ms ease-in-out", backgroundTransition: "background 100ms ease-in-out",
zIndex: 800,
selected: colors.primary, selected: colors.primary,
buttonBackground: colors.primary, buttonBackground: colors.primary,
buttonText: colors.white, buttonText: colors.white,