Skip to content

Commit 1687fe4

Browse files
authored
Improvements to Website (#214)
* Multiple Improvements to website added text assests Multiple Improvements to website converted SVGs to material icons joinus and donate sections added added blogs added testimonials section removed redundant code medium CORS solution page transition added clickable fading blog cards updates netlify functions, twitter, medium optimizations to lambda functions testimonials update requested changes suggested changes * removed commented code
1 parent f165cca commit 1687fe4

File tree

105 files changed

+4361
-3141
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

105 files changed

+4361
-3141
lines changed

.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@ node_modules/
22
.DS_Store
33
ngrok
44
build/
5+
lambda/

netlify-functions/getBlogs.js

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
const axios = require("axios");
2+
const xml2js = require("xml2js");
3+
4+
exports.handler = async (event, context, callback) => {
5+
const mediumURL = "https://medium.com/feed/codeuino";
6+
try {
7+
const response = await axios.get(`${mediumURL}`);
8+
const data = response.data;
9+
xml2js.parseString(data, (err, result) => {
10+
const sendthis = result.rss.channel[0].item.slice(0, 3);
11+
callback(null, {
12+
statusCode: 200,
13+
headers: {
14+
"Access-Control-Allow-Origin": "*"
15+
},
16+
body: JSON.stringify(sendthis)
17+
});
18+
});
19+
} catch (err) {
20+
console.log(err);
21+
}
22+
};

netlify-functions/getLikedTweets.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
const TwitterAxios = require("../src/helpers/twitterAxios");
2+
3+
exports.handler = async (event, context, callback) => {
4+
try {
5+
const likedTweetsResponse = await TwitterAxios.get(
6+
"/favorites/list.json?count=50&screen_name=codeuino"
7+
);
8+
9+
callback(null, {
10+
statusCode: 200,
11+
headers: {
12+
"Access-Control-Allow-Origin": "*"
13+
},
14+
body: JSON.stringify(likedTweetsResponse.data)
15+
});
16+
} catch (err) {
17+
console.log(err);
18+
}
19+
};

netlify-functions/getTweets.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
const TwitterAxios = require("../src/helpers/twitterAxios");
2+
3+
exports.handler = async (event, context, callback) => {
4+
try {
5+
const allTweetsResponse = await TwitterAxios.get(
6+
"/statuses/user_timeline.json?screen_name=codeuino&count=100"
7+
);
8+
9+
callback(null, {
10+
statusCode: 200,
11+
headers: {
12+
"Access-Control-Allow-Origin": "*"
13+
},
14+
body: JSON.stringify(allTweetsResponse.data)
15+
});
16+
} catch (err) {
17+
console.log(err);
18+
}
19+
};

netlify.toml

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
[ build ]
2+
functions = "lambda"
3+
4+
# provide twitter api key
5+
[build.environment]
6+
TWITTER_API_KEY = "AAAAAAAAAAAAAAAAAAAAAIWYFwEAAAAAA3RBpjzS8nlirryXCXM%2FTsl8sKo%3DaWb1t2lrgmUeZqvFF6OTiyALws9gdVKkO0009mYmqvDcr2LAy2"

package-lock.json

+2,143-86
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

+11-2
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@
55
"private": true,
66
"dependencies": {
77
"@fortawesome/fontawesome-free": "^5.13.1",
8+
"@material-ui/core": "^4.11.0",
9+
"@material-ui/icons": "^4.9.1",
810
"@testing-library/jest-dom": "^4.2.4",
911
"@testing-library/react": "^9.4.0",
1012
"@testing-library/user-event": "^7.2.1",
@@ -25,31 +27,38 @@
2527
"markdown-it-sup": "^1.0.0",
2628
"markdown-it-task-lists": "^2.1.1",
2729
"marked": "^0.8.0",
30+
"netlify-lambda": "^2.0.1",
2831
"react": "^16.12.0",
2932
"react-bootstrap": "^1.0.0-beta.16",
3033
"react-dom": "^16.12.0",
34+
"react-html-parser": "^2.0.2",
3135
"react-markdown": "^4.3.1",
3236
"react-markdown-editor-lite": "^0.5.2",
3337
"react-markdown-to-html": "^1.0.11",
38+
"react-multi-carousel": "^2.5.5",
3439
"react-router": "^3.2.5",
3540
"react-router-dom": "^5.1.2",
3641
"react-router-hash-link": "^1.2.2",
3742
"react-scripts": "^3.4.0",
3843
"react-slideshow-image": "^1.3.3",
44+
"react-transition-group": "^4.4.1",
3945
"react-twitter-embed": "^3.0.3",
4046
"serve": "^11.3.0",
41-
"typescript": "^3.9.6"
47+
"typescript": "^3.9.6",
48+
"xml2js": "^0.4.23"
4249
},
4350
"resolutions": {
4451
"react-dev-utils": "10.1.0"
4552
},
4653
"scripts": {
54+
"lambda-serve": "netlify-lambda serve netlify-functions",
4755
"heroku-postbuild": "npm run build",
4856
"start": "serve -s build -l 3000",
57+
"prebuild": "netlify-lambda build netlify-functions",
4958
"build": "CI=false && set \"CI=false\" && react-scripts build",
5059
"test": "react-scripts test",
5160
"eject": "react-scripts eject",
52-
"start-dev": "react-scripts start"
61+
"start-dev": "npm run lambda-serve & react-scripts start && fg"
5362
},
5463
"eslintConfig": {
5564
"extends": "react-app"

src/App.css

+43-46
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@font-face {
2-
font-family: 'Inter';
3-
src: local('Inter'), url(./fonts/Inter-Regular.otf) format('opentype');
2+
font-family: "Inter";
3+
src: local("Inter"), url(./fonts/Inter-Regular.otf) format("opentype");
44
}
55

66
p {
@@ -16,53 +16,38 @@ p {
1616
pointer-events: none;
1717
}
1818

19-
.navbar{
20-
height:10vh;
19+
.navbar {
20+
height: 10vh;
2121
}
22-
.navbar-collapse.show{
22+
.navbar-collapse.show {
2323
overflow-y: hidden;
2424
}
25-
/* #logo{
26-
width:10vw;
27-
} */
28-
@media only screen and (max-width:800px){
29-
#logo{
30-
width:30vw !important;
25+
26+
@media only screen and (max-width: 800px) {
27+
#logo {
28+
width: 30vw !important;
3129
}
3230
}
33-
.main{
31+
.main {
3432
margin: 0 auto;
35-
/* margin-top:12vh; */
3633
max-width: 960;
3734
padding: 0px 1.0875rem 1.45rem;
3835
padding-top: 0;
3936
}
40-
footer{
37+
footer {
4138
margin-top: 3vh;
42-
/* background-color:#869AB8; */
43-
/* color:white; */
44-
}
45-
/* @media (min-width: 1200px){
46-
.container {
47-
max-width: 80% !important;
4839
}
49-
} */
50-
/* footer h3{
51-
52-
float:left
53-
} */
5440

5541
#discover1 {
5642
font-family: Raleway-SemiBold;
5743
font-size: 0.8em;
58-
color:black;
44+
color: black;
5945
letter-spacing: 1px;
6046
line-height: 15px;
6147
border: 2px solid black;
6248
border-radius: 40px;
6349
background: white;
6450
transition: all 0.3s ease 0s;
65-
/* float:right; */
6651
}
6752

6853
#discover2 {
@@ -72,30 +57,24 @@ footer{
7257
display: none;
7358
}
7459

75-
@media only screen and (max-width:1800px){
76-
.navbar{
77-
height:12vh
60+
@media only screen and (max-width: 1800px) {
61+
.navbar {
62+
height: 12vh;
7863
}
79-
/* .main{
80-
margin-top:12vh
81-
} */
8264
}
8365

84-
@media only screen and (max-width:1024px){
85-
.navbar{
86-
height:12vh
87-
}
88-
.main{
89-
/* margin-top:12vh */
66+
@media only screen and (max-width: 1024px) {
67+
.navbar {
68+
height: 12vh;
9069
}
9170
}
9271

93-
@media only screen and (max-width:320px){
94-
.navbar{
95-
height:16vh;
72+
@media only screen and (max-width: 320px) {
73+
.navbar {
74+
height: 16vh;
9675
}
97-
.main{
98-
margin-top:16vh
76+
.main {
77+
margin-top: 16vh;
9978
}
10079
}
10180

@@ -105,8 +84,6 @@ footer{
10584
}
10685
}
10786

108-
109-
11087
.App-header {
11188
background-color: #282c34;
11289
min-height: 100vh;
@@ -122,6 +99,26 @@ footer{
12299
color: #61dafb;
123100
}
124101

102+
.fade-appear,
103+
.fade-enter {
104+
opacity: 0;
105+
z-index: 1;
106+
}
107+
.fade-appear-active,
108+
.fade-enter.fade-enter-active {
109+
opacity: 1;
110+
transition: opacity 300ms linear 150ms;
111+
}
112+
113+
.fade-exit {
114+
opacity: 1;
115+
}
116+
117+
.fade-exit.fade-exit-active {
118+
opacity: 0;
119+
transition: opacity 150ms linear;
120+
}
121+
125122
@keyframes App-logo-spin {
126123
from {
127124
transform: rotate(0deg);

src/App.js

+32-27
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,46 @@
11
import { Switch, Route, HashRouter as Router } from "react-router-dom";
2+
import { CSSTransition, TransitionGroup } from "react-transition-group";
23
import React from "react";
34
import "./App.css";
4-
import NewBlog from "./pages/NewBlog/NewBlog";
5-
import BlogList from "./pages/Blogs/BlogList";
65
import NewHome from "./pages/Home/NewHome";
7-
import JoinUs from "./pages/JoinUs/JoinUs";
86
import NavBar from "./components/NavBar";
9-
import About from "./pages/About/About";
107
import Footer from "./components/Footer";
11-
import Blog from "./pages/Blogs/Blog";
128
import Team from "./pages/Team/Team";
139
import COC from "./pages/COC/COC";
1410

1511
function App() {
1612
return (
17-
<>
18-
<div className="App" style={{ width: "100%" }}>
19-
<Router>
20-
<NavBar />
21-
<Switch>
22-
<Route path="/team">
23-
<Team />
24-
</Route>
25-
<Route path="/joinus">
26-
<JoinUs />
27-
</Route>
28-
<Route path="/codeofconduct">
29-
<COC />
30-
</Route>
31-
<Route exact path="/">
32-
<NewHome />
33-
</Route>
34-
</Switch>
35-
<Footer />
36-
</Router>
37-
</div>
38-
</>
13+
<div className="App" style={{ width: "100%" }}>
14+
<Router>
15+
<NavBar />
16+
<Route
17+
render={({ location }) => {
18+
return (
19+
<TransitionGroup>
20+
<CSSTransition
21+
timeout={450}
22+
classNames="fade"
23+
key={location.pathname}
24+
>
25+
<Switch location={location}>
26+
<Route path="/team">
27+
<Team />
28+
</Route>
29+
<Route path="/codeofconduct">
30+
<COC />
31+
</Route>
32+
<Route exact path="/">
33+
<NewHome />
34+
</Route>
35+
</Switch>
36+
</CSSTransition>
37+
</TransitionGroup>
38+
);
39+
}}
40+
/>
41+
<Footer />
42+
</Router>
43+
</div>
3944
);
4045
}
4146

src/components/Activities/ActivityCard.css

+6-6
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,11 @@
99
transition: box-shadow 1s ease;
1010
}
1111

12+
.activity-card.activity:hover .activity-card-img-top.activity {
13+
transform: scale(1.2);
14+
overflow: hidden;
15+
}
16+
1217
.activity-card.activity.activity-card-body {
1318
padding: 1rem 0;
1419
}
@@ -48,11 +53,6 @@
4853
object-fit: scale-down;
4954
}
5055

51-
.activity-card-img-top.activity:hover {
52-
transform: scale(1.2);
53-
overflow: hidden;
54-
}
55-
5656
.activity-card-description {
5757
text-align: left;
5858
}
@@ -71,4 +71,4 @@
7171
margin-bottom: 1rem;
7272
height: max-content !important;
7373
font-weight: bold;
74-
}
74+
}

0 commit comments

Comments
 (0)