Skip to content
This repository was archived by the owner on Mar 9, 2021. It is now read-only.

Commit c10e6bd

Browse files
Zubair Ahmedvinaypuppal
authored andcommitted
space page initial construct (#42)
* 1. top banner component seperated out 2. top-banner included in events and space page * who is this for section added * rest of spaces design complete * check for no image tag in desc * semantic ui updated
1 parent 762ca02 commit c10e6bd

File tree

7 files changed

+184
-39
lines changed

7 files changed

+184
-39
lines changed

components/header.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ export default props => {
8787
padding: 5px 20px;
8888
width: 100%;
8989
background: #fff;
90-
z-index: 1000
90+
z-index: 1000;
9191
}
9292
.header__container {
9393
max-width: 1280px;

components/row-events.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ import PropTypes from 'prop-types';
55

66
const extractImageUrl = input => {
77
const regex = /<img.*?src=['"](.*?)['"]/;
8-
return regex.exec(input)[1];
8+
const matches = regex.exec(input);
9+
return matches ? matches[1] : '';
910
};
1011

1112
const RowEvent = props => {

components/top-banner.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import React from 'react';
2+
3+
export default props => (
4+
<div>
5+
<div>
6+
<div className="top_banner_root">
7+
<h1 className="top_banner_headline">{props.pageTitle}</h1>
8+
<h2>{props.pageSubTitle}</h2>
9+
</div>
10+
<style jsx>{`
11+
.top_banner_root {
12+
background-color: #f4f7fb;
13+
min-height: 200px;
14+
text-align: center;
15+
}
16+
.top_banner_headline {
17+
padding-top: 20px;
18+
font-size: 4em;
19+
color: #df1cb5;
20+
font-weight: 900;
21+
}
22+
`}</style>
23+
</div>
24+
</div>
25+
);

package.json

Lines changed: 15 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
"main": "index.js",
66
"scripts": {
77
"test": "xo",
8-
"lint": "prettier 'utils/**/*.js' 'components/**/*.js' 'pages/**/*.js' 'lib/**/*.js' 'hocs/**/*.js' '*.js' --write --single-quote --print-width='80' --trailing-comma='all' && xo --fix",
8+
"lint":
9+
"prettier 'utils/**/*.js' 'components/**/*.js' 'pages/**/*.js' 'lib/**/*.js' 'hocs/**/*.js' '*.js' --write --single-quote --print-width='80' --trailing-comma='all' && xo --fix",
910
"precommit": "lint-staged",
1011
"analyze": "cross-env ANALYZE=1 next build",
1112
"dev": "cross-env NODE_ENV=development next",
@@ -15,24 +16,15 @@
1516
},
1617
"xo": {
1718
"parser": "babel-eslint",
18-
"extends": [
19-
"prettier",
20-
"prettier/react",
21-
"plugin:react/recommended"
22-
],
23-
"env": [
24-
"browser",
25-
"node"
26-
],
19+
"extends": ["prettier", "prettier/react", "plugin:react/recommended"],
20+
"env": ["browser", "node"],
2721
"rules": {
2822
"linebreak-style": 0,
2923
"react/display-name": 0,
3024
"react/prop-types": 0
3125
},
3226
"space:": 2,
33-
"ignores": [
34-
"next.config.js"
35-
]
27+
"ignores": ["next.config.js"]
3628
},
3729
"lint-staged": {
3830
"*.js": [
@@ -42,8 +34,15 @@
4234
]
4335
},
4436
"keywords": [],
45-
"author": "Vinay Puppal <me@vinaypuppal.com> (https://www.vinaypuppal.com/)",
46-
"license": "BSD",
37+
"contributors": [
38+
"Vinay Puppal <me@vinaypuppal.com> (https://www.vinaypuppal.com/)",
39+
"M-ZubairAhmed <ahmedzubari216@gmail.com> (https://github.com/M-ZubairAhmed)"
40+
],
41+
"repository": {
42+
"type": "git",
43+
"url": "https://github.com/coderplex/coderplex.git"
44+
},
45+
"license": "BSD-3-Clause",
4746
"dependencies": {
4847
"date-fns": "1.29.0",
4948
"feathers-rest": "^1.8.0",
@@ -58,7 +57,7 @@
5857
"react-headroom": "^2.1.6",
5958
"react-icons": "^2.2.5",
6059
"react-textgradient": "0.0.2",
61-
"semantic-ui-react": "^0.71.3"
60+
"semantic-ui-react": "^0.71.5"
6261
},
6362
"devDependencies": {
6463
"axios": "0.16.2",

pages/events.js

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import fetch from 'isomorphic-unfetch';
33
import { Card, Divider, Dimmer, Loader } from 'semantic-ui-react';
44

55
import publicPage from '../hocs/public-page';
6+
import TopBanner from '../components/top-banner';
67
import { baseEventsURL, futureEventsURL, pastEventsURL } from '../utils/urls';
78
import RowEvent from '../components/row-events';
89

@@ -98,10 +99,10 @@ class Events extends React.Component {
9899
render() {
99100
return (
100101
<div>
101-
<div className="top_banner_root">
102-
<h1 className="top_banner_headline">Events</h1>
103-
<h2>Because you cannot change the world alone</h2>
104-
</div>
102+
<TopBanner
103+
pageTitle="Events"
104+
pageSubTitle="Because you cannot change the world alone"
105+
/>
105106
<main>
106107
{this.state.loading ? (
107108
<Dimmer active>
@@ -124,17 +125,6 @@ class Events extends React.Component {
124125
align-items: center;
125126
flex-direction: column;
126127
}
127-
.top_banner_root {
128-
background-color: #f4f7fb;
129-
min-height: 200px;
130-
text-align: center;
131-
}
132-
.top_banner_headline {
133-
padding-top: 20px;
134-
font-size: 4em;
135-
color: #df1cb5;
136-
font-weight: 900;
137-
}
138128
`}</style>
139129
</div>
140130
);

pages/space.js

Lines changed: 135 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,153 @@
11
import React from 'react';
2+
import { Card, Segment, Header, Divider } from 'semantic-ui-react';
23

3-
import Icon from '../components/icon';
4+
import TopBanner from '../components/top-banner';
45
import publicPage from '../hocs/public-page';
56

67
export default publicPage(() => (
78
<div>
9+
<TopBanner
10+
pageTitle="Space"
11+
pageSubTitle="Physical spaces for collaboration, peer-learning and self-learning"
12+
/>
813
<main>
9-
<Icon />
10-
<h3>Under Construction, Coming Soon!...</h3>
14+
<section>
15+
<div>
16+
<Card centered fluid>
17+
<Card.Content>
18+
These are dynamic learning environments, where everyone learns at
19+
their own pace and compliments each other. You can also
20+
participate in weekly group activities like Open source evenings
21+
and other casual competitions
22+
</Card.Content>
23+
</Card>
24+
</div>
25+
</section>
26+
<section>
27+
<h2>Who is this for?</h2>
28+
<div>
29+
<Segment.Group raised piled>
30+
<Segment textAlign="left">
31+
People who are genuinely passionate about tech, who get excited
32+
about learning new skills, building , solving and discussing
33+
problems in latest tech.
34+
</Segment>
35+
<Segment textAlign="left" secondary>
36+
Graduates who are struggling to get a job, who want to build their
37+
expertise in modern technologis and are willing to invest
38+
significant amount to their time self-learning
39+
</Segment>
40+
<Segment textAlign="left">
41+
Students who are willing to learn outside of theri collegs
42+
curriculum, would like to become professional developers down the
43+
line and get exposire to the real world
44+
</Segment>
45+
<Segment textAlign="left" secondary>
46+
Experienced developers, who want to interact with other
47+
developers, contribute to open source, expand their horizons and
48+
learn new technologis.
49+
</Segment>
50+
<Segment textAlign="left">
51+
Professioanls from non-tech background, who want to get started
52+
with tech or switch their careers.
53+
</Segment>
54+
</Segment.Group>
55+
</div>
56+
</section>
57+
<section>
58+
<h2>Activities & Schedule</h2>
59+
<div>
60+
<Segment.Group raised piled>
61+
<Segment textAlign="left">
62+
We will help you pick a technology and provide you with learning
63+
guides to learn and build something on a daily basis.
64+
</Segment>
65+
<Segment textAlign="left" secondary>
66+
<h4>Daily</h4>
67+
You will engage in daily code review and pair programming exercise
68+
with other members.
69+
</Segment>
70+
<Segment textAlign="left">
71+
<h4>Wednesday</h4>
72+
We will have an Open Source Evening, where everyone will be
73+
encouraged to find open source projects and contribute to them.
74+
</Segment>
75+
<Segment textAlign="left" secondary>
76+
<h4>Thursday</h4>
77+
We will have a casual coding competition, where members will
78+
participate to solve coding challenges together.
79+
</Segment>
80+
<Segment textAlign="left">
81+
<h4>Friday - Saturday</h4>
82+
We will have a casual hackathons, where everyone will participate
83+
to build a project, big or small.
84+
</Segment>
85+
<Segment textAlign="left" secondary>
86+
<h4>Saturday</h4>
87+
In evening, we will screen a tech related documentary, movie or TV
88+
show.
89+
</Segment>
90+
<Segment textAlign="left">
91+
<h4>Sunday</h4>
92+
Members will present their work i.e projects or new topics they
93+
have made or learned in the past week
94+
</Segment>
95+
</Segment.Group>
96+
</div>
97+
</section>
98+
<divide>
99+
<Divider section />
100+
</divide>
101+
<section>
102+
<h2>Pricing</h2>
103+
<div>
104+
<Card>
105+
<Card.Content>
106+
<Segment inverted color="pink">
107+
<Header as="h2" inverted>
108+
INR 1000/-
109+
<Header.Subheader>per month</Header.Subheader>
110+
</Header>
111+
</Segment>
112+
<Card.Description>
113+
For membership mail us<br />space@coderplex.org
114+
</Card.Description>
115+
</Card.Content>
116+
</Card>
117+
</div>
118+
<h2>Mode of payment</h2>
119+
<Segment.Group horizontal>
120+
<Segment>UPI</Segment>
121+
<Segment>PayTM</Segment>
122+
<Segment>Cash</Segment>
123+
</Segment.Group>
124+
</section>
11125
</main>
12126
<style jsx>{`
13127
main {
128+
background-color: #ffffff;
129+
padding-top: 30px;
130+
padding-bottom: 30px;
131+
padding-left: 30px;
132+
padding-right: 30px;
14133
min-height: calc(100vh - 70px);
15-
background: #f4f7fb;
16-
color: #314159;
17134
display: flex;
18135
justify-content: center;
19136
align-items: center;
20137
flex-direction: column;
138+
text-align: center;
139+
margin: 0 auto;
140+
}
141+
section {
142+
max-width: 800px;
143+
margin: 50px 0;
144+
}
145+
h2 {
146+
text-transform: uppercase;
147+
padding-bottom: 10px;
148+
}
149+
divide {
150+
width: 100%;
21151
}
22152
`}</style>
23153
</div>

yarn.lock

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5190,7 +5190,7 @@ semantic-release@^8.0.3:
51905190
require-relative "^0.8.7"
51915191
semver "^5.4.1"
51925192

5193-
semantic-ui-react@^0.71.3:
5193+
semantic-ui-react@^0.71.5:
51945194
version "0.71.5"
51955195
resolved "https://registry.yarnpkg.com/semantic-ui-react/-/semantic-ui-react-0.71.5.tgz#c8713f1cbdd63815843949fb611602541d3a20d8"
51965196
dependencies:

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy