add Status CTAs

src/components/ChannelInfo.component.jsx

@@ -65,6 +65,9 @@ class ChannelInfo extends Component {
             pauseOnHover={false}
           />
           <div style={{ marginTop: '40px', display: 'flex'}}>
+            <a href="https://status.im/get/" target='_blank' className='get-status'>
+                <img src={require("../images/symbol.png")} width="32px" height="auto"/>
+            </a>
             <TwitterShareButton url={shareUrl} title={podcastTitle} hashtags={["ethstatus"]} className="social">
               <TwitterIcon size={32} round />
             </TwitterShareButton>
@@ -74,12 +77,6 @@ class ChannelInfo extends Component {
             <RedditShareButton url={shareUrl} title={podcastTitle} className="social">
               <RedditIcon size={32} round />
             </RedditShareButton>
-            <TelegramShareButton url={shareUrl} title={podcastTitle} className="social">
-              <TelegramIcon size={32} round />
-            </TelegramShareButton>
-            <WhatsappShareButton url={shareUrl} title={podcastTitle} className="social">
-              <WhatsappIcon size={32} round />
-            </WhatsappShareButton>
             <EmailShareButton url={shareUrl} className="social">
               <EmailIcon size={32} round />
             </EmailShareButton>

src/components/Sidebar.component.jsx

@@ -55,7 +55,17 @@ class Sidebar extends Component {
                 <h4>Upload</h4>
               </Link>
             </li>
-            <li className='sidebar-link settings'>
+            <li className='sidebar-link cta settings'>
+              <a href="https://statusnetwork.com/" target="_bank">
+                <h4>The Status Network</h4>
+              </a>
+            </li>
+            <li className='sidebar-link cta margin-bottom-30'>
+              <a href="https://status.im/get/" target="_bank">
+                <h4>Get Status</h4>
+              </a>
+            </li>
+            <li className='sidebar-link'>
               <Link to='/settings' activeClassName='sidebar-active' exact>
                 <i className='fas fa-cog' />
                 <h4>Settings</h4>

src/css/ChannelInfo.styles.css

@@ -39,6 +39,21 @@
   text-align: left;
 }
 
+
+/* .get-status img {
+  margin-right: 5px;
+} */
+
+.get-status {
+  color: rgb(167, 167, 167);
+  background: none;
+  display: inline-block;
+  margin-right: 15px;
+  font-size: 1.4rem;
+  text-decoration: none;
+
+}
+
 .ChannelInfo-website {
   color: #fff;
   background: #3498db;

src/css/Sidebar.styles.css

@@ -31,6 +31,14 @@
   height: 100%;
 }
 
+.margin-bottom-30 {
+  margin-bottom: 30px !important;
+}
+
+.cta:hover {
+  color: white !important;
+}
+
 .sidebar li {
   list-style: none;
 }
@@ -42,6 +50,10 @@
   color: #6d6d6d;
 }
 
+.sidebar-link:hover {
+  color: #acacac;
+}
+
 .sidebar-link a {
   display: flex;
   align-items: center;