@edgex-fe/editor-preview 0.0.1

package/dist/styles/editor-preview.css

@@ -0,0 +1,778 @@
+.edgex-editor-preview,
+.rich-content,
+edgex-editor-preview {
+  --edgex-editor-preview-text-primary: var(--text-primary, #f9f9f9);
+  --edgex-editor-preview-text-orderbook: var(--text-orderbook, #c8c8c8);
+  --edgex-editor-preview-text-secondary: var(--text-secondary, #929292);
+  --edgex-editor-preview-text-tertiary: var(--text-tertiary, #808080);
+  --edgex-editor-preview-theme-normal: var(--theme-normal, #22fd73);
+  --edgex-editor-preview-theme-normal-20: var(--theme-normal-20, rgba(34, 253, 115, 0.2));
+  --edgex-editor-preview-fill-page-secondary: var(--fill-page-secondary, #181818);
+  --edgex-editor-preview-fill-page-tertiary: var(--fill-page-tertiary, #242424);
+  --edgex-editor-preview-line-divider-tertiary: var(--line-divider-tertiary, #242424);
+
+  display: flow-root;
+  width: 100%;
+  max-width: 100%;
+  overflow-x: auto;
+  color: var(--edgex-editor-preview-text-primary);
+  font-size: 0.875rem;
+  line-height: 1.5715;
+  overflow-wrap: break-word;
+  word-break: break-word;
+}
+
+.edgex-editor-preview > :first-child,
+.rich-content > :first-child,
+edgex-editor-preview > :first-child,
+.edgex-editor-preview section > :first-child,
+.edgex-editor-preview blockquote > :first-child,
+.edgex-editor-preview div > :first-child,
+.edgex-editor-preview details > :first-child,
+.rich-content section > :first-child,
+.rich-content blockquote > :first-child,
+.rich-content div > :first-child,
+.rich-content details > :first-child,
+edgex-editor-preview section > :first-child,
+edgex-editor-preview blockquote > :first-child,
+edgex-editor-preview div > :first-child,
+edgex-editor-preview details > :first-child {
+  margin-top: 0;
+}
+
+.edgex-editor-preview > :last-child,
+.rich-content > :last-child,
+edgex-editor-preview > :last-child,
+.edgex-editor-preview section > :last-child,
+.edgex-editor-preview blockquote > :last-child,
+.edgex-editor-preview div > :last-child,
+.edgex-editor-preview details > :last-child,
+.rich-content section > :last-child,
+.rich-content blockquote > :last-child,
+.rich-content div > :last-child,
+.rich-content details > :last-child,
+edgex-editor-preview section > :last-child,
+edgex-editor-preview blockquote > :last-child,
+edgex-editor-preview div > :last-child,
+edgex-editor-preview details > :last-child {
+  margin-bottom: 0;
+}
+
+.edgex-editor-preview p,
+.edgex-editor-preview div,
+.rich-content p,
+.rich-content div,
+edgex-editor-preview p,
+edgex-editor-preview div {
+  margin: 0 0 1rem;
+  color: var(--edgex-editor-preview-text-secondary);
+}
+
+.edgex-editor-preview br,
+.rich-content br,
+edgex-editor-preview br {
+  line-height: inherit;
+}
+
+.edgex-editor-preview section,
+.rich-content section,
+edgex-editor-preview section {
+  margin: 1.5rem 0;
+}
+
+.edgex-editor-preview .ql-align-left,
+.edgex-editor-preview .text-left,
+.edgex-editor-preview [data-align="left"],
+.rich-content .ql-align-left,
+.rich-content .text-left,
+.rich-content [data-align="left"],
+edgex-editor-preview .ql-align-left,
+edgex-editor-preview .text-left,
+edgex-editor-preview [data-align="left"] {
+  text-align: left;
+}
+
+.edgex-editor-preview .ql-align-center,
+.edgex-editor-preview .text-center,
+.edgex-editor-preview [data-align="center"],
+.rich-content .ql-align-center,
+.rich-content .text-center,
+.rich-content [data-align="center"],
+edgex-editor-preview .ql-align-center,
+edgex-editor-preview .text-center,
+edgex-editor-preview [data-align="center"] {
+  text-align: center;
+}
+
+.edgex-editor-preview .ql-align-right,
+.edgex-editor-preview .text-right,
+.edgex-editor-preview [data-align="right"],
+.rich-content .ql-align-right,
+.rich-content .text-right,
+.rich-content [data-align="right"],
+edgex-editor-preview .ql-align-right,
+edgex-editor-preview .text-right,
+edgex-editor-preview [data-align="right"] {
+  text-align: right;
+}
+
+.edgex-editor-preview .ql-align-justify,
+.edgex-editor-preview .text-justify,
+.edgex-editor-preview [data-align="justify"],
+.rich-content .ql-align-justify,
+.rich-content .text-justify,
+.rich-content [data-align="justify"],
+edgex-editor-preview .ql-align-justify,
+edgex-editor-preview .text-justify,
+edgex-editor-preview [data-align="justify"] {
+  text-align: justify;
+}
+
+.edgex-editor-preview h1,
+.edgex-editor-preview h2,
+.edgex-editor-preview h3,
+.edgex-editor-preview h4,
+.edgex-editor-preview h5,
+.edgex-editor-preview h6,
+.rich-content h1,
+.rich-content h2,
+.rich-content h3,
+.rich-content h4,
+.rich-content h5,
+.rich-content h6,
+edgex-editor-preview h1,
+edgex-editor-preview h2,
+edgex-editor-preview h3,
+edgex-editor-preview h4,
+edgex-editor-preview h5,
+edgex-editor-preview h6 {
+  margin: 1.5rem 0 0.75rem;
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 500;
+}
+
+.edgex-editor-preview h1,
+.rich-content h1,
+edgex-editor-preview h1 {
+  margin-top: 2rem;
+  margin-bottom: 1rem;
+  font-size: 2.5rem;
+  line-height: 1.3;
+}
+
+.edgex-editor-preview h2,
+.rich-content h2,
+edgex-editor-preview h2 {
+  margin-top: 1.75rem;
+  margin-bottom: 0.875rem;
+  font-size: 1.25rem;
+  line-height: 1.4;
+}
+
+.edgex-editor-preview h3,
+.rich-content h3,
+edgex-editor-preview h3 {
+  font-size: 1.125rem;
+  line-height: 1.45;
+}
+
+.edgex-editor-preview h4,
+.rich-content h4,
+edgex-editor-preview h4,
+.edgex-editor-preview h5,
+.rich-content h5,
+edgex-editor-preview h5 {
+  font-size: 1rem;
+  line-height: 1.5;
+}
+
+.edgex-editor-preview h6,
+.rich-content h6,
+edgex-editor-preview h6 {
+  color: var(--edgex-editor-preview-text-tertiary);
+  font-size: 0.75rem;
+  line-height: 1.5;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.edgex-editor-preview ul,
+.edgex-editor-preview ol,
+.rich-content ul,
+.rich-content ol,
+edgex-editor-preview ul,
+edgex-editor-preview ol {
+  margin: 0 0 1rem;
+  padding-left: 1.25rem;
+  color: var(--edgex-editor-preview-text-secondary);
+}
+
+.edgex-editor-preview li > ul,
+.edgex-editor-preview li > ol,
+.rich-content li > ul,
+.rich-content li > ol,
+edgex-editor-preview li > ul,
+edgex-editor-preview li > ol {
+  margin-top: 0.5rem;
+  margin-bottom: 0;
+}
+
+.edgex-editor-preview dl,
+.rich-content dl,
+edgex-editor-preview dl {
+  margin: 0 0 1rem;
+  color: var(--edgex-editor-preview-text-secondary);
+}
+
+.edgex-editor-preview dt,
+.rich-content dt,
+edgex-editor-preview dt {
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 500;
+}
+
+.edgex-editor-preview dd,
+.rich-content dd,
+edgex-editor-preview dd {
+  margin: 0.25rem 0 0.75rem 1rem;
+}
+
+.edgex-editor-preview ul,
+.rich-content ul,
+edgex-editor-preview ul {
+  list-style: disc;
+}
+
+.edgex-editor-preview ol,
+.rich-content ol,
+edgex-editor-preview ol {
+  list-style: decimal;
+}
+
+.edgex-editor-preview li + li,
+.rich-content li + li,
+edgex-editor-preview li + li {
+  margin-top: 0.5rem;
+}
+
+.edgex-editor-preview li::marker,
+.rich-content li::marker,
+edgex-editor-preview li::marker {
+  color: var(--edgex-editor-preview-theme-normal);
+}
+
+.edgex-editor-preview blockquote,
+.rich-content blockquote,
+edgex-editor-preview blockquote {
+  margin: 1rem 0;
+  border-left: 4px solid var(--edgex-editor-preview-theme-normal);
+  padding-left: 1.5rem;
+}
+
+.edgex-editor-preview blockquote p,
+.edgex-editor-preview blockquote div,
+.rich-content blockquote p,
+.rich-content blockquote div,
+edgex-editor-preview blockquote p,
+edgex-editor-preview blockquote div {
+  color: var(--edgex-editor-preview-text-orderbook);
+}
+
+.edgex-editor-preview blockquote footer,
+.rich-content blockquote footer,
+edgex-editor-preview blockquote footer {
+  margin-top: 0.5rem;
+  color: var(--edgex-editor-preview-text-tertiary);
+  font-size: 0.75rem;
+  line-height: 1.5;
+}
+
+.edgex-editor-preview strong,
+.edgex-editor-preview b,
+.rich-content strong,
+.rich-content b,
+edgex-editor-preview strong,
+edgex-editor-preview b {
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 600;
+}
+
+.edgex-editor-preview em,
+.edgex-editor-preview i,
+.rich-content em,
+.rich-content i,
+edgex-editor-preview em,
+edgex-editor-preview i {
+  font-style: italic;
+}
+
+.edgex-editor-preview u,
+.rich-content u,
+edgex-editor-preview u {
+  text-underline-offset: 4px;
+}
+
+.edgex-editor-preview abbr[title],
+.rich-content abbr[title],
+edgex-editor-preview abbr[title] {
+  text-decoration: underline dotted;
+  text-underline-offset: 3px;
+}
+
+.edgex-editor-preview s,
+.edgex-editor-preview del,
+.rich-content s,
+.rich-content del,
+edgex-editor-preview s,
+edgex-editor-preview del {
+  text-decoration: line-through;
+}
+
+.edgex-editor-preview sub,
+.edgex-editor-preview sup,
+.rich-content sub,
+.rich-content sup,
+edgex-editor-preview sub,
+edgex-editor-preview sup {
+  font-size: 0.75em;
+  line-height: 0;
+}
+
+.edgex-editor-preview small,
+.rich-content small,
+edgex-editor-preview small {
+  color: var(--edgex-editor-preview-text-tertiary);
+  font-size: 0.75rem;
+}
+
+.edgex-editor-preview mark,
+.rich-content mark,
+edgex-editor-preview mark {
+  border-radius: 0.25rem;
+  padding: 0 0.25rem;
+  background: var(--edgex-editor-preview-theme-normal-20);
+  color: var(--edgex-editor-preview-theme-normal);
+}
+
+.edgex-editor-preview span[style*="background"],
+.edgex-editor-preview span[style*="background-color"],
+.rich-content span[style*="background"],
+.rich-content span[style*="background-color"],
+edgex-editor-preview span[style*="background"],
+edgex-editor-preview span[style*="background-color"] {
+  border-radius: 0.25rem;
+  padding: 0 0.25rem;
+}
+
+.edgex-editor-preview a,
+.rich-content a,
+edgex-editor-preview a {
+  color: var(--edgex-editor-preview-theme-normal);
+  text-decoration: underline;
+  text-underline-offset: 4px;
+}
+
+.edgex-editor-preview code,
+.rich-content code,
+edgex-editor-preview code {
+  border-radius: 0.25rem;
+  padding: 0.125rem 0.375rem;
+  background: var(--edgex-editor-preview-fill-page-tertiary);
+  color: var(--edgex-editor-preview-theme-normal);
+  font-size: 0.75rem;
+}
+
+.edgex-editor-preview kbd,
+.rich-content kbd,
+edgex-editor-preview kbd {
+  border: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+  border-radius: 0.25rem;
+  padding: 0.125rem 0.375rem;
+  background: var(--edgex-editor-preview-fill-page-secondary);
+  color: var(--edgex-editor-preview-text-primary);
+  font-size: 0.75rem;
+  font-weight: 500;
+}
+
+.edgex-editor-preview pre,
+.rich-content pre,
+edgex-editor-preview pre {
+  margin: 1rem 0;
+  overflow-x: auto;
+  border-radius: 0.75rem;
+  padding: 1rem;
+  background: var(--edgex-editor-preview-fill-page-secondary);
+  color: var(--edgex-editor-preview-text-secondary);
+  font-size: 0.75rem;
+  line-height: 1.6667;
+}
+
+.edgex-editor-preview pre code,
+.rich-content pre code,
+edgex-editor-preview pre code {
+  padding: 0;
+  background: transparent;
+  color: inherit;
+  font-size: inherit;
+}
+
+.edgex-editor-preview hr,
+.rich-content hr,
+edgex-editor-preview hr {
+  margin: 2rem 0;
+  border: 0;
+  border-top: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+}
+
+.edgex-editor-preview figure,
+.rich-content figure,
+edgex-editor-preview figure {
+  margin: 1rem 0;
+}
+
+.edgex-editor-preview img,
+.edgex-editor-preview video,
+.rich-content img,
+.rich-content video,
+edgex-editor-preview img,
+edgex-editor-preview video {
+  display: block;
+  width: 100%;
+  height: auto;
+  max-width: 100%;
+  border-radius: 1rem;
+  background: var(--edgex-editor-preview-fill-page-secondary);
+  color: var(--edgex-editor-preview-text-tertiary);
+  font-size: 0.75rem;
+  line-height: 1.5;
+}
+
+.edgex-editor-preview video,
+.rich-content video,
+edgex-editor-preview video {
+  overflow: hidden;
+}
+
+.edgex-editor-preview figcaption,
+.rich-content figcaption,
+edgex-editor-preview figcaption {
+  margin-top: 0.5rem;
+  color: var(--edgex-editor-preview-text-tertiary);
+  font-size: 0.75rem;
+  line-height: 1.5;
+}
+
+.edgex-editor-preview details,
+.rich-content details,
+edgex-editor-preview details {
+  margin: 1rem 0;
+  border: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+  border-radius: 0.75rem;
+  padding: 1rem;
+  background: var(--edgex-editor-preview-fill-page-secondary);
+  color: var(--edgex-editor-preview-text-secondary);
+}
+
+.edgex-editor-preview summary,
+.rich-content summary,
+edgex-editor-preview summary {
+  cursor: pointer;
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 500;
+}
+
+.edgex-editor-preview summary + *,
+.rich-content summary + *,
+edgex-editor-preview summary + * {
+  margin-top: 0.75rem;
+}
+
+.edgex-editor-preview .wysiwyg-table,
+.rich-content .wysiwyg-table,
+edgex-editor-preview .wysiwyg-table {
+  margin: 1rem 0;
+  max-width: 100%;
+  overflow-x: auto;
+  border: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+  border-radius: 0.75rem;
+  background: var(--edgex-editor-preview-fill-page-secondary);
+}
+
+.edgex-editor-preview table,
+.rich-content table,
+edgex-editor-preview table {
+  display: table;
+  margin: 1rem 0;
+  width: 100%;
+  border: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+  border-radius: 0.75rem;
+  border-spacing: 0;
+  background: var(--edgex-editor-preview-fill-page-secondary);
+  text-align: left;
+}
+
+.edgex-editor-preview caption,
+.rich-content caption,
+edgex-editor-preview caption {
+  caption-side: top;
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 500;
+  text-align: left;
+}
+
+.edgex-editor-preview .wysiwyg-table table,
+.rich-content .wysiwyg-table table,
+edgex-editor-preview .wysiwyg-table table {
+  margin: 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+
+.edgex-editor-preview th,
+.edgex-editor-preview td,
+.rich-content th,
+.rich-content td,
+edgex-editor-preview th,
+edgex-editor-preview td {
+  min-width: 8rem;
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid var(--edgex-editor-preview-line-divider-tertiary);
+  color: var(--edgex-editor-preview-text-secondary);
+  vertical-align: top;
+}
+
+.edgex-editor-preview th,
+.rich-content th,
+edgex-editor-preview th {
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 500;
+}
+
+.edgex-editor-preview thead th,
+.rich-content thead th,
+edgex-editor-preview thead th {
+  color: var(--edgex-editor-preview-text-tertiary);
+  font-size: 0.75rem;
+  line-height: 1.5;
+}
+
+.edgex-editor-preview tfoot th,
+.edgex-editor-preview tfoot td,
+.rich-content tfoot th,
+.rich-content tfoot td,
+edgex-editor-preview tfoot th,
+edgex-editor-preview tfoot td {
+  background: var(--edgex-editor-preview-fill-page-tertiary);
+  color: var(--edgex-editor-preview-text-primary);
+  font-weight: 500;
+}
+
+.edgex-editor-preview tbody:last-child tr:last-child td,
+.edgex-editor-preview tbody:last-child tr:last-child th,
+.edgex-editor-preview tfoot tr:last-child td,
+.edgex-editor-preview tfoot tr:last-child th,
+.rich-content tbody:last-child tr:last-child td,
+.rich-content tbody:last-child tr:last-child th,
+.rich-content tfoot tr:last-child td,
+.rich-content tfoot tr:last-child th,
+edgex-editor-preview tbody:last-child tr:last-child td,
+edgex-editor-preview tbody:last-child tr:last-child th,
+edgex-editor-preview tfoot tr:last-child td,
+edgex-editor-preview tfoot tr:last-child th {
+  border-bottom: 0;
+}
+
+@media (max-width: 768px) {
+  .edgex-editor-preview,
+.rich-content,
+edgex-editor-preview {
+    overflow-wrap: anywhere;
+    font-size: 0.8125rem;
+    line-height: 1.6154;
+  }
+
+  .edgex-editor-preview p,
+.edgex-editor-preview div,
+.edgex-editor-preview ul,
+.edgex-editor-preview ol,
+.edgex-editor-preview dl,
+.rich-content p,
+.rich-content div,
+.rich-content ul,
+.rich-content ol,
+.rich-content dl,
+edgex-editor-preview p,
+edgex-editor-preview div,
+edgex-editor-preview ul,
+edgex-editor-preview ol,
+edgex-editor-preview dl {
+    margin-bottom: 0.875rem;
+  }
+
+  .edgex-editor-preview section,
+.rich-content section,
+edgex-editor-preview section {
+    margin: 1.25rem 0;
+  }
+
+  .edgex-editor-preview h1,
+.edgex-editor-preview h2,
+.edgex-editor-preview h3,
+.edgex-editor-preview h4,
+.edgex-editor-preview h5,
+.edgex-editor-preview h6,
+.rich-content h1,
+.rich-content h2,
+.rich-content h3,
+.rich-content h4,
+.rich-content h5,
+.rich-content h6,
+edgex-editor-preview h1,
+edgex-editor-preview h2,
+edgex-editor-preview h3,
+edgex-editor-preview h4,
+edgex-editor-preview h5,
+edgex-editor-preview h6 {
+    margin-top: 1.25rem;
+    margin-bottom: 0.625rem;
+  }
+
+  .edgex-editor-preview h1,
+.rich-content h1,
+edgex-editor-preview h1 {
+    margin-top: 1.5rem;
+    margin-bottom: 0.75rem;
+    font-size: 1.875rem;
+    line-height: 1.3334;
+  }
+
+  .edgex-editor-preview h2,
+.rich-content h2,
+edgex-editor-preview h2 {
+    margin-top: 1.375rem;
+    margin-bottom: 0.75rem;
+    font-size: 1.125rem;
+    line-height: 1.4445;
+  }
+
+  .edgex-editor-preview h3,
+.rich-content h3,
+edgex-editor-preview h3 {
+    font-size: 1rem;
+    line-height: 1.5;
+  }
+
+  .edgex-editor-preview h4,
+.rich-content h4,
+edgex-editor-preview h4,
+.edgex-editor-preview h5,
+.rich-content h5,
+edgex-editor-preview h5 {
+    font-size: 0.9375rem;
+    line-height: 1.5334;
+  }
+
+  .edgex-editor-preview h6,
+.rich-content h6,
+edgex-editor-preview h6 {
+    font-size: 0.6875rem;
+    line-height: 1.4546;
+  }
+
+  .edgex-editor-preview ul,
+.edgex-editor-preview ol,
+.rich-content ul,
+.rich-content ol,
+edgex-editor-preview ul,
+edgex-editor-preview ol {
+    padding-left: 1.125rem;
+  }
+
+  .edgex-editor-preview blockquote,
+.rich-content blockquote,
+edgex-editor-preview blockquote {
+    margin: 0.875rem 0;
+    border-left-width: 3px;
+    padding-left: 1rem;
+  }
+
+  .edgex-editor-preview pre,
+.edgex-editor-preview figure,
+.edgex-editor-preview table,
+.edgex-editor-preview .wysiwyg-table,
+.edgex-editor-preview details,
+.rich-content pre,
+.rich-content figure,
+.rich-content table,
+.rich-content .wysiwyg-table,
+.rich-content details,
+edgex-editor-preview pre,
+edgex-editor-preview figure,
+edgex-editor-preview table,
+edgex-editor-preview .wysiwyg-table,
+edgex-editor-preview details {
+    margin: 0.875rem 0;
+  }
+
+  .edgex-editor-preview pre,
+.edgex-editor-preview details,
+.rich-content pre,
+.rich-content details,
+edgex-editor-preview pre,
+edgex-editor-preview details {
+    border-radius: 0.625rem;
+    padding: 0.875rem;
+  }
+
+  .edgex-editor-preview code,
+.edgex-editor-preview kbd,
+.rich-content code,
+.rich-content kbd,
+edgex-editor-preview code,
+edgex-editor-preview kbd {
+    font-size: 0.6875rem;
+  }
+
+  .edgex-editor-preview hr,
+.rich-content hr,
+edgex-editor-preview hr {
+    margin: 1.5rem 0;
+  }
+
+  .edgex-editor-preview img,
+.edgex-editor-preview video,
+.rich-content img,
+.rich-content video,
+edgex-editor-preview img,
+edgex-editor-preview video {
+    border-radius: 0.75rem;
+  }
+
+  .edgex-editor-preview table,
+.edgex-editor-preview .wysiwyg-table,
+.rich-content table,
+.rich-content .wysiwyg-table,
+edgex-editor-preview table,
+edgex-editor-preview .wysiwyg-table {
+    border-radius: 0.625rem;
+  }
+
+  .edgex-editor-preview caption,
+.rich-content caption,
+edgex-editor-preview caption {
+    padding: 0.625rem 0.75rem;
+  }
+
+  .edgex-editor-preview th,
+.edgex-editor-preview td,
+.rich-content th,
+.rich-content td,
+edgex-editor-preview th,
+edgex-editor-preview td {
+    min-width: 7rem;
+    padding: 0.625rem 0.75rem;
+  }
+}