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

Commit 50e0c14

Browse files
authored
Merge pull request #50 from coderplex/learn
learn page v1
2 parents d3143c5 + 49c5bad commit 50e0c14

File tree

2 files changed

+145
-21
lines changed

2 files changed

+145
-21
lines changed

pages/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@ const indexPageLearns = [
1616
image: '',
1717
},
1818
{
19-
link: '#',
19+
link:
20+
'https://github.com/coderplex/learn/blob/master/web-dev/Backend/Learn-Laravel.md',
2021
title: 'Laravel',
2122
subject: 'Backend Web Development',
2223
image: '',

pages/learn.js

Lines changed: 143 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,147 @@
11
import React from 'react';
2+
import { Accordion, Icon, List } from 'semantic-ui-react';
23

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

6-
export default publicPage(() => (
7-
<div>
8-
<main>
9-
<Icon />
10-
<h3>Under Construction, Coming Soon!...</h3>
11-
</main>
12-
<style jsx>{`
13-
main {
14-
min-height: calc(100vh - 70px);
15-
background: #f4f7fb;
16-
color: #314159;
17-
display: flex;
18-
justify-content: center;
19-
align-items: center;
20-
flex-direction: column;
21-
}
22-
`}</style>
23-
</div>
24-
));
7+
export default publicPage(() => {
8+
return (
9+
<div className="root">
10+
<TopBanner
11+
pageTitle="Learn"
12+
pageSubTitle="Open Source Learning Guides to master your favorite technology"
13+
/>
14+
<main>
15+
<section>
16+
<Accordion fluid styled>
17+
<Accordion.Title>
18+
<Icon name="dropdown" />
19+
Web Development
20+
</Accordion.Title>
21+
<Accordion.Content>
22+
<Accordion>
23+
<Accordion.Title>
24+
<Icon name="dropdown" />
25+
Frontend
26+
</Accordion.Title>
27+
<Accordion.Content>
28+
<List selection verticalAlign="middle">
29+
<List.Item
30+
target="_blank"
31+
href="https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-Angular.md"
32+
>
33+
<List.Content>
34+
<List.Header>Angular</List.Header>
35+
<List.Description>
36+
Front-end web application framework by Google
37+
</List.Description>
38+
</List.Content>
39+
</List.Item>
40+
<List.Item
41+
target="_blank"
42+
href="https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-React.md"
43+
>
44+
<List.Content>
45+
<List.Header>React</List.Header>
46+
<List.Description>
47+
JavaScript library for building user interfaces from
48+
Facebook
49+
</List.Description>
50+
</List.Content>
51+
</List.Item>
52+
<List.Item
53+
target="_blank"
54+
href="https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-VueJS.md"
55+
>
56+
<List.Content>
57+
<List.Header>Vue</List.Header>
58+
<List.Description>
59+
Progressive JavaScript framework for building user
60+
interfaces by community
61+
</List.Description>
62+
</List.Content>
63+
</List.Item>
64+
</List>
65+
</Accordion.Content>
66+
<Accordion.Title>
67+
<Icon name="dropdown" />
68+
Backend
69+
</Accordion.Title>
70+
<Accordion.Content>
71+
<List selection verticalAlign="middle">
72+
<List.Item
73+
target="_blank"
74+
href="https://github.com/coderplex/learn/blob/master/web-dev/Backend/Learn-Laravel.md"
75+
>
76+
<List.Content>
77+
<List.Header>Laravel</List.Header>
78+
<List.Description>PHP web framework</List.Description>
79+
</List.Content>
80+
</List.Item>
81+
</List>
82+
</Accordion.Content>
83+
</Accordion>
84+
</Accordion.Content>
85+
<Accordion.Title>
86+
<Icon name="dropdown" />
87+
Data Science
88+
</Accordion.Title>
89+
<Accordion.Content>
90+
<List selection verticalAlign="middle">
91+
<List.Item
92+
target="_blank"
93+
href="https://github.com/coderplex/learn/blob/master/data-science/learn-ds.md"
94+
>
95+
<List.Content>
96+
<List.Header>Core Data Science</List.Header>
97+
<List.Description>
98+
A field which provides meaningful information from large
99+
amounts of data.
100+
</List.Description>
101+
</List.Content>
102+
</List.Item>
103+
</List>
104+
</Accordion.Content>
105+
<Accordion.Title>
106+
<Icon name="dropdown" />
107+
Distributed Computing
108+
</Accordion.Title>
109+
<Accordion.Content>
110+
<List selection verticalAlign="middle">
111+
<List.Item
112+
target="_blank"
113+
href="https://github.com/coderplex/learn/blob/master/Blockchain/learn-blockchain.md"
114+
>
115+
<List.Content>
116+
<List.Header>Blockchain</List.Header>
117+
<List.Description>
118+
A distributed database technology
119+
</List.Description>
120+
</List.Content>
121+
</List.Item>
122+
</List>
123+
</Accordion.Content>
124+
</Accordion>
125+
</section>
126+
</main>
127+
<style jsx>{`
128+
.root {
129+
background-color: #ffffff;
130+
}
131+
main {
132+
background-color: #ffffff;
133+
max-width: 800px;
134+
padding-top: 30px;
135+
padding-bottom: 30px;
136+
padding-left: 30px;
137+
padding-right: 30px;
138+
min-height: calc(100vh - 70px);
139+
margin: 0 auto;
140+
}
141+
section {
142+
margin: 50px 0;
143+
}
144+
`}</style>
145+
</div>
146+
);
147+
});

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