@atlaskit/editor-core/dist/es5/editor/ui/ContentStyles/index.js

A package contains Atlassian editor core functionality

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var styled_components_1 = require("styled-components");
var styles_1 = require("../../../styles");
var util_shared_styles_1 = require("@atlaskit/util-shared-styles");
var tableStyle = "\n  {\n    border-collapse: collapse;\n    margin: 20px 8px;\n    width: auto;\n    border: 1px solid " + styles_1.akEditorTableBorder + ";\n\n    & {\n      * {\n        box-sizing: border-box;\n      }\n\n      tbody {\n        border-bottom: none;\n      }\n      th td {\n        background-color: white;\n        font-weight: normal;\n      }\n      th, td {\n        min-width: 3em;\n        height: 2.5em;\n        vertical-align: top;\n        border: 1px solid " + styles_1.akEditorTableBorder + ";\n        border-right-width: 0;\n        border-bottom-width: 0;\n        padding: 6px 10px;\n        /* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n        background-clip: padding-box;\n\n        & p {\n          margin: 0;\n        }\n      }\n      th {\n        background-color: " + styles_1.akEditorTableFloatingControls + ";\n        font-weight: bold;\n        text-align: left;\n      }\n      .selectedCell, .hoveredCell {\n        position: relative;\n        border-color: " + styles_1.akEditorTableBorderSelected + ";\n        border-width: 1px;\n      }\n      /* Give selected cells a blue overlay */\n      .selectedCell:after {\n        z-index: 2;\n        position: absolute;\n        content: \"\";\n        left: 0; right: 0; top: 0; bottom: 0;\n        background: " + styles_1.akEditorTableCellSelected + ";\n        opacity: 0.3;\n        pointer-events: none;\n      }\n    }\n  }\n";
// tslint:disable-next-line:variable-name
exports.StyledTable = (_a = ["", ""], _a.raw = ["", ""], styled_components_1.default.table(_a, tableStyle));
// tslint:disable-next-line:variable-name
var ContentStyles = (_b = ["\n  // Hack for ie11 that is being used in code block.\n  // https://bitbucket.org/atlassian/atlaskit/src/ad09f6361109ece1aab316c8cbd8116ffb7963ef/packages/editor-core/src/schema/nodes/code-block.ts?fileviewer=file-view-default#code-block.ts-110\n  & .ie11 {\n    overflow: visible;\n    word-wrap: break-word;\n  }\n\n  .ProseMirror {\n    word-wrap: break-word;\n    white-space: pre-wrap;\n    outline: none;\n  }\n\n  .ProseMirror .placeholder-decoration {\n    position: absolute;\n    width: 100%;\n\n    &::before {\n      content: attr(data-text);\n      color: ", ";\n    }\n  }\n\n  .ProseMirror ul, .ProseMirror ol {\n    padding-left: 30px;\n    cursor: default;\n  }\n\n  .ProseMirror blockquote {\n    padding-left: ", "px;\n    border-left: 2px solid ", ";\n    margin: ", "px 0 0 0;\n    margin-right: 0;\n\n    [dir=\"rtl\"] & {\n      padding-left: 0;\n      padding-right: ", "px;\n    }\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &::before {\n      content: \"\";\n    }\n\n    &::after {\n      content: \"\";\n    }\n  }\n\n  .ProseMirror pre {\n    white-space: pre-wrap;\n  }\n\n  .ProseMirror li {\n    position: relative;\n    /* Dont do weird stuff with marker clicks */\n    pointer-events: none;\n\n    > p:not(:first-child) {\n      margin: 4px 0 0 0;\n    }\n  }\n\n  .ProseMirror ol {\n    & > li,\n    & > li > ol > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li {\n      list-style-type: decimal;\n    }\n\n    & > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li {\n      list-style-type: lower-alpha;\n    }\n\n    & > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li {\n      list-style-type: lower-roman;\n    }\n  }\n\n  .ProseMirror li > * {\n    pointer-events: auto\n  }\n\n  .ProseMirror-hideselection *::selection {\n    background: transparent;\n  }\n\n  .ProseMirror-hideselection *::-moz-selection {\n    background: transparent;\n  }\n\n  .ProseMirror-selectednode {\n    outline: none;\n  }\n\n  .ProseMirror-selectednode:empty {\n    outline: 2px solid #8cf;\n  }\n\n  .ProseMirror-selectednode .ak-mention {\n    background: ", ";\n  }\n\n  /* Make sure li selections wrap around markers */\n  li.ProseMirror-selectednode {\n    outline: none;\n  }\n\n  li.ProseMirror-selectednode:after {\n    content: '';\n    position: absolute;\n    left: -32px;\n    right: -2px;\n    top: -2px;\n    bottom: -2px;\n    border: 2px solid #8cf;\n    pointer-events: none;\n  }\n\n  .ProseMirror blockquote table,\n  .ProseMirror blockquote table:last-child {\n    display: inline-table;\n  }\n  .ProseMirror table ", "\n"], _b.raw = ["\n  // Hack for ie11 that is being used in code block.\n  // https://bitbucket.org/atlassian/atlaskit/src/ad09f6361109ece1aab316c8cbd8116ffb7963ef/packages/editor-core/src/schema/nodes/code-block.ts?fileviewer=file-view-default#code-block.ts-110\n  & .ie11 {\n    overflow: visible;\n    word-wrap: break-word;\n  }\n\n  .ProseMirror {\n    word-wrap: break-word;\n    white-space: pre-wrap;\n    outline: none;\n  }\n\n  .ProseMirror .placeholder-decoration {\n    position: absolute;\n    width: 100%;\n\n    &::before {\n      content: attr(data-text);\n      color: ", ";\n    }\n  }\n\n  .ProseMirror ul, .ProseMirror ol {\n    padding-left: 30px;\n    cursor: default;\n  }\n\n  .ProseMirror blockquote {\n    padding-left: ", "px;\n    border-left: 2px solid ", ";\n    margin: ", "px 0 0 0;\n    margin-right: 0;\n\n    [dir=\"rtl\"] & {\n      padding-left: 0;\n      padding-right: ", "px;\n    }\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &::before {\n      content: \"\";\n    }\n\n    &::after {\n      content: \"\";\n    }\n  }\n\n  .ProseMirror pre {\n    white-space: pre-wrap;\n  }\n\n  .ProseMirror li {\n    position: relative;\n    /* Dont do weird stuff with marker clicks */\n    pointer-events: none;\n\n    > p:not(:first-child) {\n      margin: 4px 0 0 0;\n    }\n  }\n\n  .ProseMirror ol {\n    & > li,\n    & > li > ol > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li {\n      list-style-type: decimal;\n    }\n\n    & > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li {\n      list-style-type: lower-alpha;\n    }\n\n    & > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li,\n    & > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li {\n      list-style-type: lower-roman;\n    }\n  }\n\n  .ProseMirror li > * {\n    pointer-events: auto\n  }\n\n  .ProseMirror-hideselection *::selection {\n    background: transparent;\n  }\n\n  .ProseMirror-hideselection *::-moz-selection {\n    background: transparent;\n  }\n\n  .ProseMirror-selectednode {\n    outline: none;\n  }\n\n  .ProseMirror-selectednode:empty {\n    outline: 2px solid #8cf;\n  }\n\n  .ProseMirror-selectednode .ak-mention {\n    background: ", ";\n  }\n\n  /* Make sure li selections wrap around markers */\n  li.ProseMirror-selectednode {\n    outline: none;\n  }\n\n  li.ProseMirror-selectednode:after {\n    content: '';\n    position: absolute;\n    left: -32px;\n    right: -2px;\n    top: -2px;\n    bottom: -2px;\n    border: 2px solid #8cf;\n    pointer-events: none;\n  }\n\n  .ProseMirror blockquote table,\n  .ProseMirror blockquote table:last-child {\n    display: inline-table;\n  }\n  .ProseMirror table ", "\n"], styled_components_1.default.div(_b, util_shared_styles_1.akColorN80, util_shared_styles_1.akGridSizeUnitless * 2, styles_1.akEditorBlockquoteBorderColor, util_shared_styles_1.akGridSizeUnitless * 1.5, util_shared_styles_1.akGridSizeUnitless * 2, styles_1.akEditorMentionSelected, tableStyle));
exports.default = ContentStyles;
var _a, _b;
//# sourceMappingURL=index.js.map