From 0b3e9f1179d83399286bf6c439e658fc313e7a88 Mon Sep 17 00:00:00 2001
From: hackrush <atulshyan96@gmail.com>
Date: Wed, 6 Dec 2017 01:04:32 +0530
Subject: [PATCH] Channel names in pages appear highlighted

Used classnames library for determining classname

changes
---
 CHANGELOG.md                                        |  2 ++
 src/renderer/js/component/uriIndicator/view.jsx     | 10 ++++++++--
 src/renderer/scss/component/_channel-indicator.scss |  4 ++--
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1273376a1..ac595bc6e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,8 @@ Web UI version numbers should always match the corresponding version of LBRY App
 ### Changed
   * The credit balance displayed in the main app navigation displays two decimal places instead of one.
   * Moved all redux code into /redux folder
+  * Channel names in pages are highlighted to indicate them being clickable(#814)
+  *
 
 ### Fixed
   * Long channel names causing inconsistent thumbnail sizes (#721)
diff --git a/src/renderer/js/component/uriIndicator/view.jsx b/src/renderer/js/component/uriIndicator/view.jsx
index cff4bd073..3bf850d11 100644
--- a/src/renderer/js/component/uriIndicator/view.jsx
+++ b/src/renderer/js/component/uriIndicator/view.jsx
@@ -1,7 +1,8 @@
 import React from "react";
 import { Icon } from "component/common";
 import Link from "component/link";
-import lbryuri from "lbryuri.js";
+import lbryuri from "lbryuri";
+import classnames from "classnames";
 
 class UriIndicator extends React.PureComponent {
   componentWillMount() {
@@ -60,7 +61,12 @@ class UriIndicator extends React.PureComponent {
 
     const inner = (
       <span>
-        <span className={`channel-name ${smallCard && "channel-name--small"}`}>
+        <span
+          className={classnames("channel-name", {
+            "channel-name--small": smallCard,
+            "button-text no-underline": link,
+          })}
+        >
           {channelName}
         </span>{" "}
         {!signatureIsValid ? (
diff --git a/src/renderer/scss/component/_channel-indicator.scss b/src/renderer/scss/component/_channel-indicator.scss
index 6c63a4235..50b7648d0 100644
--- a/src/renderer/scss/component/_channel-indicator.scss
+++ b/src/renderer/scss/component/_channel-indicator.scss
@@ -1,9 +1,9 @@
 
 .channel-name {
-  display: inline-block;
+  display: inline-flex;
   overflow: hidden;
   white-space: nowrap;
-  text-overflow: ellipsis
+  text-overflow: ellipsis;
 }
 
 // this shouldn't know about the card width