From f28cee5a4df4e67e651c0acf410730c02cd95264 Mon Sep 17 00:00:00 2001
From: Mrugesh Mohapatra <me@raisedadead.com>
Date: Mon, 18 Feb 2019 17:07:26 +0530
Subject: [PATCH] feat(pages): import sponsors page to subdirectory

---
 client/src/pages/sponsors.css |  15 ++++
 client/src/pages/sponsors.js  | 131 ++++++++++++++++++++++++++++++++++
 2 files changed, 146 insertions(+)
 create mode 100644 client/src/pages/sponsors.css
 create mode 100644 client/src/pages/sponsors.js

diff --git a/client/src/pages/sponsors.css b/client/src/pages/sponsors.css
new file mode 100644
index 0000000000..70ae1a6e5b
--- /dev/null
+++ b/client/src/pages/sponsors.css
@@ -0,0 +1,15 @@
+.img-responsive {
+  display: block;
+  max-width: 100%;
+  height: auto;
+}
+
+.sponsor-logos {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+
+.sponsor-logo {
+  max-height: 80px;
+}
diff --git a/client/src/pages/sponsors.js b/client/src/pages/sponsors.js
new file mode 100644
index 0000000000..597f5357be
--- /dev/null
+++ b/client/src/pages/sponsors.js
@@ -0,0 +1,131 @@
+/* eslint-disable max-len */
+import React, { Fragment } from 'react';
+import Helmet from 'react-helmet';
+import { Grid, Col, Row } from '@freecodecamp/react-bootstrap';
+
+import Spacer from '../components/helpers/Spacer';
+
+import './sponsors.css';
+
+const SponsorsPage = () => {
+  return (
+    <Fragment>
+      <Helmet
+        title='Sponsors who help freeCodeCamp through financial and in-kind sponsorship | freeCodeCamp.org'
+      />
+      <Spacer />
+      <Grid className='container'>
+        <Row className='text-center'>
+          <Col md={8} mdOffset={2} sm={10} smOffset={1} xs={12}>
+            <h2>Financial Sponsors</h2>
+            <h3>
+              These companies give supporting donations to freeCodeCamp.org
+            </h3>
+            <hr />
+            <Row className='sponsor-logos'>
+              <a
+                href='https://www.class-central.com'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="Class Central's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/class-central-logo.jpg'
+                />
+              </a>
+              <a
+                href='https://www.tsugicloud.org'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="TsugiCloud's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/tsugicloud-logo.png'
+                />
+              </a>
+            </Row>
+            <h2>In-kind sponsors</h2>
+            <h3>These companies donate their services to freeCodeCamp.org</h3>
+            <hr />
+            <Row className='sponsor-logos'>
+              <a
+                href='https://netlify.com'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="Netlify's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/netlify-logo.jpg'
+                />
+              </a>
+              <a
+                href='https://www.mlab.com/'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="mLab's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/mLab-logo.png'
+                />
+              </a>
+              <a
+                href='https://auth0.com'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="Auth0's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/auth0-logo.png'
+                />
+              </a>
+            </Row>
+            <Row className='sponsor-logos'>
+              <a
+                href='https://www.discourse.org/'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="Discourse's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/discourse-logo.png'
+                />
+              </a>
+              <a
+                href='https://algolia.com'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="Algolia's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/algolia-logo.jpg'
+                />
+              </a>
+              <a
+                href='https://cloudflare.com'
+                rel='noopener noreferrer'
+                target='_blank'
+                >
+                <img
+                  alt="Cloudflare's logo"
+                  className='img-responsive sponsor-logo'
+                  src='https://s3.amazonaws.com/freecodecamp/cloudflare-logo.jpg'
+                />
+              </a>
+            </Row>
+          </Col>
+        </Row>
+      </Grid>
+    </Fragment>
+  );
+};
+
+SponsorsPage.displayName = 'SponsorsPage';
+
+export default SponsorsPage;