re-enable lbry:// link styles in comments

will add support for odysee/lbry.tv once the style is finalized

ui/component/claimLink/view.jsx

@@ -1,15 +1,12 @@
 // @flow
 import * as React from 'react';
-import Button from 'component/button';
 import PreviewLink from 'component/previewLink';
 import UriIndicator from 'component/uriIndicator';
 
 type Props = {
   uri: string,
-  title: ?string,
   claim: StreamClaim,
   children: React.Node,
-  className: ?string,
   autoEmbed: ?boolean,
   description: ?string,
   isResolvingUri: boolean,
@@ -24,7 +21,6 @@ class ClaimLink extends React.Component<Props> {
   static defaultProps = {
     href: null,
     link: false,
-    title: null,
     thumbnail: null,
     autoEmbed: false,
     description: null,
@@ -63,7 +59,7 @@ class ClaimLink extends React.Component<Props> {
   };
 
   render() {
-    const { uri, claim, title, className, autoEmbed, children, isResolvingUri } = this.props;
+    const { uri, claim, autoEmbed, children, isResolvingUri } = this.props;
     const isUnresolved = (!isResolvingUri && !claim) || !claim;
     const isBlacklisted = this.isClaimBlackListed();
 
@@ -71,20 +67,15 @@ class ClaimLink extends React.Component<Props> {
       return <span>{children}</span>;
     }
 
-    const { name: claimName, value_type: valueType } = claim;
+    const { value_type: valueType } = claim;
     const isChannel = valueType === 'channel';
     const showPreview = autoEmbed === true && !isUnresolved;
 
-     if(isChannel){
-       return <UriIndicator uri={uri} link addTooltip />
-     }
+    if (isChannel) {
+      return <UriIndicator uri={uri} link addTooltip />;
+    }
 
-    return (
-      <React.Fragment>
-        <Button label={children} title={title || claimName} button={'link'} navigate={uri} className={className} />
-        {showPreview && <PreviewLink uri={uri} />}
-      </React.Fragment>
-    );
+    return <React.Fragment>{showPreview && <PreviewLink uri={uri} />}</React.Fragment>;
   }
 }
 

ui/component/comment/view.jsx

@@ -255,10 +255,10 @@ function Comment(props: Props) {
                 <div className="comment__message">
                   {editedMessage.length >= LENGTH_TO_COLLAPSE ? (
                     <Expandable>
-                      <MarkdownPreview content={message} />
+                      <MarkdownPreview content={message} promptLinks />
                     </Expandable>
                   ) : (
-                    <MarkdownPreview content={message} />
+                    <MarkdownPreview content={message} promptLinks />
                   )}
                 </div>
 

ui/component/previewLink/view.jsx

@@ -29,20 +29,20 @@ class PreviewLink extends React.PureComponent<Props> {
     };
 
     return (
-      <span className={'preview-link'} role="button" onClick={this.handleClick}>
-        <span className={'claim-preview'}>
-          <span style={thumbnailStyle} className={'preview-link__thumbnail media__thumb'} />
-          <span className={'claim-preview-metadata'}>
-            <span className={'claim-preview-info'}>
-              <span className={'claim-preview__title'}>
+      <span className="preview-link" role="button" onClick={this.handleClick}>
+        <span className="claim-preview">
+          <span style={thumbnailStyle} className="preview-link__thumbnail media__thumb" />
+          <span className="claim-preview-metadata">
+            <span className="claim-preview-info">
+              <span className="claim-preview__title">
                 <TruncatedText text={title} lines={1} />
               </span>
             </span>
-            <span className={'media__subtitle'}>
+            <span className="media__subtitle">
               <UriIndicator uri={uri} link />
             </span>
-            <span className={'claim-preview-properties'}>
-              <span className={'preview-link__description media__subtitle'}>
+            <span className="claim-preview-properties">
+              <span className="preview-link__description media__subtitle">
                 <TruncatedText lines={2} showTooltip={false}>
                   <MarkdownPreview content={description} strip />
                 </TruncatedText>

ui/scss/component/_markdown-preview.scss

@@ -180,13 +180,14 @@
 
   .preview-link {
     padding: 0;
-    margin: 1rem 0;
+    margin: var(--spacing-s) 0;
+    padding-right: var(--spacing-s);
     background-color: var(--color-primary-alt);
-    border-left: 0.5rem solid var(--color-primary);
     display: block;
     align-items: center;
     word-break: break-all;
     overflow: hidden;
+    border-radius: var(--border-radius);
 
     .claim-preview {
       border: 0;
@@ -198,8 +199,14 @@
     }
   }
 
+  .claim-preview-metadata {
+    padding: var(--spacing-s) 0;
+  }
+
   .preview-link__thumbnail {
     width: 12rem;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
   }
 
   .preview-link__description {