LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

clean up description style

Browse source
This commit is contained in:
Sean Yesmunt 2020-09-17 11:32:31 -04:00
parent 40d32a6065
commit fa2d69f943
3 changed files with 27 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
ui/component/common/markdown-preview.jsx
View file

@ -1,5 +1,6 @@
// @flow // @flow
import * as React from 'react'; import * as React from 'react';
import classnames from 'classnames';
import remark from 'remark'; import remark from 'remark';
import remarkAttr from 'remark-attr'; import remarkAttr from 'remark-attr';
import remarkStrip from 'strip-markdown'; import remarkStrip from 'strip-markdown';
@ -29,6 +30,7 @@ type MarkdownProps = {
content: ?string, content: ?string,
promptLinks?: boolean, promptLinks?: boolean,
noDataStore?: boolean, noDataStore?: boolean,
className?: string,
}; };
const SimpleText = (props: SimpleTextProps) => { const SimpleText = (props: SimpleTextProps) => {
@ -97,7 +99,7 @@ schema.attributes.a.push('embed');
const REPLACE_REGEX = /(<iframe\s+src=["'])(.*?(?=))(["']\s*><\/iframe>)/g; const REPLACE_REGEX = /(<iframe\s+src=["'])(.*?(?=))(["']\s*><\/iframe>)/g;
const MarkdownPreview = (props: MarkdownProps) => { const MarkdownPreview = (props: MarkdownProps) => {
const { content, strip, promptLinks, noDataStore } = props; const { content, strip, promptLinks, noDataStore, className } = props;
const strippedContent = content const strippedContent = content
? content.replace(REPLACE_REGEX, (iframeHtml, y, iframeSrc) => { ? content.replace(REPLACE_REGEX, (iframeHtml, y, iframeSrc) => {
// Let the browser try to create an iframe to see if the markup is valid // Let the browser try to create an iframe to see if the markup is valid
@ -151,7 +153,7 @@ const MarkdownPreview = (props: MarkdownProps) => {
} }
return ( return (
<div dir="auto" className="markdown-preview"> <div dir="auto" className={classnames('markdown-preview', className)}>
{ {
remark() remark()
.use(remarkAttr, remarkAttrOpts) .use(remarkAttr, remarkAttrOpts)

2
ui/component/fileDescription/view.jsx
View file

@ -32,7 +32,7 @@ class FileDescription extends PureComponent<Props> {
<> <>
{description && ( {description && (
<div className="media__info-text"> <div className="media__info-text">
<MarkdownPreview content={description} /> <MarkdownPreview className="markdown-preview--description" content={description} />
</div> </div>
)} )}
<ClaimTags uri={uri} type="large" /> <ClaimTags uri={uri} type="large" />

22
ui/scss/component/_markdown-preview.scss
View file

@ -20,6 +20,7 @@
h6 { h6 {
font-size: inherit; font-size: inherit;
margin-bottom: var(--spacing-m); margin-bottom: var(--spacing-m);
font-weight: bold;
&:not(:first-child) { &:not(:first-child) {
margin-top: var(--spacing-l); margin-top: var(--spacing-l);
@ -45,6 +46,27 @@
font-size: 1em; font-size: 1em;
} }
&.markdown-preview--description {
h1 {
font-size: 1.2em;
}
h2 {
font-size: 1.1em;
}
h3 {
font-size: 1em;
}
h4 {
font-size: 0.9em;
}
h5 {
font-size: 0.8em;
}
h6 {
font-size: 0.7em;
}
}
dl, dl,
ul, ul,
ol, ol,