Skip to content

Commit e233126

Browse files
subodhk01subodhk01
committed
Added atomizereact and various other changes
1 parent 6edd4c3 commit e233126

25 files changed

+444
-321
lines changed

Diff for: ‎components/Date/Date.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import {parseISO, format, parse} from 'date-fns'
1+
import { parseISO, format, parse } from 'date-fns'
22

3-
export default function Date({dateString}) {
4-
const date = parseISO(dateString)
5-
return <time dateTime={dateString} className="regualr-text">{format(date, 'LLLL d, yyyy')}</time>
3+
export default function Date({ dateString }) {
4+
const date = parseISO(dateString)
5+
return <time dateTime={dateString} className="regualr-text">{format(date, 'LLLL d, yyyy')}</time>
66
}

Diff for: ‎components/HackathonCard/HackathonCard.js

+31-29
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,37 @@
1-
import { Card, Row, Button, Col } from "react-bootstrap";
1+
import { Div, Row, Col, Text, Image, Button } from 'atomize'
22
import Date from "../Date/Date";
33

44
export default function HackathonCard({ hackathon }) {
55
return (
6-
<>
7-
<Card className="shadow-sm" id="main">
8-
<Card.Img style={{ height: 200 }} variant="top" src={hackathon.image} />
9-
<Card.Body>
10-
<Card.Title>
11-
<h5 className="card-title">{hackathon.title}</h5>
12-
</Card.Title>
13-
14-
<Card.Text className="regular-text">{hackathon.description}</Card.Text>
15-
<Card.Subtitle className="mb-2 card-sub-title">Event Date</Card.Subtitle>
16-
<Row className="justify-content-space-between">
17-
<Col>
18-
<Date dateString={hackathon.start}></Date>
19-
</Col>
20-
<Col>
21-
<Button variant="info" href="">
22-
See more...
23-
</Button>
24-
</Col>
25-
</Row>
26-
</Card.Body>
27-
</Card>
28-
<style jsx>{`
29-
.shadow-sm:hover {
30-
box-shadow: 0 .125rem .25rem #003e54 !important;
31-
}
32-
`}</style>
33-
</>
6+
<>
7+
<Div bg="white" shadow="4" rounded="xl" m={{ b: "1rem" }}>
8+
<Div>
9+
<Image src={hackathon.image} rounded={{ t: "xl" }} />
10+
</Div>
11+
<Div p="1.5rem">
12+
<Text tag="h3" textSize="title" textColor="#003e54" fontFamily="madetommy-bold">
13+
{hackathon.title}
14+
</Text>
15+
<Text m={{ b: "1rem" }}>
16+
{hackathon.description}
17+
</Text>
18+
<Row>
19+
<Col size="7">
20+
<Text textSize="subheader" textWeight="500">
21+
<Date dateString={hackathon.start} />
22+
</Text>
23+
<Text textSize="caption" textColor="light">
24+
event
25+
</Text>
26+
</Col>
27+
<Col size="5">
28+
<Button m={{ l: "auto" }}>
29+
See more...
30+
</Button>
31+
</Col>
32+
</Row>
33+
</Div>
34+
</Div>
35+
</>
3436
);
3537
}

Diff for: ‎components/Header/Header.js

+57-54
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,65 @@
1+
import { Button } from "atomize";
12
import { useAuth } from "../../context/auth";
23
import { loadFirebase } from "../../context/firebase";
34
import axiosInstance from "../../util/axios";
45

56
export default function Header() {
6-
const { setFirebaseUser, token, setToken } = useAuth()
7-
const handleSignIn = async () => {
8-
var firebase = await loadFirebase();
9-
var provider = new firebase.auth.GoogleAuthProvider();
10-
provider.addScope('email');
11-
provider.addScope('profile');
12-
firebase.auth().signInWithPopup(provider)
13-
.then(() => {
14-
console.log("login success")
15-
})
16-
.catch(err => {
17-
alert('Error Processing request, try again.');
18-
console.log(err);
19-
});
20-
}
21-
const handleLogout = async () => {
22-
var firebase = await loadFirebase();
23-
firebase.auth().signOut().then(function () {
24-
setFirebaseUser(null)
25-
setToken(null)
26-
delete axiosInstance.defaults.headers.common['Authentication']
27-
}).catch(function (err) {
28-
alert('Error Processing request, try again.');
29-
console.log(err);
30-
});
31-
}
32-
return (
33-
<div>
34-
<div className="d-flex align-items-center justify-content-between w-100 p-3">
35-
<div>
36-
<div className="font-weight-bold">
37-
COPS <span className="text-monospace">Hackalog</span>
38-
</div>
39-
</div>
40-
<div>
41-
<div className="d-flex align-items-center">
42-
<div className="p-2">
43-
Hackathons
7+
const { setFirebaseUser, token, setToken } = useAuth()
8+
const handleSignIn = async () => {
9+
var firebase = await loadFirebase();
10+
var provider = new firebase.auth.GoogleAuthProvider();
11+
provider.addScope('email');
12+
provider.addScope('profile');
13+
firebase.auth().signInWithPopup(provider)
14+
.then(() => {
15+
console.log("login success")
16+
})
17+
.catch(err => {
18+
alert('Error Processing request, try again.');
19+
console.log(err);
20+
});
21+
}
22+
const handleLogout = async () => {
23+
var firebase = await loadFirebase();
24+
firebase.auth().signOut().then(function () {
25+
setFirebaseUser(null)
26+
setToken(null)
27+
delete axiosInstance.defaults.headers.common['Authentication']
28+
}).catch(function (err) {
29+
alert('Error Processing request, try again.');
30+
console.log(err);
31+
});
32+
}
33+
return (
34+
<div className="position-fixed w-100 bg-white" style={{ zIndex: "10" }}>
35+
<div className="d-flex align-items-center justify-content-between w-100 p-3">
36+
<div>
37+
<div className="font-weight-bold">
38+
COPS <span className="text-monospace">Hackalog</span>
39+
</div>
40+
</div>
41+
<div>
42+
<div className="d-flex align-items-center">
43+
<div className="p-2">
44+
<Button shadow="3" hoverShadow="4" m={{ r: "1rem" }} p="1rem">
45+
Hackathons
46+
</Button>
47+
</div>
48+
{token ?
49+
<Button shadow="3" hoverShadow="4" m={{ r: "1rem" }} p="1rem" onClick={() => handleLogout()}>
50+
Logout
51+
</Button>
52+
:
53+
<Button shadow="3" hoverShadow="4" m={{ r: "1rem" }} p="1rem" onClick={() => handleSignIn()}>
54+
Login with Google
55+
</Button>
56+
}
57+
</div>
58+
</div>
4459
</div>
45-
{token ?
46-
<div className="p-2" onClick={() => handleLogout()}>
47-
Logout
48-
</div>
49-
:
50-
<div className="p-2" onClick={() => handleSignIn()}>
51-
Login with Google
52-
</div>
53-
}
54-
</div>
55-
</div>
56-
</div>
57-
<style jsx>{`
60+
<style jsx>{`
5861
59-
`}</style>
60-
</div>
61-
)
62+
`}</style>
63+
</div>
64+
)
6265
}

Diff for: ‎context/styletron.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Client, Server } from 'styletron-engine-atomic'
2+
import { DebugEngine } from 'styletron-react'
3+
4+
const getHydrateClass = () =>
5+
document.getElementsByClassName('_styletron_hydrate_')
6+
7+
export const styletron =
8+
typeof window === 'undefined'
9+
? new Server()
10+
: new Client({
11+
hydrate: getHydrateClass(),
12+
})
13+
14+
export const debug =
15+
process.env.NODE_ENV === 'production' ? void 0 : new DebugEngine()

Diff for: ‎css/font.css

+21
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,23 @@
11
@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@200;300;400;500;600;700;800;900&display=swap');
22
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500;600;700;800;900&display=swap');
3+
4+
@font-face {
5+
font-family: 'madetommy-thin';
6+
src: url('/static/fonts/madetommy/mt-thin.ttf') format('truetype')
7+
}
8+
@font-face {
9+
font-family: 'madetommy-light';
10+
src: url('/static/fonts/madetommy/mt-light.ttf') format('truetype')
11+
}
12+
@font-face {
13+
font-family: 'madetommy-regular';
14+
src: url('/static/fonts/madetommy/mt-regular.ttf') format('truetype')
15+
}
16+
@font-face {
17+
font-family: 'madetommy-bold';
18+
src: url('/static/fonts/madetommy/mt-bold.ttf') format('truetype')
19+
}
20+
@font-face {
21+
font-family: 'helvetica-regular';
22+
src: url('/static/fonts/helvetica/helvetica-regular.ttf') format('truetype')
23+
}

Diff for: ‎css/misc.css

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
.pt-6 {padding-top: 3.5rem;}
2+
.pt-7 {padding-top: 4rem;}
3+
.pt-8 {padding-top: 4.5rem;}
4+
.pt-9 {padding-top: 5rem;}
5+
.pt-10 {padding-top: 5.5rem;}
6+
.pb-6 {padding-bottom: 3.5rem;}
7+
.pb-7 {padding-bottom: 4rem;}
8+
.pb-8 {padding-bottom: 4.5rem;}
9+
.pb-9 {padding-bottom: 5rem;}
10+
.pb-10 {padding-bottom: 5.5rem;}
11+
.py-6 {padding: 3.5rem 0rem;}
12+
.py-7 {padding: 4rem 0rem;}
13+
.py-8 {padding: 4.5rem 0rem;}
14+
.py-9 {padding: 5rem 0rem;}
15+
.py-10 {padding: 5.5rem 0rem;}
16+
17+
.cursor-pointer { cursor: pointer; }
18+
.container-lg { max-width: 90vw; }
19+
.mt-light { font-family: "madetommy-light"; }
20+
.mt-thin { font-family: "madetommy-thin"; }
21+
.mt-bold { font-family: "madetommy-bold"; }
22+
.mt-regular { font-family: "madetommy-regular"; }

Diff for: ‎css/style.css

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
body {
2-
font-family: "Raleway";
2+
font-family: "madetommy-regular";
33
font-weight: 500;
44
}
55

@@ -39,6 +39,7 @@ h6 {
3939
.jumbotron-heading {
4040
font-weight: 700;
4141
font-size: 2.5rem;
42+
font-family: "madetommy-bold";
4243
color: #003e54;
4344
}
4445

@@ -64,4 +65,9 @@ h6 {
6465
font-size: 1rem;
6566
font-weight: 400;
6667
color: #748f99;
68+
}
69+
70+
.btn {
71+
padding: 0.56rem 1.9rem;
72+
font-family: "madetommy-regular";
6773
}

Diff for: ‎next.config.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
webpack: function (config) {
3+
config.externals = config.externals || {}
4+
config.externals['styletron-server'] = 'styletron-server'
5+
return config
6+
},
7+
}

0 commit comments

Comments
 (0)