MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

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

This commit is contained in:
Andrew Kingston 2022-02-03 09:46:30 +00:00
parent f347bafe62
commit 392aaa30d0
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>