fix: 🐛 Solve some issues with markdown preview (#470)

* fix: 🐛 Solve some issues with markdown preview

* fix: 🩹 Change background color of code block

* fix: 🐛 Change background color of markdown editor

apps/wizarr-frontend/src/assets/scss/md-editor-v3.scss

@@ -2,6 +2,19 @@
  --md-theme-quote-border: 5px solid rgb(208, 49, 67) !important;
  --md-theme-link-color: rgb(208, 49, 67) !important;
  --md-theme-link-hover-color: rgb(208, 49, 67) !important;
+ --md-theme-code-inline-color: rgb(208, 49, 67) !important;
+ --md-theme-code-inline-bg-color: rgba(208, 49, 67, 0.1) !important;
+ --md-theme-code-block-bg-color: rgb(17, 24, 39) !important;
+}
+
+.md-editor.md-editor-dark, .md-editor-modal-container[data-theme='dark'] {
+ --md-color: #fff;
+ --md-bk-color: rgb(55, 65, 81);
+ --md-scrollbar-bg-color: rgb(55, 65, 81);
+}
+
+.md-editor.md-editor-previewOnly {
+ background-color: inherit !important;
 }
 
 .md-editor-preview {
@@ -10,21 +23,24 @@
  h1, h2, h3, h4, h5, h6 {
  word-break: normal !important;
  }
- h1, h2, h3, h4, h5, h6 {
+ > h1, > h2, > h3, > h4, > h5, > h6 {
  &:first-child {
  margin-top: 0;
  }
  }
 }
 
-.md-editor.md-editor-dark, .md-editor-modal-container[data-theme='dark'] {
- --md-color: #fff;
-}
+.md-editor-preview {
+ ol {
+ list-style-type: decimal;
+ }
 
-.md-editor.md-editor-previewOnly {
- background-color: inherit !important;
+ ul {
+ list-style-type: disc;
+ }
 }
 
+
 .md-editor.md-editor-previewOnly .md-editor-preview-wrapper {
  padding: inherit !important;
 }