-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathabout.js
More file actions
71 lines (64 loc) · 3.58 KB
/
about.js
File metadata and controls
71 lines (64 loc) · 3.58 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
import React from "react"
import Layout from "../components/layout"
import SEO from "../components/seo"
import { FaCheckCircle } from "react-icons/fa"
import "./index.css"
import Sidebar from "../components/sidebar/Sidebar"
import TechTag from "../components/tags/TechTag"
const AboutPage = (props) => {
return (
<Layout>
<SEO title="About" />
<div className="post-page-main">
<div className="sidebar px-4 py-2">
<Sidebar />
</div>
<div className="post-main">
<SEO title="About" />
<div className="mt-3">
<h2 className="heading">About</h2>
<p><i>Developer Diary is a Gatsby Starter blog template created with web developers in mind, but really, anyone can use it. It's totally usable right out of the box, but minimalist enough to be easily modifiable to suit your needs.</i></p>
<br />
<h4>Features</h4>
<div>
<span className="text-success d-inline-block" title="blazing">
<FaCheckCircle size={26} style={{ color: "success" }} />
</span>
<p className="d-inline-block ml-3 w-75 align-top">Blazing fast, as you'd expect from a Gatsby site</p>
</div>
<div>
<span className="text-success d-inline-block" title="tags">
<FaCheckCircle size={26} style={{ color: "success" }} />
</span>
<p className="d-inline-block ml-3 w-75 align-top">Tech tags designed for web developers</p>
<div className="ml-5">
<TechTag tag="nodejs" tech="Node.js" name="DiNodejsSmall" size={20} color="lightgreen" />
<TechTag tag="html" tech="HTML" name="FaHtml5" size={20} color="darkorange" />
<TechTag tag="css" tech="CSS" name="DiCss3Full" size={20} color="teal" />
</div>
</div>
<div className="mt-4">
<span className="text-success d-inline-block" title="prism">
<FaCheckCircle size={26} style={{ color: "success" }} />
</span>
<p className="d-inline-block ml-3 w-75 align-top">Includes Prism for code block styling in markdown files</p>
</div>
<div>
<span className="text-success d-inline-block" title="icons">
<FaCheckCircle size={26} style={{ color: "success" }} />
</span>
<p className="d-inline-block ml-3 w-75 align-top">Developer-relevant social-media icon links including GitHub, Stack Overflow and freeCodeCamp</p>
</div>
<div>
<span className="text-success d-inline-block" title="mobile">
<FaCheckCircle size={26} style={{ color: "success" }} />
</span>
<p className="d-inline-block ml-3 w-75 align-top">Mobile responsive, of course</p>
</div>
</div>
</div>
</div>
</Layout>
)
}
export default AboutPage