Added Footer

pull_request_template.md

@@ -0,0 +1,34 @@
+(Thanks for sending a pull request! Please make sure you click the link above to view the contribution guidelines, then fill out the blanks below.)
+
+What does this implement/fix? Explain your changes.
+---------------------------------------------------
+…
+
+Does this close any currently open issues?
+------------------------------------------
+…
+
+
+Any relevant logs, error output, etc?
+-------------------------------------
+(If it’s long, please paste to https://ghostbin.com/ and insert the link here.)
+
+Any other comments?
+-------------------
+…
+
+Where has this been tested?
+---------------------------
+**Operating System:** …
+
+### Your checklist for this pull request
+🚨Please review the [guidelines for contributing](../CONTRIBUTING.md) to this repository.
+
+- [ ] Make sure you are requesting to **pull a feature/bug branch**. Don't request your master!
+- [ ] Check the commit's or even all commits' message styles matches our requested structure.
+- [ ] Check your code additions will fail neither code linting checks(programmatic errors and stylistic errors)
+
+### Description
+Please describe your pull request.
+
+💔Thank you!

src/App.tsx

@@ -12,6 +12,7 @@ import Alert from "./components/layouts/Alert";
 import About from "./components/pages/About";
 import Home from "./components/pages/Home";
 import NotFound from "./components/pages/NotFound";
+import Footer from "./components/pages/Footer";
 
 // States (Context API)
 import GithubState from "./context/github/githubState";
@@ -37,6 +38,7 @@ const App = ():JSX.Element => {
               </Switch>
             </div>
           </div>
+          <Footer />
         </Router>
       </AlertState>
     </GithubState>

src/components/layouts/FooterElements.js

@@ -0,0 +1,46 @@
+import React from 'react'
+
+const footerStyles = {
+  backgroundColor: '#e3143e',
+  bottom: 0,
+}
+
+const anchorStyles = {
+  color: '#f7f7f5'
+}
+
+const FooterWrapper = class extends React.Component {
+  render() {
+    return (
+      <div className = "app-footer">
+      <footer className="footer" style = {footerStyles}>
+
+        <div className="content">
+          <div className="container has-background-black has-text-white-ter">
+            <div style={{ maxWidth: '100vw' }} className="columns">
+              <div className="column is-4">
+                <a title="Report a bug on our Github Repo" style = {anchorStyles} href="https://github.com/sarthakkundra/Github-Finder/issues">
+                  Report a bug
+                </a>
+                </div>
+                <div className="column is-4"> 
+                <a title="Request a feature" style = {anchorStyles} href="https://github.com/sarthakkundra/Github-Finder/issues">
+                  Request a feature
+                </a>
+                </div>
+                <div className="column is-4">
+                <a title="Contribute" style = {anchorStyles} href="https://github.com/sarthakkundra/Github-Finder">
+                  Contribute to Repository
+                </a>
+
+              </div>
+            </div>
+          </div>
+        </div>
+      </footer>
+      </div>
+    )
+  }
+}
+
+export default FooterWrapper

src/components/pages/Footer.js

@@ -0,0 +1,11 @@
+import React from "react"
+import FooterWrapper from "../layouts/FooterElements"
+
+const Footer = () => {
+    return <FooterWrapper>
+
+    </FooterWrapper>
+
+}
+
+export default Footer