]>
Commit | Line | Data |
---|---|---|
87b6d05e | 1 | import React from 'react'; |
2 | ||
3 | class Signout extends React.Component { | |
4 | render = () => { | |
5 | return <a href="/signout"><u>Logout</u></a>; | |
6 | } | |
7 | } | |
8 | ||
16e43cc7 | 9 | class MyAccount extends React.Component { |
10 | render = () => { | |
11 | return <a href="/account"><u>Account</u></a>; | |
12 | } | |
13 | } | |
14 | ||
87b6d05e | 15 | class Logo extends React.Component { |
16 | render() { | |
17 | return <div id="logo" className="w-100 h-100 align-self-center"> | |
18 | <h1><a href="/">CryptoPF</a></h1> | |
19 | </div>; | |
20 | } | |
21 | } | |
22 | ||
23 | class Footer extends React.Component { | |
24 | render = () => { | |
25 | var elements = this.props.elements; | |
26 | if (elements === undefined) { | |
27 | elements = []; | |
28 | } | |
29 | ||
30 | if (this.props.isLoggedIn === true) { | |
16e43cc7 | 31 | elements = elements.concat(<MyAccount />); |
87b6d05e | 32 | elements = elements.concat(<Signout />); |
33 | } | |
34 | ||
35 | if (elements.length > 0) { | |
36 | elements = [<hr key="hr"/>].concat(elements); | |
37 | } | |
38 | ||
39 | var rows = elements.map(function(element, i) { | |
40 | return <div className="row text-center" key={'footer-el-' + i}> | |
41 | <div className="col-12"> | |
42 | {element} | |
43 | </div> | |
44 | </div>; | |
45 | }); | |
46 | return <div id="footer" className="row"> | |
16e43cc7 | 47 | <div className="offset-4 col-4 d-md-none"> |
87b6d05e | 48 | {rows} |
49 | </div> | |
50 | </div>; | |
51 | } | |
52 | } | |
53 | ||
54 | class Header extends React.Component { | |
55 | render = () => { | |
56 | var elements = this.props.elements; | |
57 | if (elements === undefined) { | |
58 | elements = []; | |
59 | } | |
60 | ||
61 | if (this.props.isLoggedIn === true) { | |
16e43cc7 | 62 | elements = elements.concat(<MyAccount />); |
87b6d05e | 63 | elements = elements.concat(<Signout />); |
64 | } | |
65 | ||
66 | elements = elements.map(function(element, i) { | |
16e43cc7 | 67 | return <div className="text-center header-menu-section" key={'header-el-' + i}> |
87b6d05e | 68 | {element} |
69 | </div>; | |
70 | }); | |
71 | ||
72 | return <div id="header" className="row"> | |
73 | <div className="offset-3 col-6 offset-md-4 col-md-4"> | |
74 | <Logo /> | |
75 | </div> | |
16e43cc7 | 76 | <div className="col-3 col-md-4 align-self-center h-100 d-none d-md-flex justify-content-end"> |
87b6d05e | 77 | {elements} |
78 | </div> | |
79 | </div>; | |
80 | } | |
81 | } | |
82 | ||
83 | export { | |
84 | Header, | |
85 | Footer, | |
86 | }; |