1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

new main menu

This commit is contained in:
Matthias Kretschmann 2019-02-08 14:39:24 +01:00
parent f834e2e42e
commit 1f28021568
Signed by: m
GPG Key ID: 606EEEF3C479A91F
10 changed files with 185 additions and 36 deletions

91
package-lock.json generated
View File

@ -1016,6 +1016,11 @@
"integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==", "integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==",
"dev": true "dev": true
}, },
"@oceanprotocol/art": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/@oceanprotocol/art/-/art-2.2.0.tgz",
"integrity": "sha512-p2n505t2K0zD1ZvGPhI6EsSviEVLCB7BYowhf/ONmVaWED138PaG4Z9nY6YuHU383uOoIWT+Lq3dLkFzDzstXw=="
},
"@oceanprotocol/keeper-contracts": { "@oceanprotocol/keeper-contracts": {
"version": "0.5.3", "version": "0.5.3",
"resolved": "https://registry.npmjs.org/@oceanprotocol/keeper-contracts/-/keeper-contracts-0.5.3.tgz", "resolved": "https://registry.npmjs.org/@oceanprotocol/keeper-contracts/-/keeper-contracts-0.5.3.tgz",
@ -3574,7 +3579,8 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
@ -3595,12 +3601,14 @@
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -3615,17 +3623,20 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@ -3742,7 +3753,8 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@ -3754,6 +3766,7 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -3768,6 +3781,7 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@ -3775,12 +3789,14 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.3.5", "version": "2.3.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.2", "safe-buffer": "^5.1.2",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@ -3799,6 +3815,7 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -3879,7 +3896,8 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@ -3891,6 +3909,7 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -3976,7 +3995,8 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.2", "version": "5.1.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
@ -4012,6 +4032,7 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@ -4031,6 +4052,7 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@ -4074,12 +4096,14 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.3", "version": "3.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
} }
} }
}, },
@ -7585,7 +7609,8 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
@ -7606,12 +7631,14 @@
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -7626,17 +7653,20 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@ -7753,7 +7783,8 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@ -7765,6 +7796,7 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -7779,6 +7811,7 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@ -7786,12 +7819,14 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.2.4", "version": "2.2.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.1", "safe-buffer": "^5.1.1",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@ -7810,6 +7845,7 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -7890,7 +7926,8 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@ -7902,6 +7939,7 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -7987,7 +8025,8 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.1", "version": "5.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
@ -8023,6 +8062,7 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@ -8042,6 +8082,7 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@ -8085,12 +8126,14 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.2", "version": "3.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
} }
} }
}, },
@ -22232,7 +22275,7 @@
"lodash": "^4.17.11", "lodash": "^4.17.11",
"oboe": "2.1.4", "oboe": "2.1.4",
"url-parse": "1.4.4", "url-parse": "1.4.4",
"websocket": "git://github.com/frozeman/WebSocket-Node.git#6c72925e3f8aaaea8dc8450f97627e85263999f2", "websocket": "git://github.com/frozeman/WebSocket-Node.git#browserifyCompatible",
"xhr2-cookies": "1.1.0" "xhr2-cookies": "1.1.0"
}, },
"dependencies": { "dependencies": {
@ -22277,7 +22320,7 @@
"requires": { "requires": {
"underscore": "1.8.3", "underscore": "1.8.3",
"web3-core-helpers": "1.0.0-beta.37", "web3-core-helpers": "1.0.0-beta.37",
"websocket": "git://github.com/frozeman/WebSocket-Node.git#6c72925e3f8aaaea8dc8450f97627e85263999f2" "websocket": "git://github.com/frozeman/WebSocket-Node.git#browserifyCompatible"
} }
}, },
"web3-shh": { "web3-shh": {

View File

@ -15,6 +15,7 @@
"lint": "npm run lint:js && npm run lint:css" "lint": "npm run lint:js && npm run lint:css"
}, },
"dependencies": { "dependencies": {
"@oceanprotocol/art": "^2.2.0",
"@oceanprotocol/squid": "^0.2.8", "@oceanprotocol/squid": "^0.2.8",
"@types/react-helmet": "^5.0.8", "@types/react-helmet": "^5.0.8",
"classnames": "^2.2.6", "classnames": "^2.2.6",

View File

@ -1,5 +1,5 @@
import React from 'react' import React from 'react'
import Content from '../components/Content' import Content from '../components/atoms/Content'
import styles from './Footer.module.scss' import styles from './Footer.module.scss'
import meta from '../data/meta.json' import meta from '../data/meta.json'

View File

@ -1,2 +1,95 @@
@import '../styles/variables';
.header { .header {
// background: $brand-black
// url('@oceanprotocol/art/mantaray/mantaray-back.svg') no-repeat center -6rem;
// background-size: cover;
width: 100%;
padding: $spacer / 2 0;
}
.headerContent {
composes: wide from './atoms/Content.module.scss';
display: flex;
align-items: center;
}
.headerLogo {
display: flex;
align-items: center;
cursor: pointer;
&:hover,
&:focus,
&:active {
transform: none;
}
}
.headerLogoImage {
width: 4rem;
height: 4rem;
fill: #fff;
margin: 0;
}
.headerTitle {
font-size: $font-size-h3;
color: $brand-grey-light;
margin-left: $spacer / 2;
display: none;
@media (min-width: $break-point--medium) {
display: inline-block;
}
}
.headerMenu {
flex: 1;
justify-self: flex-end;
text-align: right;
white-space: nowrap;
overflow-y: hidden;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
margin-right: -($spacer / 2);
padding-right: $spacer;
@media (min-width: $break-point--medium) {
padding-right: 0;
margin-right: 0;
}
&::-webkit-scrollbar,
&::-moz-scrollbar {
display: none;
}
&::-webkit-scrollbar {
width: 3px;
height: 3px;
transition: opacity .2s ease-out;
}
}
.link {
display: inline-block;
margin: 0 $spacer / 2;
font-family: $font-family-button;
color: $brand-grey;
&:last-child {
margin-right: 0;
}
&:hover,
&:focus,
&:active {
color: $brand-pink;
}
}
.linkActive {
composes: link;
color: $brand-pink;
} }

View File

@ -1,21 +1,33 @@
import React from 'react' import React from 'react'
import { Link } from 'react-router-dom' import { NavLink } from 'react-router-dom'
import Content from '../components/Content' import { ReactComponent as Logo } from '@oceanprotocol/art/logo/logo.svg'
import styles from './Header.module.scss' import styles from './Header.module.scss'
import menu from '../data/menu.json' import menu from '../data/menu.json'
import meta from '../data/meta.json'
const Header = () => ( const Header = () => (
<header className={styles.header}> <header className={styles.header}>
<Content wide> <div className={styles.headerContent}>
<nav> <NavLink to={'/'} className={styles.headerLogo}>
<Logo className={styles.headerLogoImage} />
<h1 className={styles.headerTitle}>{meta.title}</h1>
</NavLink>
<nav className={styles.headerMenu}>
{menu.map(item => ( {menu.map(item => (
<Link key={item.title} to={item.link}> <NavLink
key={item.title}
to={item.link}
className={styles.link}
activeClassName={styles.linkActive}
exact
>
{item.title} {item.title}
</Link> </NavLink>
))} ))}
</nav> </nav>
</Content> </div>
</header> </header>
) )

View File

@ -1,4 +1,4 @@
@import '../styles/variables'; @import '../../styles/variables';
.content { .content {
padding: 0 $spacer / 2; padding: 0 $spacer / 2;

View File

@ -2,7 +2,6 @@
.form { .form {
width: 100%; width: 100%;
margin-top: 4rem;
fieldset { fieldset {
border: 0; border: 0;

View File

@ -1,7 +1,8 @@
@import '../../styles/variables'; @import '../../styles/variables';
.header { .header {
margin-bottom: $spacer; margin-top: $spacer;
margin-bottom: $spacer * 2;
h1 { h1 {
margin: 0; margin: 0;

View File

@ -1,6 +1,6 @@
import React from 'react' import React from 'react'
import Helmet from 'react-helmet' import Helmet from 'react-helmet'
import Content from '../Content' import Content from '../atoms/Content'
import styles from './Route.module.scss' import styles from './Route.module.scss'
import meta from '../../data/meta.json' import meta from '../../data/meta.json'