From f7f295611c0b5ab7d213fd06e43984cc90b6ec15 Mon Sep 17 00:00:00 2001 From: Rachel Ruderman Date: Fri, 3 Jul 2020 00:32:14 -0700 Subject: [PATCH] Add footer --- .env.template | 6 -- public/MediumPost.html | 3 +- public/react/Footer/index.js | 144 +++++++++++++++++++++++++++++++++++ src/Footer/index.js | 78 +++++++++++++++++++ 4 files changed, 224 insertions(+), 7 deletions(-) delete mode 100644 .env.template create mode 100644 public/react/Footer/index.js create mode 100644 src/Footer/index.js diff --git a/.env.template b/.env.template deleted file mode 100644 index ad9d69a..0000000 --- a/.env.template +++ /dev/null @@ -1,6 +0,0 @@ -# Required for all uses -# It takes 2 mins to get a free twilio account https://www.twilio.com/login -# Fill in your credentials below and rename this file to .env - -TWILIO_ACCOUNT_SID=YourAccountSIDHere -LOCAL_AUTH_TOKEN=YourAuthTokenHere diff --git a/public/MediumPost.html b/public/MediumPost.html index 3ebea45..b1e2c9f 100644 --- a/public/MediumPost.html +++ b/public/MediumPost.html @@ -8,7 +8,7 @@
- + @@ -16,6 +16,7 @@ + \ No newline at end of file diff --git a/public/react/Footer/index.js b/public/react/Footer/index.js new file mode 100644 index 0000000..83c1a73 --- /dev/null +++ b/public/react/Footer/index.js @@ -0,0 +1,144 @@ +var Footer = function Footer() { + + var renderBrand = function renderBrand() { + return React.createElement( + "div", + { className: "brand" }, + React.createElement( + "a", + { href: "/" }, + React.createElement("img", { src: "images/logo.svg", alt: "Neon", width: "32", height: "32" }) + ) + ); + }; + + var renderCopyright = function renderCopyright() { + var currentYear = new Date().getFullYear(); + return React.createElement( + "div", + { "class": "footer-copyright" }, + "\xA9 ", + currentYear, + " Zipcall, all rights reserved" + ); + }; + + var renderSocials = function renderSocials() { + return React.createElement( + "div", + { className: "footer-social" }, + React.createElement( + "div", + null, + React.createElement( + "a", + { + target: "_blank", + href: "https://github.com/ianramzy/decentralized-video-chat" + }, + React.createElement( + "svg", + { + width: "16", + height: "16", + viewBox: "0 0 16 16", + xmlns: "http://www.w3.org/2000/svg" + }, + React.createElement( + "title", + null, + "GitHub" + ), + React.createElement("path", { + d: "M7.95 0C3.578 0 0 3.578 0 7.95c0 3.479 2.286 6.46 5.466 7.553.397.1.497-.199.497-.397v-1.392c-2.187.497-2.683-.994-2.683-.994-.398-.894-.895-1.192-.895-1.192-.696-.497.1-.497.1-.497.795.1 1.192.795 1.192.795.696 1.292 1.888.894 2.286.696.1-.497.298-.895.497-1.093-1.79-.2-3.578-.895-3.578-3.976 0-.894.298-1.59.795-2.087-.1-.198-.397-.993.1-2.086 0 0 .695-.2 2.186.795a6.408 6.408 0 0 1 1.987-.299c.696 0 1.392.1 1.988.299 1.49-.994 2.186-.795 2.186-.795.398 1.093.199 1.888.1 2.086.496.597.795 1.292.795 2.087 0 3.081-1.889 3.677-3.677 3.876.298.398.596.895.596 1.59v2.187c0 .198.1.496.596.397C13.714 14.41 16 11.43 16 7.95 15.9 3.578 12.323 0 7.95 0z" + }) + ) + ) + ) + ); + }; + + var renderNav = function renderNav() { + return React.createElement( + "nav", + { className: "footer-nav" }, + React.createElement( + "ul", + { className: "list-reset" }, + React.createElement( + "li", + null, + React.createElement( + "a", + { target: "_blank", href: "https://ianramzy.com" }, + "Made with \u2764\uFE0F by Ian Ramzy" + ) + ), + React.createElement( + "li", + null, + React.createElement( + "a", + { href: "#" }, + "Contact" + ) + ), + React.createElement( + "li", + null, + React.createElement( + "a", + { href: "#" }, + "About us" + ) + ), + React.createElement( + "li", + null, + React.createElement( + "a", + { href: "#" }, + "FAQ's" + ) + ), + React.createElement( + "li", + null, + React.createElement( + "a", + { href: "#" }, + "Support" + ) + ) + ) + ); + }; + + return React.createElement( + "footer", + { className: "site-footer center-content-mobile", id: "footer" }, + React.createElement( + "div", + { className: "container" }, + React.createElement( + "div", + { className: "site-footer-inner" }, + React.createElement( + "div", + { className: "footer-top space-between text-xxs" }, + renderBrand(), + renderSocials() + ), + React.createElement( + "div", + { className: "footer-bottom space-between text-xxs invert-order-desktop" }, + renderNav(), + renderCopyright() + ) + ) + ) + ); +}; + +var domContainer = document.getElementById('footer'); +ReactDOM.render(React.createElement(Footer, null), domContainer); \ No newline at end of file diff --git a/src/Footer/index.js b/src/Footer/index.js new file mode 100644 index 0000000..b9e2e43 --- /dev/null +++ b/src/Footer/index.js @@ -0,0 +1,78 @@ +const Footer = () => { + + const renderBrand = () => ( +
+ + Neon + +
+ ) + + const renderCopyright = () => { + const currentYear = new Date().getFullYear(); + return ( +
+ © {currentYear} Zipcall, all rights reserved +
+ ) + } + + const renderSocials = () => ( +
+
+ + + GitHub + + + +
+
+ ) + + const renderNav = () => ( + + ) + + return ( + + ); + } + + const domContainer = document.getElementById('footer'); + ReactDOM.render(