CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-02 21:10:43 +12:00
Code Issues Projects Releases Wiki Activity

Add custom styles for HRs, tables and link colors in rich text editor and preview

Browse source
This commit is contained in:
Andrew Kingston 2022-02-03 09:46:30 +00:00
parent 953fa94e2b
commit 1ec51d2562
1 changed files with 21 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
packages/bbui/src/Markdown/SpectrumMDE.svelte
View file

@ -98,22 +98,39 @@
background: var(--spectrum-global-color-gray-100);
}
/* Code blocks in preview */
:global(.EasyMDEContainer .editor-preview pre) {
:global(.EasyMDEContainer pre) {
background: var(--spectrum-global-color-gray-100);
padding: 4px;
border-radius: 4px;
}
:global(.EasyMDEContainer .editor-preview code) {
:global(.EasyMDEContainer code) {
color: #e83e8c;
}
:global(.EasyMDEContainer .editor-preview pre code) {
:global(.EasyMDEContainer pre code) {
color: var(--spectrum-alias-text-color);
}
/* Block quotes */
:global(.EasyMDEContainer .editor-preview blockquote) {
:global(.EasyMDEContainer blockquote) {
border-left: 4px solid var(--spectrum-global-color-gray-400);
color: var(--spectrum-global-color-gray-700);
margin-left: 0;
padding-left: 20px;
}
/* HR's */
:global(.EasyMDEContainer hr) {
background-color: var(--spectrum-global-color-gray-300);
border: none;
height: 2px;
}
/* Tables */
:global(.EasyMDEContainer td, .EasyMDEContainer th) {
border-color: var(--spectrum-alias-border-color) !important;
}
/* Links */
:global(.EasyMDEContainer a) {
color: var(--primaryColor);
}
:global(.EasyMDEContainer a:hover) {
color: var(--primaryColorHover);
}
</style>