diff --git a/app/imports/ui/components/MarkdownText.vue b/app/imports/ui/components/MarkdownText.vue index 681878d2..ab9d35b2 100644 --- a/app/imports/ui/components/MarkdownText.vue +++ b/app/imports/ui/components/MarkdownText.vue @@ -24,10 +24,3 @@ }, } - - diff --git a/app/imports/ui/styles/markdown.css b/app/imports/ui/styles/markdown.css new file mode 100644 index 00000000..27d4c1cb --- /dev/null +++ b/app/imports/ui/styles/markdown.css @@ -0,0 +1,90 @@ +.markdown h1, +.markdown h2, +.markdown h3, +.markdown h4, +.markdown h5, +.markdown h6 { + line-height: initial; + margin-bottom: 12px; +} + +.markdown h1:not(:first-child), +.markdown h2:not(:first-child), +.markdown h3:not(:first-child), +.markdown h4:not(:first-child), +.markdown h5:not(:first-child), +.markdown h6:not(:first-child) { + margin-top: 24px; +} + +:not(:first-child) .markdown h1 { + font-size: 2rem; + letter-spacing: -.0083333333em; + font-weight: 300; +} + +.markdown h2 { + font-size: 1.5rem; + font-weight: 400; +} + +.markdown h3 { + font-size: 1.25rem; + letter-spacing: .0073529412em; + font-weight: 400; +} + +.markdown h4 { + font-size: 1rem; + letter-spacing: .0125em; + font-weight: 500; +} + +.markdown h5 { + font-size: 0.95rem; + letter-spacing: .0125em; + font-weight: 500; +} + +.markdown h6 { + font-size: 0.875rem; + letter-spacing: .0125em; + font-weight: 500; +} + +.markdown pre code { + display: block; + overflow: auto; +} + +.theme--dark.v-application .markdown hr { + border-color: rgba(255, 255, 255, 0.2); +} + +.markdown img { + max-width: 100%; + margin: 8px 0; +} + +.markdown table { + min-width: 100%; + border-spacing: 0; + margin-bottom: 16px; +} + +.markdown th { + font-weight: initial; + padding: 4px; +} + +.markdown td { + padding: 2px 4px; +} + +.markdown tbody>tr:nth-child(odd) { + background-color: rgba(0, 0, 0, 0.1) +} + +.theme--dark.v-application .markdown tbody>tr:nth-child(odd) { + background-color: rgba(255, 255, 255, 0.1) +} \ No newline at end of file diff --git a/app/imports/ui/styles/stylesIndex.js b/app/imports/ui/styles/stylesIndex.js index 383664b1..f9a49d9c 100644 --- a/app/imports/ui/styles/stylesIndex.js +++ b/app/imports/ui/styles/stylesIndex.js @@ -6,5 +6,6 @@ import './fitAvatars.css'; import './inheritBackgrounds.css'; import './largeFormatInputs.css'; import './lineClamp.css'; +import './markdown.css'; import './speedDial.css'; import './toolbarFlex.css';