Skip to content

Commit 4d484c9

Browse files
danielhumgondanielhumgon
committed
feat(footer): Updated footer with new information
1 parent 9362d99 commit 4d484c9

File tree

4 files changed

+162
-12
lines changed

4 files changed

+162
-12
lines changed

‎src/components/footer/footer.css‎

Lines changed: 61 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,63 @@
1-
#footer{
2-
width: 100%;
3-
max-height: 50px;
4-
min-height: 50px;
5-
background-color: var(--main-color);
6-
display: flex;
1+
#footer {
2+
width: 100%;
3+
/*max-height: 50px;*/
4+
/*min-height: 50px;*/
5+
background-color: var(--main-color);
6+
/*display: flex;
77
justify-content: center;
8-
align-items: center;
8+
align-items: center;*/
9+
padding: 1em;
910
}
10-
#footer a{
11-
color: white;
12-
font-weight: 400;
13-
}
11+
#footer a {
12+
color: white;
13+
font-size: 16px;
14+
text-decoration: underline white;
15+
}
16+
#footer ul {
17+
margin: 0px;
18+
list-style-type: lower-roman;
19+
display: grid;
20+
}
21+
#footer li {
22+
display: inline;
23+
margin-left: 1em;
24+
word-break: break-all;
25+
}
26+
#footer li b {
27+
margin-right: 1em;
28+
}
29+
.footer-section {
30+
text-align: start;
31+
color: white;
32+
margin-top: 15px;
33+
}
34+
.footer-section .section-tittle {
35+
color: white;
36+
font-weight: bold;
37+
font-size: 17px;
38+
margin-bottom: 6px;
39+
}
40+
/* .footer-section div{
41+
width: fit-content;
42+
float: right;
43+
} */
44+
45+
#footer ul li::before {
46+
content: "\2022";
47+
color: white;
48+
display: inline-block;
49+
margin-right: 10px;
50+
font-size: 25px;
51+
line-height: 15px;
52+
vertical-align: -6px;
53+
}
54+
#footer svg {
55+
margin-right: 5px;
56+
}
57+
ul #web span{
58+
margin-right: 3.5px;
59+
}
60+
ul #tor span{
61+
margin-right: 9px;
62+
}
63+

‎src/components/footer/index.js‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,105 @@
11
import React from "react"
22
import "./footer.css"
3+
import { Row, Col } from "adminlte-2-react"
4+
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
5+
import { faGithub } from "@fortawesome/free-brands-svg-icons"
6+
37
class Footer extends React.Component {
48
render() {
59
return (
610
<section id="footer">
11+
<Row className="footer-container">
12+
<Col md={5} className="footer-section">
13+
<Row>
14+
<Col md={12} className="mb-1">
15+
<p className="section-tittle">Produced By</p>
16+
17+
<a
18+
href="https://psfoundation.cash/"
19+
target="_blank"
20+
rel="noreferrer"
21+
>
22+
Permissionless Software Foundation
23+
</a>
24+
</Col>
25+
<Col md={12}>
26+
<p className="section-tittle">Source Code</p>
27+
<FontAwesomeIcon className="" size="md" icon={faGithub} />
28+
<a
29+
href="https://github.com/Permissionless-Software-Foundation/gatsby-ipfs-web-wallet"
30+
target="_blank"
31+
rel="noreferrer"
32+
>
33+
Github
34+
</a>
35+
</Col>
36+
</Row>
37+
</Col>
38+
<Col md={7} className="footer-section">
39+
<div className="pull-right">
40+
<span className="section-tittle">
41+
Ways to access this web-app
42+
</span>
43+
<ul>
44+
<li id="web">
45+
<span>
46+
<b>Web</b>
47+
</span>
48+
<b>|</b>
49+
<a href="https://wallet.fullstack.cash">
50+
wallet.fullstack.cash
51+
</a>
52+
</li>
53+
54+
<li id="tor">
55+
<span>
56+
<b>Tor</b>
57+
</span>
58+
<b>|</b>
59+
<a href="http://puh2fyj2ly5b4p5m.onion/">
60+
puh2fyj2ly5b4p5m.onion
61+
</a>
62+
</li>
63+
64+
<li id="ipfs">
65+
<span>
66+
<b>IPFS</b>
67+
</span>
68+
<b>|</b>
69+
<a href="https://ipfs.io/ipfs/QmTMpYt66SGSjckXTHF6bPip6h1V5fXT23tEUJgy7pyTkf/">
70+
QmTMpYt66SGSjckXTHF6bPip6h1V5fXT23tEUJgy7pyTkf
71+
</a>
72+
</li>
73+
</ul>
74+
</div>
75+
</Col>
76+
</Row>
77+
{/* <center>
778
<a href="https://psfoundation.cash/" target="_blank" rel="noreferrer">
879
Produced by the Permissionless Software Foundation
980
</a>
81+
82+
<br /><br />
83+
<p>Ways to access this web-app:</p>
84+
<ul>
85+
<li>
86+
Web: <a href="https://wallet.fullstack.cash">wallet.fullstack.cash</a>
87+
</li>
88+
89+
<li>
90+
Tor: <a href="http://puh2fyj2ly5b4p5m.onion/">puh2fyj2ly5b4p5m.onion</a>
91+
</li>
92+
93+
<li>
94+
IPFS: <a href="https://ipfs.io/ipfs/QmTMpYt66SGSjckXTHF6bPip6h1V5fXT23tEUJgy7pyTkf/">QmTMpYt66SGSjckXTHF6bPip6h1V5fXT23tEUJgy7pyTkf</a>
95+
</li>
96+
</ul>
97+
<br />
98+
99+
<a href="https://github.com/Permissionless-Software-Foundation/gatsby-ipfs-web-wallet" target="_blank" rel="noreferrer">
100+
Source Code
101+
</a>
102+
</center> */}
10103
</section>
11104
)
12105
}

‎src/components/layout.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -722,4 +722,11 @@ pre tt:after {
722722
font-size: 12px;
723723
font-weight: 800;
724724
margin-top: 8px;
725+
}
726+
@media screen and (max-width: 500px) {
727+
.version-status {
728+
width: 80%;
729+
left: calc(42% - 30%) ;
730+
731+
}
725732
}

‎src/components/layout.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ import PropTypes from "prop-types"
1010
//import { useStaticQuery, graphql } from "gatsby"
1111

1212
//import Header from "./header"
13-
import Footer from './footer'
1413
import "./app-colors.css"
1514
import "./layout.css"
15+
import Footer from './footer'
1616

1717
const Layout = ({ children }) => {
1818
/* const data = useStaticQuery(graphql`

0 commit comments

Comments
 (0)