Footer

src/App.tsx

@@ -15,7 +15,6 @@ import { Header } from "@polkadot/types/interfaces";
 interface IProps {}
 
 const version = 6;
-const userLink = `${domain}/#/members/joystreamstats`;
 
 const initialState = {
   assets: [],
@@ -511,11 +510,7 @@ class App extends React.Component<IProps, IState> {
 
         <Modals toggleShowStatus={this.toggleShowStatus} {...this.state} />
 
-        <Footer
-          show={!hideFooter}
-          toggleHide={this.toggleFooter}
-          link={userLink}
-        />
+        <Footer show={!hideFooter} toggleHide={this.toggleFooter} />
 
         <Status
           toggleShowStatus={this.toggleShowStatus}

src/components/Dashboard/Footer.tsx

@@ -1,5 +1,10 @@
 import React from "react";
+import { Link } from "@material-ui/core";
 import { X, Info } from "react-feather";
+import { domain } from "../../config";
+
+const donationUrl = `${domain}/#/members/joystreamstats`;
+const ideasUrl = `${domain}/#/forum/threads/257`;
 
 const Footer = (props: {
   show: boolean;
@@ -12,16 +17,16 @@ const Footer = (props: {
       <Info className="footer-hidden" onClick={() => props.toggleHide()} />
     );
   return (
-    <div className="w-100 footer text-light">
+    <div className="footer">
       <X className="footer-hidden" onClick={() => props.toggleHide()} />
       If you find this place useful, please consider to{" "}
-      <a className="mx-1 text-light" href={link}>
-        <u>send some tokens</u>
-      </a>
+      <Link className="mx-1" href={donationUrl}>
+        <u>donate some tokens</u>
+      </Link>
       or a
-      <a className="mx-1 text-light" href="/forum/threads/257">
+      <Link className="mx-1" href={ideasUrl}>
         <u>message with ideas</u>
-      </a>{" "}
+      </Link>{" "}
       to make it even better.
     </div>
   );

src/components/Proposals/Row.tsx

@@ -101,7 +101,7 @@ const ProposalRow = (props: {
   const left = `${period - blocks} / ${period} blocks left (${percent}%)`;
   const classes = useStyles();
 
-  const hasToVote = council?.consuls.filter(
+  const hasToVote = council?.consuls?.filter(
     (c) => !votes.find((v) => v.member.handle === c.member.handle)
   );
 

src/index.css

@@ -275,9 +275,8 @@ table td {
   left: 0px;
 }
 .footer {
-  background: black;
   text-align: center;
-  position: fixed;
+  posoition: fixed;
   bottom: 0px;
   padding: 5px;
   width: 100%;