rest of spaces design complete

M-ZubairAhmed · M-ZubairAhmed · commit b35d126471b5 · 2017-10-22T12:19:25.000+05:30
diff --git a/pages/space.js b/pages/space.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Card, Segment } from 'semantic-ui-react';
+import { Card, Segment, Header, Divider } from 'semantic-ui-react';
 
 import TopBanner from '../components/top-banner';
 import publicPage from '../hocs/public-page';
@@ -13,7 +13,7 @@ export default publicPage(() => (
     <main>
       <section>
         <div>
-          <Card centered raised fluid>
+          <Card centered fluid>
             <Card.Content>
               These are dynamic learning environments, where everyone learns at
               their own pace and compliments each other. You can also
@@ -62,9 +62,66 @@ export default publicPage(() => (
               We will help you pick a technology and provide you with learning
               guides to learn and build something on a daily basis.
             </Segment>
+            <Segment textAlign="left" secondary>
+              <h4>Daily</h4>
+              You will engage in daily code review and pair programming exercise
+              with other members.
+            </Segment>
+            <Segment textAlign="left">
+              <h4>Wednesday</h4>
+              We will have an Open Source Evening, where everyone will be
+              encouraged to find open source projects and contribute to them.
+            </Segment>
+            <Segment textAlign="left" secondary>
+              <h4>Thursday</h4>
+              We will have a casual coding competition, where members will
+              participate to solve coding challenges together.
+            </Segment>
+            <Segment textAlign="left">
+              <h4>Friday - Saturday</h4>
+              We will have a casual hackathons, where everyone will participate
+              to build a project, big or small.
+            </Segment>
+            <Segment textAlign="left" secondary>
+              <h4>Saturday</h4>
+              In evening, we will screen a tech related documentary, movie or TV
+              show.
+            </Segment>
+            <Segment textAlign="left">
+              <h4>Sunday</h4>
+              Members will present their work i.e projects or new topics they
+              have made or learned in the past week
+            </Segment>
           </Segment.Group>
         </div>
       </section>
+      <divide>
+        <Divider section />
+      </divide>
+      <section>
+        <h2>Pricing</h2>
+        <div>
+          <Card>
+            <Card.Content>
+              <Segment inverted color="pink">
+                <Header as="h2" inverted>
+                  INR 1000/-
+                  <Header.Subheader>per month</Header.Subheader>
+                </Header>
+              </Segment>
+              <Card.Description>
+                For membership mail us<br />space@coderplex.org
+              </Card.Description>
+            </Card.Content>
+          </Card>
+        </div>
+        <h2>Mode of payment</h2>
+        <Segment.Group horizontal>
+          <Segment>UPI</Segment>
+          <Segment>PayTM</Segment>
+          <Segment>Cash</Segment>
+        </Segment.Group>
+      </section>
     </main>
     <style jsx>{`
       main {
@@ -79,14 +136,18 @@ export default publicPage(() => (
         align-items: center;
         flex-direction: column;
         text-align: center;
-        max-width: 800px;
         margin: 0 auto;
       }
       section {
+        max-width: 800px;
         margin: 50px 0;
       }
       h2 {
         text-transform: uppercase;
+        padding-bottom: 10px;
+      }
+      divide {
+        width: 100%;
       }
     `}</style>
   </div>
