diff --git a/create.sh b/create.sh
deleted file mode 100755
index 1f234beae5eaaf46e7c4642bb792c06914c46883..0000000000000000000000000000000000000000
--- a/create.sh
+++ /dev/null
@@ -1,23 +0,0 @@
-#!/bin/bash
-if [ -z "$1" ]
-then
-echo -e "\e[01;31mError\e[0m Name is missing" >&2
-exit
-else
-cd editors
-yarn create react-app $1
-cd $1
-npm install react-app-rewired --save-dev
-cp ../editoria/config-overrides.js ./
-cp ../editoria/package.json ./
-cp ../editoria/src/* ./src/
-rm -rf src/App.css
-rm -rf src/App.js
-rm -rf src/index.css
-rm -rf src/App.test.js
-rm -rf src/logo.svg
-sed -i "s/editoria/$1/" package.json
-cd ../../
-sed -i '/"build": "lerna run build --concurrency=1 --stream",/a "'$1'": "cd editors/'$1' && yarn start",' package.json
-yarn $1
-fi
diff --git a/editors/demo/src/Editoria/layout/EditorElements.js b/editors/demo/src/Editoria/layout/EditorElements.js
index c6d44d363c8bf8c02e55a0f60785465b5441e79a..fbab00cdf1b7c807c7d1e605c0e5de0c342f2176 100644
--- a/editors/demo/src/Editoria/layout/EditorElements.js
+++ b/editors/demo/src/Editoria/layout/EditorElements.js
@@ -1,474 +1,5 @@
import { css } from 'styled-components';
-import { lighten, th } from '@pubsweet/ui-toolkit';
-
/* All styles regarding ProseMirror surface and elements */
-const fontWriting = css`
- font-family: ${th('fontWriting')};
- font-size: ${th('fontSizeBase')};
- color: ${th('colorText')};
-`;
-
-export default css`
- .ProseMirror {
- background: white;
- counter-reset: footnote;
- line-height: 1.6;
- ${fontWriting}
-
- p::selection,
- h1::selection,
- h2::selection,
- h3::selection,
- code::selection,
- span::selection,
- p span::selection,
- h1 span::selection,
- h2 span::selection,
- h3 span::selection,
- h4 span::selection,
- code span::selection,
- custom-tag-block::selection,
- custom-tag-inline::selection {
- background-color: transparent;
- color: #000;
- }
-
- &:focus {
- outline: none;
- }
- }
-
- .ProseMirror .wax-selection-marker {
- background-color: ${th('colorSelection')};
- opacity: 0.8;
- }
-
- div[contenteditable='false'] {
- pointer-events: none;
- user-select: none;
- }
-
- /* .ProseMirror title {
- display: inline;
- font-size: 14px;
- } */
-
- .ProseMirror footnote {
- font-variant-numeric: lining-nums proportional-nums;
- display: inline-block;
- text-align: center;
- width: 17px;
- height: 17px;
- background: white;
- border-bottom: 2px solid black;
- color: black;
- cursor: pointer;
- }
-
- .ProseMirror footnote::after {
- content: counter(footnote);
- position: relative;
- bottom: 2px;
- font-size: 16px;
- counter-increment: footnote;
- }
-
- hr {
- padding: 2px 10px;
- border: none;
- margin: 1em 0;
- }
-
- hr:after {
- content: '';
- display: block;
- height: 1px;
- background-color: silver;
- line-height: 2px;
- }
-
- ul,
- ol {
- padding-left: 30px;
- }
-
- blockquote {
- padding-left: 1em;
- border-left: 3px solid #eee;
- margin-left: 0;
- margin-right: 0;
- }
-
- figure {
- display: table;
- margin-left: auto;
- margin-right: auto;
- word-break: break-word;
-
- img {
- cursor: default;
- height: auto;
- max-width: 100%;
- width: auto;
- }
-
- figcaption {
- background: #e2ebff;
- caption-side: bottom;
- display: table-caption;
- max-width: 100%;
- min-height: 20px;
- padding: 4px;
- width: auto;
-
- &:focus {
- outline: none;
- }
- &:before {
- content: 'Caption: ';
- font-weight: bold;
- }
- }
- }
-
- sup,
- sub {
- line-height: 0;
- }
-
- strong {
- font-weight: bold;
- }
-
- /* Tables */
-
- table {
- border-collapse: initial;
- border-spacing: 0;
- border-width: 0 thin thin 0;
- border: 1px solid #eee;
- table-layout: fixed;
- width: 100%;
- margin: 0;
- overflow: hidden;
- page-break-inside: avoid;
- }
-
- th,
- td {
- border: 1px solid #eee;
- /*width: 200px;*/
- padding: 2px 5px;
- vertical-align: top;
- box-sizing: border-box;
- position: relative;
- }
-
- .tableWrapper {
- overflow-x: auto;
- }
-
- .column-resize-handle {
- position: absolute;
- right: -2px;
- top: 0;
- bottom: 0;
- width: 4px;
- z-index: 20;
- background-color: #adf;
- pointer-events: none;
- }
-
- .ProseMirror.resize-cursor {
- cursor: ew-resize;
- cursor: col-resize;
- }
- /* Give selected cells a blue overlay */
- .selectedCell:after {
- z-index: 2;
- position: absolute;
- content: '';
- left: 0;
- right: 0;
- top: 0;
- bottom: 0;
- background: rgba(200, 200, 255, 0.4);
- pointer-events: none;
- }
-
- /* placeholder */
- .empty-node::before {
- color: #aaa;
- float: left;
- font-style: italic;
- pointer-events: none;
- height: 0;
- }
-
- p.empty-node:first-child::before {
- content: attr(data-content);
- }
-
- /* invisible characters */
- .invisible {
- pointer-events: none;
- user-select: none;
- }
-
- .invisible:before {
- caret-color: inherit;
- color: gray;
- display: inline-block;
- font-weight: 400;
- font-style: normal;
- line-height: 1em;
- width: 0;
- }
-
- .invisible--space:before {
- content: '·';
- }
-
- .invisible--break:before {
- content: '¬';
- }
-
- .invisible--par:after {
- content: '¶';
- }
-
- span.deletion {
- text-decoration: line-through;
- color: ${th('colorError')};
- footnote {
- background: ${th('colorError')};
- }
- }
-
- span.insertion {
- color: royalblue;
- footnote {
- background: royalblue;
- }
- }
-
- .selected-insertion {
- background: ${lighten('royalblue', 0.65)};
- }
-
- .selected-deletion {
- background: ${lighten('indianred', 0.65)};
- }
-
- .selected-format-change,
- .selected-block-change {
- background-color: #eefbfb;
- }
-
- .format-change {
- border-bottom: 2px solid royalblue;
- }
-
- [data-track] {
- position: relative;
- }
-
- [data-track]::before {
- content: '';
- position: absolute;
- border-left: 2px solid royalblue;
- left: -10px;
- height: 100%;
- }
-
- .insertion .show-insertion {
- color: black;
- }
-
- .deletion .hide-deletion {
- display: none;
- }
-
- li[data-track]::before,
- li [data-track]::before {
- left: -5px;
- }
-
- span.comment {
- border-bottom: 2px solid gold;
- border-radius: 3px 3px 0 0;
-
- .active-comment {
- background-color: gold;
- /* color: black; */
- }
- }
-
- span.search-result {
- background: #bee594;
- }
-
- /* == Math Nodes ======================================== */
-
- .math-node {
- min-width: 1em;
- min-height: 1em;
- font-size: 0.95em;
- font-family: 'Consolas', 'Ubuntu Mono', monospace;
- cursor: auto;
- .ProseMirror {
- box-shadow: none;
- min-height: 100%;
- padding: 0;
- background: #eee;
- color: rgb(132, 33, 162);
- }
- }
-
- .math-node.empty-math .math-render::before {
- content: '(empty)';
- color: red;
- }
-
- .math-node .math-render.parse-error::before {
- content: '(math error)';
- color: red;
- cursor: help;
- }
-
- .math-node.ProseMirror-selectednode {
- outline: none;
- }
-
- .math-node .math-src {
- display: none;
- color: rgb(132, 33, 162);
- tab-size: 4;
- }
-
- .math-node.ProseMirror-selectednode .math-src {
- display: inline-flex;
- }
- .math-node.ProseMirror-selectednode .math-render {
- display: none;
- }
-
- /* -- Inline Math --------------------------------------- */
-
- math-inline {
- display: inline;
- white-space: nowrap;
- }
-
- math-inline .math-render {
- display: inline-block;
- font-size: 0.85em;
- cursor: pointer;
- }
-
- math-inline .math-src .ProseMirror {
- display: inline;
- }
-
- math-inline .math-src::after,
- math-inline .math-src::before {
- content: '$';
- color: #b0b0b0;
- }
-
- /* -- Block Math ---------------------------------------- */
-
- math-display {
- display: block;
- }
-
- math-display .math-render {
- display: block;
- text-align: center;
- }
-
- math-display.ProseMirror-selectednode {
- background-color: #eee;
- }
-
- math-display .math-src .ProseMirror {
- width: 100%;
- display: block;
- }
-
- math-display .math-src::after,
- math-display .math-src::before {
- content: '$$';
- text-align: left;
- color: #b0b0b0;
- }
-
- /* -- Selection Plugin ---------------------------------- */
-
- p::selection,
- p > *::selection {
- background-color: #c0c0c0;
- }
- .katex-html *::selection {
- background-color: none !important;
- }
-
- .math-node.math-select .math-render {
- background-color: #c0c0c0ff;
- }
- math-inline.math-select .math-render {
- padding-top: 2px;
- }
-
- span[data-type='inline'] {
- display: inline;
- font-weight: 500;
- }
-
- span[data-type='inline']:before {
- color: #006f19;
- content: ' | ';
- font-weight: 600;
- margin-left: 0;
- }
-
- span[data-type='inline']:after {
- color: #006f19;
- content: ' | ';
- display: inline;
- font-weight: 600;
- }
-
- p[data-type='block'] {
- display: block;
- margin-top: 1em;
- }
-
- p[data-type='block']:before {
- color: #006f19;
- content: '⌜';
- display: inline;
- font-weight: 600;
- font-size: 22px;
- position: relative;
- top: 2px;
- left: 6px;
- }
-
- p[data-type='block']:after {
- color: #006f19;
- content: '⌟';
- display: inline;
- font-weight: 600;
- font-size: 22px;
- position: relative;
- top: 5px;
- right: 6px;
- }
-
- .transform-icon {
- transform: rotate(40deg);
- }
-`;
+export default css``;
diff --git a/editors/demo/src/Editoria/layout/EditoriaLayout.js b/editors/demo/src/Editoria/layout/EditoriaLayout.js
index ee26f2e5ad3e9e0dcbcbde68d94ea62403d96143..3b4478111af461fb175c0ad23c6899ffd48c3739 100644
--- a/editors/demo/src/Editoria/layout/EditoriaLayout.js
+++ b/editors/demo/src/Editoria/layout/EditoriaLayout.js
@@ -157,7 +157,6 @@ const NotesAreaContainer = styled.div`
overflow-y: scroll;
position: absolute;
/* PM styles for note content*/
- ${EditorElements};
.ProseMirror {
display: inline;
}
diff --git a/editors/demo/src/HHMI/HHMI.js b/editors/demo/src/HHMI/HHMI.js
index 5853fc581bebc801c9ddc10b0df5a177f723ac27..09c338aa8b24e039827db5350327ba3330ae5cec 100644
--- a/editors/demo/src/HHMI/HHMI.js
+++ b/editors/demo/src/HHMI/HHMI.js
@@ -16,9 +16,15 @@ const renderImage = file => {
});
};
+const ReadOnlyButton = styled.button`
+ position: absolute;
+ left: 550px;
+ top: 16px;
+`;
+
const SubmitButton = styled.button`
position: absolute;
- left: 600px;
+ left: 650px;
top: 16px;
`;
@@ -40,6 +46,11 @@ const t = `<p class="paragraph"></p>
const Hhmi = () => {
const [submited, isSubmited] = useState(false);
const [readOnly, isReadOnly] = useState(false);
+
+ const readOnlyQuestions = () => {
+ isReadOnly(true);
+ };
+
const submitQuestions = () => {
isSubmited(true);
isReadOnly(true);
@@ -47,6 +58,7 @@ const Hhmi = () => {
return (
<>
+ <ReadOnlyButton onClick={readOnlyQuestions}>Read Only</ReadOnlyButton>
<SubmitButton onClick={submitQuestions}>Submit</SubmitButton>
<Wax
config={config}
diff --git a/editors/demo/src/HHMI/layout/EditorElements.js b/editors/demo/src/HHMI/layout/EditorElements.js
index 6385a12476a44c7cdefc72f1350e695c4ff63823..fbab00cdf1b7c807c7d1e605c0e5de0c342f2176 100644
--- a/editors/demo/src/HHMI/layout/EditorElements.js
+++ b/editors/demo/src/HHMI/layout/EditorElements.js
@@ -1,415 +1,5 @@
import { css } from 'styled-components';
-import { th } from '@pubsweet/ui-toolkit';
-
-//import 'wax-prosemirror-core/dist/index.css';
-
/* All styles regarding ProseMirror surface and elements */
-const fontWriting = css`
- color: ${th('colorText')};
- font-family: ${th('fontWriting')};
- font-size: ${th('fontSizeBase')};
-`;
-
-export default css`
- .ProseMirror {
- background: white;
- counter-reset: multiple-question;
- line-height: 1.6;
- ${fontWriting}
-
- p::selection,
- h1::selection,
- h2::selection,
- h3::selection,
- code::selection,
- span::selection,
- p span::selection,
- h1 span::selection,
- h2 span::selection,
- h3 span::selection,
- h4 span::selection,
- code span::selection,
- custom-tag-block::selection,
- custom-tag-inline::selection {
- background-color: transparent;
- color: #000;
- }
-
- &:focus {
- outline: none;
- }
- }
-
- .ProseMirror .wax-selection-marker {
- background-color: ${th('colorSelection')};
- opacity: 0.8;
- }
-
- div[contenteditable='false'] {
- .math-src {
- pointer-events: none;
- user-select: none;
- }
- }
-
- ul,
- ol {
- padding-left: 30px;
- }
-
- blockquote {
- border-left: 3px solid #eee;
- margin-left: 0;
- margin-right: 0;
- padding-left: 1em;
- }
-
- figure {
- display: table;
- margin-left: auto;
- margin-right: auto;
- word-break: break-word;
-
- img {
- cursor: default;
- height: auto;
- max-width: 100%;
- width: auto;
- }
-
- figcaption {
- background: #e2ebff;
- caption-side: bottom;
- display: table-caption;
- max-width: 100%;
- min-height: 20px;
- padding: 4px;
- width: auto;
-
- &:focus {
- outline: none;
- }
- &:before {
- content: 'Caption: ';
- font-weight: bold;
- }
- }
- }
-
- sup,
- sub {
- line-height: 0;
- }
-
- strong {
- font-weight: bold;
- }
-
- /* Tables */
-
- table {
- border: 1px solid #eee;
- border-collapse: initial;
- border-spacing: 0;
- border-width: 0 thin thin 0;
- margin: 0;
- overflow: hidden;
- page-break-inside: avoid;
- table-layout: fixed;
- width: 100%;
- }
-
- th,
- td {
- border: 1px solid #eee;
- /*width: 200px;*/
- padding: 2px 5px;
- vertical-align: top;
- box-sizing: border-box;
- position: relative;
- }
-
- .tableWrapper {
- overflow-x: auto;
- }
-
- .column-resize-handle {
- background-color: #adf;
- bottom: 0;
- pointer-events: none;
- position: absolute;
- right: -2px;
- top: 0;
- width: 4px;
- z-index: 20;
- }
-
- .ProseMirror.resize-cursor {
- cursor: ew-resize;
- cursor: col-resize;
- }
- /* Give selected cells a blue overlay */
- .selectedCell:after {
- background: rgba(200, 200, 255, 0.4);
- bottom: 0;
- content: '';
- left: 0;
- pointer-events: none;
- position: absolute;
- right: 0;
- top: 0;
- z-index: 2;
- }
-
- /* placeholder */
- .empty-node::before {
- color: #aaa;
- float: left;
- font-style: italic;
- pointer-events: none;
- height: 0;
- }
-
- p.empty-node:first-child::before {
- content: attr(data-content);
- }
-
- /* invisible characters */
- .invisible {
- pointer-events: none;
- user-select: none;
- }
-
- .invisible:before {
- caret-color: inherit;
- color: gray;
- display: inline-block;
- font-weight: 400;
- font-style: normal;
- line-height: 1em;
- width: 0;
- }
-
- .invisible--space:before {
- content: '·';
- }
-
- .invisible--break:before {
- content: '¬';
- }
-
- .invisible--par:after {
- content: '¶';
- }
-
- /* == Math Nodes ======================================== */
-
- .math-node {
- min-width: 1em;
- min-height: 1em;
- font-size: 0.95em;
- font-family: 'Consolas', 'Ubuntu Mono', monospace;
- cursor: auto;
- .ProseMirror {
- box-shadow: none;
- min-height: 100%;
- padding: 0;
- background: #eee;
- color: rgb(132, 33, 162);
- }
- }
-
- .math-node.empty-math .math-render::before {
- content: '(empty)';
- color: red;
- }
-
- .math-node .math-render.parse-error::before {
- content: '(math error)';
- color: red;
- cursor: help;
- }
-
- .math-node.ProseMirror-selectednode {
- outline: none;
- }
-
- .math-node .math-src {
- color: rgb(132, 33, 162);
- display: none;
- tab-size: 4;
- }
-
- .math-node.ProseMirror-selectednode .math-src {
- display: flex;
- }
- .math-node.ProseMirror-selectednode .math-render {
- display: none;
- }
-
- /* -- Inline Math --------------------------------------- */
-
- math-inline {
- display: inline;
- white-space: nowrap;
- }
-
- math-inline .math-render {
- display: inline-block;
- font-size: 0.85em;
- cursor: pointer;
- }
-
- math-inline .math-src .ProseMirror {
- display: inline;
- }
-
- math-inline .math-src::after,
- math-inline .math-src::before {
- content: '$';
- color: #b0b0b0;
- }
-
- /* -- Block Math ---------------------------------------- */
-
- math-display {
- display: block;
- }
-
- math-display .math-render {
- display: block;
- text-align: center;
- }
-
- math-display.ProseMirror-selectednode {
- background-color: #eee;
- }
-
- math-display .math-src .ProseMirror {
- width: 100%;
- display: block;
- }
-
- math-display .math-src::after,
- math-display .math-src::before {
- content: '$$';
- text-align: left;
- color: #b0b0b0;
- }
-
- /* -- Selection Plugin ---------------------------------- */
-
- p::selection,
- p > *::selection {
- background-color: #c0c0c0;
- }
- .katex-html *::selection {
- background-color: none !important;
- }
-
- .math-node.math-select .math-render {
- background-color: #c0c0c0ff;
- }
- math-inline.math-select .math-render {
- padding-top: 2px;
- }
-
- .transform-icon {
- transform: rotate(40deg);
- }
-
- /* -- Questions ---------------------------------- */
-
- /* -- Multiple Choice ---------------------------------- */
-
- .multiple-choice,
- .multiple-choice-single-correct,
- .true-false,
- .true-false-single-correct {
- border: 3px solid #f5f5f7;
- counter-reset: question-item-multiple;
- margin: 38px;
- padding: 20px;
- padding-top: 0px;
-
- &:before {
- bottom: 25px;
- counter-increment: multiple-question;
- position: relative;
- right: 20px;
- }
-
- .ProseMirror {
- box-shadow: none;
- padding: 5px 5px 0 5px;
- }
- }
-
- .multiple-choice {
- &:before {
- content: 'Answer Group ' counter(multiple-question) ' (multiple choice)';
- }
- }
-
- .multiple-choice-single-correct {
- &:before {
- content: 'Answer Group ' counter(multiple-question)
- ' (multiple choice single correct)';
- }
- }
-
- .true-false {
- &:before {
- content: 'Answer Group ' counter(multiple-question) ' (true/false)';
- }
- }
-
- .true-false-single-correct {
- &:before {
- content: 'Answer Group ' counter(multiple-question)
- ' (true/false single correct)';
- }
- }
-
- /* -- Fill The Gap ---------------------------------- */
-
- .fill-the-gap {
- border: 3px solid #f5f5f7;
- margin-bottom: 30px;
- margin-top: 30px;
- padding: 3px;
-
- &:before {
- background-color: #fff;
- bottom: 22px;
- color: #535e76;
- content: 'Fill The Gap';
- height: 10px;
- left: -1px;
- position: relative;
- width: 30px;
- }
- }
-
- /* -- Essay ---------------------------------- */
-
- .essay {
- border: 3px solid #f5f5f7;
- margin-bottom: 30px;
- margin-top: 30px;
- padding: 3px;
-
- &:before {
- background-color: #fff;
- bottom: 22px;
- color: #535e76;
- content: 'Essay';
- height: 10px;
- left: -1px;
- position: relative;
- width: 30px;
- }
- }
-`;
+export default css``;
diff --git a/editors/demo/src/NCBI/layout/EditorElements.js b/editors/demo/src/NCBI/layout/EditorElements.js
index 4ad04d332db3b9c3640c8b407465c910b6e14c13..6afafdfe43360117963bc324d86d217f038ace97 100644
--- a/editors/demo/src/NCBI/layout/EditorElements.js
+++ b/editors/demo/src/NCBI/layout/EditorElements.js
@@ -10,56 +10,4 @@ const fontWriting = css`
font-size: ${th('fontSizeBase')};
`;
-export default css`
- .ProseMirror {
- background: white;
- counter-reset: footnote;
- line-height: 12px;
- width: 497px;
- white-space: pre !important;
- overflow-x: auto;
- ${fontWriting}
-
- p::selection,
- h1::selection,
- h2::selection,
- h3::selection,
- code::selection,
- span::selection,
- p span::selection,
- h1 span::selection,
- h2 span::selection,
- h3 span::selection,
- code span::selection title::selection {
- background-color: transparent;
- }
-
- &:focus {
- outline: none;
- }
- }
-
- .ProseMirror .wax-selection-marker {
- background-color: ${th('colorSelection')};
- }
-
- div[contenteditable='false'] {
- pointer-events: none;
- user-select: none;
- }
-
- .ProseMirror title {
- display: inline;
- font-size: 14px;
- }
-
- ul,
- ol {
- padding-left: 30px;
- }
-
- sup,
- sub {
- line-height: 0;
- }
-`;
+export default css``;
diff --git a/wax-prosemirror-components/src/components/specialCharacters/SpecialCharactersComponent.js b/wax-prosemirror-components/src/components/specialCharacters/SpecialCharactersComponent.js
index 6796de0d9ca1eaf3bbad414b039eae0ffe8bf4c5..56883014deef563af5ceba149561158fa68eff28 100644
--- a/wax-prosemirror-components/src/components/specialCharacters/SpecialCharactersComponent.js
+++ b/wax-prosemirror-components/src/components/specialCharacters/SpecialCharactersComponent.js
@@ -91,28 +91,22 @@ const SpecialCharacter = styled.div`
border: 1px solid ${th('colorPrimary')};
border-radius: 50%;
&:hover {
- background: white;
+ background: ${th('colorPrimary')};
}
span {
font-size: 16px;
text-align: center;
padding-top: 3px;
- color: white;
+ color: ${th('colorPrimary')};
&:hover {
- color: ${th('colorPrimary')};
+ color: #fff;
}
}
${override('Wax.SpecialCharacterButton')}
`;
-// const LastUsedComponent = styled.div`
-// display: flex;
-// flex-direction: row;
-// height: 30px;
-// `;
-
const SpecialCharactersComponent = ({ close }) => {
const searchRef = useRef(null);
const { activeView } = useContext(WaxContext);
@@ -191,11 +185,11 @@ const SpecialCharactersComponent = ({ close }) => {
<Wrapper>
<SearchInputContainer>
<SearchInput
+ onChange={onChange}
+ placeholder="Search"
ref={searchRef}
type="text"
- placeholder="Search"
value={searchValue}
- onChange={onChange}
/>
</SearchInputContainer>
<CharactersListComponent>{renderList()}</CharactersListComponent>
diff --git a/wax-prosemirror-core/src/styles/styles.css b/wax-prosemirror-core/src/styles/styles.css
index a73cd4dbfddb7adf7e5bb93aae3795c9452313da..ef185effd7733f364651d8e1a9914091f416b4d3 100644
--- a/wax-prosemirror-core/src/styles/styles.css
+++ b/wax-prosemirror-core/src/styles/styles.css
@@ -1,14 +1,22 @@
/* Basic styles for proseMirror view and gapCursor */
-
.ProseMirror {
+ background: #fff;
+ color: #111;
font-feature-settings: 'liga' 0; /* the above doesn't seem to work in Edge */
+ font-family: 'Merriweather';
font-variant-ligatures: none;
+ line-height: 1.6;
+ font-size: 14px;
word-wrap: break-word;
white-space: pre-wrap;
white-space: break-spaces;
-webkit-font-variant-ligatures: none;
}
+.ProseMirror:focus {
+ outline: none;
+}
+
.ProseMirror pre {
white-space: pre-wrap;
}
@@ -82,3 +90,161 @@ img.ProseMirror-separator {
.ProseMirror-focused .ProseMirror-gapcursor {
display: block;
}
+
+/* Read-Only */
+
+ /* div[contenteditable='false'] {
+ pointer-events: none;
+ user-select: none;
+ } */
+
+
+/* placeholder */
+ .empty-node::before {
+ color: #aaa;
+ float: left;
+ font-style: italic;
+ pointer-events: none;
+ height: 0;
+ }
+
+ p.empty-node:first-child::before {
+ content: attr(data-content);
+ }
+
+ /* invisible characters */
+ .invisible {
+ pointer-events: none;
+ user-select: none;
+ }
+
+ .invisible:before {
+ caret-color: inherit;
+ color: gray;
+ display: inline-block;
+ font-weight: 400;
+ font-style: normal;
+ line-height: 1em;
+ width: 0;
+ }
+
+ .invisible--space:before {
+ content: '·';
+ }
+
+ .invisible--break:before {
+ content: '¬';
+ }
+
+ .invisible--par:after {
+ content: '¶';
+ }
+
+
+/* -- Selection Plugin ---------------------------------- */
+
+ p::selection,
+ p > *::selection {
+ background-color: #c0c0c0;
+ }
+ .katex-html *::selection {
+ background-color: none !important;
+ }
+
+ .math-node.math-select .math-render {
+ background-color: #c0c0c0ff;
+ }
+ math-inline.math-select .math-render {
+ padding-top: 2px;
+ }
+
+ span[data-type='inline'] {
+ display: inline;
+ font-weight: 500;
+ }
+
+ span[data-type='inline']:before {
+ color: #006f19;
+ content: ' | ';
+ font-weight: 600;
+ margin-left: 0;
+ }
+
+ span[data-type='inline']:after {
+ color: #006f19;
+ content: ' | ';
+ display: inline;
+ font-weight: 600;
+ }
+
+ p[data-type='block'] {
+ display: block;
+ margin-top: 1em;
+ }
+
+ p[data-type='block']:before {
+ color: #006f19;
+ content: '⌜';
+ display: inline;
+ font-weight: 600;
+ font-size: 22px;
+ position: relative;
+ top: 2px;
+ left: 6px;
+ }
+
+ p[data-type='block']:after {
+ color: #006f19;
+ content: '⌟';
+ display: inline;
+ font-weight: 600;
+ font-size: 22px;
+ position: relative;
+ top: 5px;
+ right: 6px;
+ }
+
+ .transform-icon {
+ transform: rotate(40deg);
+ }
+
+ /* hr */
+
+ hr {
+ padding: 2px 10px;
+ border: none;
+ margin: 1em 0;
+ }
+
+ hr:after {
+ content: '';
+ display: block;
+ height: 1px;
+ background-color: silver;
+ line-height: 2px;
+ }
+
+ /* Wax Selection Marker */
+ .ProseMirror .wax-selection-marker {
+ background-color: #C5D7FE;
+ opacity: 0.8;
+ }
+
+ .ProseMirror p::selection,
+ .ProseMirror h1::selection,
+ .ProseMirror h2::selection,
+ .ProseMirror h3::selection,
+ .ProseMirror code::selection,
+ .ProseMirror span::selection,
+ .ProseMirror p span::selection,
+ .ProseMirror h1 span::selection,
+ .ProseMirror h2 span::selection,
+ .ProseMirror h3 span::selection,
+ .ProseMirror h4 span::selection,
+ .ProseMirror code span::selection,
+ .ProseMirror custom-tag-block::selection,
+ .ProseMirror custom-tag-inline::selection,
+ #notes-container div::selection {
+ background-color: transparent;
+ color: #000;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/CommentsService/CommentsService.js b/wax-prosemirror-services/src/CommentsService/CommentsService.js
index 13079c31804fca9183479914aab0ec3d490c23fa..989f1cf7899ec3ffaaa9afbae2780e0ed61d4fdc 100644
--- a/wax-prosemirror-services/src/CommentsService/CommentsService.js
+++ b/wax-prosemirror-services/src/CommentsService/CommentsService.js
@@ -2,6 +2,7 @@ import { commentMark } from 'wax-prosemirror-schema';
import { RightArea, CommentBubbleComponent } from 'wax-prosemirror-components';
import { CommentPlugin, CopyPasteCommentPlugin } from 'wax-prosemirror-plugins';
import Service from '../Service';
+import './comments.css';
const PLUGIN_KEY = 'commentPlugin';
diff --git a/wax-prosemirror-services/src/CommentsService/comments.css b/wax-prosemirror-services/src/CommentsService/comments.css
new file mode 100644
index 0000000000000000000000000000000000000000..3f7045dfc3db4b7a2c55e9f98c144a1f513f550e
--- /dev/null
+++ b/wax-prosemirror-services/src/CommentsService/comments.css
@@ -0,0 +1,11 @@
+ /* Comments */
+
+ span.comment {
+ border-bottom: 2px solid gold;
+ border-radius: 3px 3px 0 0;
+ }
+
+ span.comment .active-comment {
+ background-color: gold;
+ /* color: black; */
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/EssayService/EssayService.js b/wax-prosemirror-services/src/EssayService/EssayService.js
index ca55033de74e5d49d108765cdfeb686a43403d6c..761e9aa834fe14b1fa6a3d097129ac90e242dcfa 100644
--- a/wax-prosemirror-services/src/EssayService/EssayService.js
+++ b/wax-prosemirror-services/src/EssayService/EssayService.js
@@ -7,6 +7,7 @@ import EssayQuestionComponent from './components/EssayQuestionComponent';
import EssayAnswerComponent from './components/EssayAnswerComponent';
import EssayQuestionNodeView from './EssayQuestionNodeView';
import EssayAnswerNodeView from './EssayAnswerNodeView';
+import './essay.css';
class EssayService extends Service {
register() {
diff --git a/wax-prosemirror-services/src/EssayService/essay.css b/wax-prosemirror-services/src/EssayService/essay.css
new file mode 100644
index 0000000000000000000000000000000000000000..a1649d9e7b60b9541530e40246ba88ae18ed363c
--- /dev/null
+++ b/wax-prosemirror-services/src/EssayService/essay.css
@@ -0,0 +1,18 @@
+ /* -- Essay ---------------------------------- */
+ .essay {
+ border: 3px solid #f5f5f7;
+ margin-bottom: 30px;
+ margin-top: 30px;
+ padding: 3px;
+ }
+
+ essay::before {
+ background-color: #fff;
+ bottom: 22px;
+ color: #535e76;
+ content: 'Essay';
+ height: 10px;
+ left: -1px;
+ position: relative;
+ width: 30px;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/FillTheGapQuestionService/FillTheGapQuestionService.js b/wax-prosemirror-services/src/FillTheGapQuestionService/FillTheGapQuestionService.js
index 4c378b7d81906831564039a854b2936649efa149..81726572c493dabadd777268ee86f06d4ecac43d 100644
--- a/wax-prosemirror-services/src/FillTheGapQuestionService/FillTheGapQuestionService.js
+++ b/wax-prosemirror-services/src/FillTheGapQuestionService/FillTheGapQuestionService.js
@@ -5,6 +5,7 @@ import fillTheGapNode from './schema/fillTheGapNode';
import CreateGapService from './CreateGapService/CreateGapService';
import FillTheGapNodeView from './FillTheGapNodeView';
import GapComponent from './components/GapComponent';
+import './fillTheGap.css';
class FillTheGapQuestionService extends Service {
register() {
diff --git a/wax-prosemirror-services/src/FillTheGapQuestionService/fillTheGap.css b/wax-prosemirror-services/src/FillTheGapQuestionService/fillTheGap.css
new file mode 100644
index 0000000000000000000000000000000000000000..0644fabcc9d5890d7d5eeb203acfae9eeeea4fa1
--- /dev/null
+++ b/wax-prosemirror-services/src/FillTheGapQuestionService/fillTheGap.css
@@ -0,0 +1,17 @@
+ .fill-the-gap {
+ border: 3px solid #f5f5f7;
+ margin-bottom: 30px;
+ margin-top: 30px;
+ padding: 3px;
+ }
+
+ .fill-the-gap::before {
+ background-color: #fff;
+ bottom: 22px;
+ color: #535e76;
+ content: 'Fill The Gap';
+ height: 10px;
+ left: -1px;
+ position: relative;
+ width: 30px;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/FindAndReplaceService/FindAndReplaceService.js b/wax-prosemirror-services/src/FindAndReplaceService/FindAndReplaceService.js
index fbe424b88eb23b33b21084b8c8d32c71a817608e..55843ca8e2ed0e30495e65c0229b6265ce92ab2c 100644
--- a/wax-prosemirror-services/src/FindAndReplaceService/FindAndReplaceService.js
+++ b/wax-prosemirror-services/src/FindAndReplaceService/FindAndReplaceService.js
@@ -1,6 +1,7 @@
import { FindAndReplacePlugin } from 'wax-prosemirror-plugins';
import Service from '../Service';
import FindAndReplace from './FindAndReplace';
+import './findAndReplace.css';
class FindAndReplaceService extends Service {
name = 'FindAndReplaceService';
diff --git a/wax-prosemirror-services/src/FindAndReplaceService/findAndReplace.css b/wax-prosemirror-services/src/FindAndReplaceService/findAndReplace.css
new file mode 100644
index 0000000000000000000000000000000000000000..b862494f4dd83fd3f51614923e122e849f5dff0e
--- /dev/null
+++ b/wax-prosemirror-services/src/FindAndReplaceService/findAndReplace.css
@@ -0,0 +1,5 @@
+
+ /* find and Replace */
+ span.search-result {
+ background: #bee594;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/ImageService/ImageService.js b/wax-prosemirror-services/src/ImageService/ImageService.js
index 13b1612440ad896c18d1d7350cc2c484f1caf393..d45d2074a100bc770ee5a7982205ced3b51eed92 100644
--- a/wax-prosemirror-services/src/ImageService/ImageService.js
+++ b/wax-prosemirror-services/src/ImageService/ImageService.js
@@ -6,6 +6,7 @@ import {
import { PlaceHolderPlugin, captionPlugin } from 'wax-prosemirror-plugins';
import Service from '../Service';
import Image from './Image';
+import './image.css';
class ImageService extends Service {
name = 'ImageService';
@@ -31,11 +32,12 @@ class ImageService extends Service {
},
{ toWaxSchema: true },
);
- createNode({
- figcaption: figureCaptionNode,
- }
- // ,
- // { toWaxSchema: true },
+ createNode(
+ {
+ figcaption: figureCaptionNode,
+ },
+ // ,
+ // { toWaxSchema: true },
);
}
}
diff --git a/wax-prosemirror-services/src/ImageService/image.css b/wax-prosemirror-services/src/ImageService/image.css
new file mode 100644
index 0000000000000000000000000000000000000000..420c8b2620bebb463a66824c103c536eff7d9fb8
--- /dev/null
+++ b/wax-prosemirror-services/src/ImageService/image.css
@@ -0,0 +1,33 @@
+/* Image Styles */
+figure {
+ display: table;
+ margin-left: auto;
+ margin-right: auto;
+ word-break: break-word;
+}
+
+figure img {
+ cursor: default;
+ height: auto;
+ max-width: 100%;
+ width: auto;
+}
+
+figcaption {
+ background: #e2ebff;
+ caption-side: bottom;
+ display: table-caption;
+ max-width: 100%;
+ min-height: 20px;
+ padding: 4px;
+ width: auto;
+ }
+
+figcaption:focus {
+ outline: none;
+}
+
+figcaption:before {
+ content: 'Caption: ';
+ font-weight: bold;
+}
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js b/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js
index 44f66b6ecd169d24288c7961726665b6512e2a46..28d863b08fa5bd44c8050c74927412b2e5e143f6 100644
--- a/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js
+++ b/wax-prosemirror-services/src/InlineAnnotations/StrongService/StrongService.js
@@ -1,7 +1,8 @@
-import Service from '../../Service';
import { toggleMark } from 'prosemirror-commands';
import { strongMark } from 'wax-prosemirror-schema';
+import Service from '../../Service';
import Strong from './Strong';
+import './strong.css';
class StrongService extends Service {
boot() {
diff --git a/wax-prosemirror-services/src/InlineAnnotations/StrongService/strong.css b/wax-prosemirror-services/src/InlineAnnotations/StrongService/strong.css
new file mode 100644
index 0000000000000000000000000000000000000000..59926227952acc0fb710e6ea1993c39d82f9f183
--- /dev/null
+++ b/wax-prosemirror-services/src/InlineAnnotations/StrongService/strong.css
@@ -0,0 +1,5 @@
+ /* strong */
+
+ strong {
+ font-weight: bold;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/SubscriptService.js b/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/SubscriptService.js
index d27a8a94c50e5f6ff0bb66860d6f1ab55eb607e8..8af17a229d726edf35a8cac3c536bb764f3aae89 100644
--- a/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/SubscriptService.js
+++ b/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/SubscriptService.js
@@ -1,18 +1,19 @@
-import Service from "../../Service";
-import { subscriptMark } from "wax-prosemirror-schema";
-import Subscript from "./Subscript";
+import { subscriptMark } from 'wax-prosemirror-schema';
+import Service from '../../Service';
+import Subscript from './Subscript';
+import './subscript.css';
class SubscriptService extends Service {
- boot() {}
+ name = 'SubscriptService';
register() {
- this.container.bind("Subscript").to(Subscript);
- const createMark = this.container.get("CreateMark");
+ this.container.bind('Subscript').to(Subscript);
+ const createMark = this.container.get('CreateMark');
createMark(
{
- subscript: subscriptMark
+ subscript: subscriptMark,
},
- { toWaxSchema: true }
+ { toWaxSchema: true },
);
}
}
diff --git a/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/subscript.css b/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/subscript.css
new file mode 100644
index 0000000000000000000000000000000000000000..567749fa0dbd340a975720e5621a7fa059bfc2ca
--- /dev/null
+++ b/wax-prosemirror-services/src/InlineAnnotations/SubscriptService/subscript.css
@@ -0,0 +1,5 @@
+
+/* subscript*/
+ sub {
+ line-height: 0;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/SuperscriptService.js b/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/SuperscriptService.js
index 85b92cbbfa16131cc7adcd471314db7c5ee1c961..849c75424caf636431f4581544abf34cc6a4d629 100644
--- a/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/SuperscriptService.js
+++ b/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/SuperscriptService.js
@@ -1,18 +1,19 @@
-import Service from "../../Service";
-import { superscriptMark } from "wax-prosemirror-schema";
-import Superscript from "./Superscript";
+import { superscriptMark } from 'wax-prosemirror-schema';
+import Service from '../../Service';
+import Superscript from './Superscript';
+import './superscript.css';
class SuperscriptService extends Service {
- boot() {}
+ name = 'SuperscriptService';
register() {
- this.container.bind("Superscript").to(Superscript);
- const createMark = this.container.get("CreateMark");
+ this.container.bind('Superscript').to(Superscript);
+ const createMark = this.container.get('CreateMark');
createMark(
{
- superscript: superscriptMark
+ superscript: superscriptMark,
},
- { toWaxSchema: true }
+ { toWaxSchema: true },
);
}
}
diff --git a/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/superscript.css b/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/superscript.css
new file mode 100644
index 0000000000000000000000000000000000000000..7605c11539085863ecfa0ba3cec6d37177cdaf9a
--- /dev/null
+++ b/wax-prosemirror-services/src/InlineAnnotations/SuperscriptService/superscript.css
@@ -0,0 +1,5 @@
+/* superscript */
+
+sup {
+ line-height: 0;
+}
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/ListsService/ListsService.js b/wax-prosemirror-services/src/ListsService/ListsService.js
index 516a19d9f9efe4df2d8fcb6256f8e576c3b57dc2..88f6490252c651505dd39fc9301f6aff492e4399 100644
--- a/wax-prosemirror-services/src/ListsService/ListsService.js
+++ b/wax-prosemirror-services/src/ListsService/ListsService.js
@@ -1,5 +1,6 @@
import Service from '../Service';
import ListsServices from './index';
+import './lists.css';
class ListsService extends Service {
name = 'ListsService';
diff --git a/wax-prosemirror-services/src/ListsService/lists.css b/wax-prosemirror-services/src/ListsService/lists.css
new file mode 100644
index 0000000000000000000000000000000000000000..be025d926a9b425258ea6f54bf045d42b4c15870
--- /dev/null
+++ b/wax-prosemirror-services/src/ListsService/lists.css
@@ -0,0 +1,6 @@
+ /* lists */
+
+ ul,
+ ol {
+ padding-left: 30px;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/MathService/MathService.js b/wax-prosemirror-services/src/MathService/MathService.js
index 2f0927b2b7efeac8e07e9a93c6d1a5270168dd14..8525d420709ceefc48dc8477e66bb4476ddf2761 100644
--- a/wax-prosemirror-services/src/MathService/MathService.js
+++ b/wax-prosemirror-services/src/MathService/MathService.js
@@ -7,6 +7,7 @@ import { mathPlugin, mathSelectPlugin } from 'wax-prosemirror-plugins';
import Service from '../Service';
import inlineInputRule from './InlineInputRule';
import blockInputRule from './BlockInputRule';
+import './math.css';
class MathService extends Service {
name = 'MathService';
diff --git a/wax-prosemirror-services/src/MathService/math.css b/wax-prosemirror-services/src/MathService/math.css
new file mode 100644
index 0000000000000000000000000000000000000000..868306db15ec0198a6a2c185ca9d153318e709cb
--- /dev/null
+++ b/wax-prosemirror-services/src/MathService/math.css
@@ -0,0 +1,100 @@
+ div[contenteditable='false'] .math-src {
+ pointer-events: none;
+ user-select: none;
+ }
+
+/* == Math Nodes ======================================== */
+
+ .math-node {
+ min-width: 1em;
+ min-height: 1em;
+ font-size: 0.95em;
+ font-family: 'Consolas', 'Ubuntu Mono', monospace;
+ cursor: auto;
+ }
+
+ .ProseMirror .math-node .ProseMirror {
+ box-shadow: none;
+ min-height: 100%;
+ padding: 0;
+ background: #eee;
+ color: rgb(132, 33, 162);
+ }
+
+ .math-node.empty-math .math-render::before {
+ content: '(empty)';
+ color: red;
+ }
+
+ .math-node .math-render.parse-error::before {
+ content: '(math error)';
+ color: red;
+ cursor: help;
+ }
+
+ .math-node.ProseMirror-selectednode {
+ outline: none;
+ }
+
+ .math-node .math-src {
+ color: rgb(132, 33, 162);
+ display: none;
+ tab-size: 4;
+ }
+
+ .math-node.ProseMirror-selectednode .math-src {
+ display: flex;
+ }
+ .math-node.ProseMirror-selectednode .math-render {
+ display: none;
+ }
+
+ /* -- Inline Math --------------------------------------- */
+
+ math-inline {
+ display: inline;
+ white-space: nowrap;
+ }
+
+ math-inline .math-render {
+ display: inline-block;
+ font-size: 0.85em;
+ cursor: pointer;
+ }
+
+ math-inline .math-src .ProseMirror {
+ display: inline;
+ }
+
+ math-inline .math-src::after,
+ math-inline .math-src::before {
+ content: '$';
+ color: #b0b0b0;
+ }
+
+ /* -- Block Math ---------------------------------------- */
+
+ math-display {
+ display: block;
+ }
+
+ math-display .math-render {
+ display: block;
+ text-align: center;
+ }
+
+ math-display.ProseMirror-selectednode {
+ background-color: #eee;
+ }
+
+ math-display .math-src .ProseMirror {
+ width: 100%;
+ display: block;
+ }
+
+ math-display .math-src::after,
+ math-display .math-src::before {
+ content: '$$';
+ text-align: left;
+ color: #b0b0b0;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/MultipleChoiceQuestionService/MultipleChoiceQuestionService.js b/wax-prosemirror-services/src/MultipleChoiceQuestionService/MultipleChoiceQuestionService.js
index 26274f70dcff4f801c14593b5fb4182f541af001..5227d4446a74b6ab56fa8e68f4b0dd645c6e1206 100644
--- a/wax-prosemirror-services/src/MultipleChoiceQuestionService/MultipleChoiceQuestionService.js
+++ b/wax-prosemirror-services/src/MultipleChoiceQuestionService/MultipleChoiceQuestionService.js
@@ -10,6 +10,7 @@ import QuestionNodeView from './QuestionNodeView';
import MultipleChoiceSingleCorrectQuestionService from './MultipleChoiceSingleCorrectQuestionService/MultipleChoiceSingleCorrectQuestionService';
import TrueFalseQuestionService from './TrueFalseQuestionService/TrueFalseQuestionService';
import TrueFalseSingleCorrectQuestionService from './TrueFalseSingleCorrectQuestionService/TrueFalseSingleCorrectQuestionService';
+import './multipleQuestionStyles.css';
class MultipleChoiceQuestionService extends Service {
register() {
diff --git a/wax-prosemirror-services/src/MultipleChoiceQuestionService/multipleQuestionStyles.css b/wax-prosemirror-services/src/MultipleChoiceQuestionService/multipleQuestionStyles.css
new file mode 100644
index 0000000000000000000000000000000000000000..92f6e1608f339e6c2dae0cab413f6b1012df383a
--- /dev/null
+++ b/wax-prosemirror-services/src/MultipleChoiceQuestionService/multipleQuestionStyles.css
@@ -0,0 +1,51 @@
+ /* -- Multiple Choice ---------------------------------- */
+
+.ProseMirror {
+ counter-reset: multiple-question;
+}
+
+.multiple-choice,
+.multiple-choice-single-correct,
+.true-false,
+.true-false-single-correct {
+ border: 3px solid #f5f5f7;
+ counter-reset: question-item-multiple;
+ margin: 38px;
+ padding: 20px;
+ padding-top: 0px;
+}
+
+.multiple-choice:before,
+.multiple-choice-single-correct:before,
+.true-false:before,
+.true-false-single-correct:before {
+ bottom: 25px;
+ counter-increment: multiple-question;
+ position: relative;
+ right: 20px;
+}
+
+.ProseMirror .multiple-choice .ProseMirror,
+.ProseMirror .multiple-choice-single-correct .ProseMirror,
+.ProseMirror .true-false .ProseMirror,
+.ProseMirror .true-false-single-correct .ProseMirror {
+ box-shadow: none;
+ padding: 5px 5px 0 5px;
+}
+
+
+.multiple-choice:before {
+ content: 'Answer Group ' counter(multiple-question) ' (multiple choice)';
+}
+
+.multiple-choice-single-correct:before {
+ content: 'Answer Group ' counter(multiple-question)' (multiple choice single correct)';
+ }
+
+.true-false:before {
+ content: 'Answer Group ' counter(multiple-question) ' (true/false)';
+}
+
+.true-false-single-correct:before {
+ content: 'Answer Group ' counter(multiple-question)' (true/false single correct)';
+}
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/NoteService/NoteService.js b/wax-prosemirror-services/src/NoteService/NoteService.js
index c37a9d91eb0249a30c347ad10b8dd39a2bf82a15..e549f1167fa62c54b28de57346d569563bb371ba 100644
--- a/wax-prosemirror-services/src/NoteService/NoteService.js
+++ b/wax-prosemirror-services/src/NoteService/NoteService.js
@@ -2,6 +2,7 @@ import { footNoteNode } from 'wax-prosemirror-schema';
import Service from '../Service';
import Note from './Note';
import NoteComponent from './NoteComponent';
+import './note.css';
class NoteService extends Service {
name = 'NoteService';
diff --git a/wax-prosemirror-services/src/NoteService/note.css b/wax-prosemirror-services/src/NoteService/note.css
new file mode 100644
index 0000000000000000000000000000000000000000..d42cfb8950d2c38587faa6db12851a25ac9217c5
--- /dev/null
+++ b/wax-prosemirror-services/src/NoteService/note.css
@@ -0,0 +1,25 @@
+/* FootNote */
+
+.ProseMirror {
+ counter-reset: footnote;
+}
+
+.ProseMirror footnote {
+ font-variant-numeric: lining-nums proportional-nums;
+ display: inline-block;
+ text-align: center;
+ width: 17px;
+ height: 17px;
+ background: white;
+ border-bottom: 2px solid black;
+ color: black;
+ cursor: pointer;
+ }
+
+ .ProseMirror footnote::after {
+ content: counter(footnote);
+ position: relative;
+ bottom: 2px;
+ font-size: 16px;
+ counter-increment: footnote;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/TablesService/TablesService.js b/wax-prosemirror-services/src/TablesService/TablesService.js
index ceef94284bfef870d37c86b5d677156266450724..258db5a53aabd0234b9dbb559bfc9165d059ae85 100644
--- a/wax-prosemirror-services/src/TablesService/TablesService.js
+++ b/wax-prosemirror-services/src/TablesService/TablesService.js
@@ -1,5 +1,6 @@
import Service from '../Service';
import TablesServices from './index';
+import './table.css';
class TablesService extends Service {
dependencies = TablesServices;
diff --git a/wax-prosemirror-services/src/TablesService/table.css b/wax-prosemirror-services/src/TablesService/table.css
new file mode 100644
index 0000000000000000000000000000000000000000..1737e4ac5e6407dddce1c2eaa0be6147117d96e6
--- /dev/null
+++ b/wax-prosemirror-services/src/TablesService/table.css
@@ -0,0 +1,55 @@
+/* Tables */
+
+ table {
+ border: 1px solid #eee;
+ border-collapse: initial;
+ border-spacing: 0;
+ border-width: 0 thin thin 0;
+ margin: 0;
+ overflow: hidden;
+ page-break-inside: avoid;
+ table-layout: fixed;
+ width: 100%;
+ }
+
+ th,
+ td {
+ border: 1px solid #eee;
+ /*width: 200px;*/
+ padding: 2px 5px;
+ vertical-align: top;
+ box-sizing: border-box;
+ position: relative;
+ }
+
+ .tableWrapper {
+ overflow-x: auto;
+ }
+
+ .column-resize-handle {
+ background-color: #adf;
+ bottom: 0;
+ pointer-events: none;
+ position: absolute;
+ right: -2px;
+ top: 0;
+ width: 4px;
+ z-index: 20;
+ }
+
+ .ProseMirror.resize-cursor {
+ cursor: ew-resize;
+ cursor: col-resize;
+ }
+ /* Give selected cells a blue overlay */
+ .selectedCell:after {
+ background: rgba(200, 200, 255, 0.4);
+ bottom: 0;
+ content: '';
+ left: 0;
+ pointer-events: none;
+ position: absolute;
+ right: 0;
+ top: 0;
+ z-index: 2;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/BlockQuoteService.js b/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/BlockQuoteService.js
index 3878ee9b67ca2ae7ffcea62e485926e02a082e38..1b3f317352094b5686857be673c097bf4e0a3f4a 100644
--- a/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/BlockQuoteService.js
+++ b/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/BlockQuoteService.js
@@ -1,15 +1,16 @@
-import Service from "../../Service";
-import { blockQuoteNode } from "wax-prosemirror-schema";
-import BlockQuote from "./BlockQuote";
+import { blockQuoteNode } from 'wax-prosemirror-schema';
+import Service from '../../Service';
+import BlockQuote from './BlockQuote';
+import './blockQuote.css';
class BlockQuoteService extends Service {
- boot() {}
+ name = 'BlockQuoteService';
register() {
- this.container.bind("BlockQuote").to(BlockQuote);
- const createNode = this.container.get("CreateNode");
+ this.container.bind('BlockQuote').to(BlockQuote);
+ const createNode = this.container.get('CreateNode');
createNode({
- blockquote: blockQuoteNode
+ blockquote: blockQuoteNode,
});
}
}
diff --git a/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/blockQuote.css b/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/blockQuote.css
new file mode 100644
index 0000000000000000000000000000000000000000..fd6f644cd796af35f4c3f59eeaf5343188366a65
--- /dev/null
+++ b/wax-prosemirror-services/src/TextBlockLevel/BlockQuoteService/blockQuote.css
@@ -0,0 +1,7 @@
+/* block quote */
+ blockquote {
+ padding-left: 1em;
+ border-left: 3px solid #eee;
+ margin-left: 0;
+ margin-right: 0;
+ }
\ No newline at end of file
diff --git a/wax-prosemirror-services/src/TrackChangeService/TrackChangeService.js b/wax-prosemirror-services/src/TrackChangeService/TrackChangeService.js
index 40abb8d3c04dfff8a2f927c20f8d0ff70fefdf2f..1760f72ddca3765112a6f886447b4a569c8e185a 100644
--- a/wax-prosemirror-services/src/TrackChangeService/TrackChangeService.js
+++ b/wax-prosemirror-services/src/TrackChangeService/TrackChangeService.js
@@ -2,6 +2,7 @@ import { trackChangesMarks, trackChangesNodes } from 'wax-prosemirror-schema';
import { TrackChangePlugin, HideShowPlugin } from 'wax-prosemirror-plugins';
import Service from '../Service';
import TrackChangeServices from './index';
+import './trackChange.css';
class TrackChangeService extends Service {
boot() {
diff --git a/wax-prosemirror-services/src/TrackChangeService/trackChange.css b/wax-prosemirror-services/src/TrackChangeService/trackChange.css
new file mode 100644
index 0000000000000000000000000000000000000000..9847d98c49e1e57b0f96975111d993e2947cc1d6
--- /dev/null
+++ b/wax-prosemirror-services/src/TrackChangeService/trackChange.css
@@ -0,0 +1,60 @@
+/*Track Changes*/
+
+ span.deletion {
+ text-decoration: line-through;
+ color: indianred;
+}
+
+.ProseMirror span.deletion footnote {
+ background: indianred;
+}
+
+span.insertion {
+ color: royalblue;
+}
+
+.ProseMirror span.insertion footnote {
+ background: royalblue;
+ }
+
+ .selected-insertion {
+ background-color: rgb(238, 251, 251);
+ }
+
+ .selected-deletion {
+ background: rgb(250, 240, 240);
+ }
+
+ .selected-format-change,
+ .selected-block-change {
+ background-color: #eefbfb;
+ }
+
+ .format-change {
+ border-bottom: 2px solid royalblue;
+ }
+
+ [data-track] {
+ position: relative;
+ }
+
+ [data-track]::before {
+ content: '';
+ position: absolute;
+ border-left: 2px solid royalblue;
+ left: -10px;
+ height: 100%;
+ }
+
+ .insertion .show-insertion {
+ color: black;
+ }
+
+ .deletion .hide-deletion {
+ display: none;
+ }
+
+ li[data-track]::before,
+ li [data-track]::before {
+ left: -5px;
+ }
\ No newline at end of file