@atlaskit/editor-plugin-table
Version:
Table plugin for the @atlaskit/editor
47 lines (43 loc) • 1.43 kB
JavaScript
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { css } from '@emotion/react';
import { tableBackgroundBorderColor } from '@atlaskit/adf-schema';
import { TableCssClassName as ClassName } from '../../types';
import { contextualMenuDropdownWidthDnD } from '../consts';
export const cellColourPreviewStyles = selectedColor => css({
'&::before': {
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
background: selectedColor
}
});
export const tablePopupStyles = () => css`
.${ClassName.CONTEXTUAL_SUBMENU} {
border-radius: ${"var(--ds-radius-small, 3px)"};
background: ${"var(--ds-surface-overlay, #FFFFFF)"};
box-shadow: ${"var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)"};
display: block;
position: absolute;
top: 0;
left: ${contextualMenuDropdownWidthDnD}px;
padding: ${"var(--ds-space-100, 8px)"};
> div {
padding: 0;
}
}
.${ClassName.CONTEXTUAL_MENU_ICON_SMALL} {
display: flex;
&::before {
content: '';
display: block;
border: 1px solid ${tableBackgroundBorderColor};
border-radius: ${"var(--ds-radius-small, 3px)"};
width: 14px;
height: 14px;
}
&::after {
content: '›';
margin-left: ${"var(--ds-space-050, 4px)"};
line-height: 14px;
color: ${"var(--ds-icon, #292A2E)"};
}
}
`;