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:
parent
f834e2e42e
commit
1f28021568
91
package-lock.json
generated
91
package-lock.json
generated
@ -1016,6 +1016,11 @@
|
||||
"integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==",
|
||||
"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": {
|
||||
"version": "0.5.3",
|
||||
"resolved": "https://registry.npmjs.org/@oceanprotocol/keeper-contracts/-/keeper-contracts-0.5.3.tgz",
|
||||
@ -3574,7 +3579,8 @@
|
||||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"aproba": {
|
||||
"version": "1.2.0",
|
||||
@ -3595,12 +3601,14 @@
|
||||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
@ -3615,17 +3623,20 @@
|
||||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
@ -3742,7 +3753,8 @@
|
||||
"inherits": {
|
||||
"version": "2.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
@ -3754,6 +3766,7 @@
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
@ -3768,6 +3781,7 @@
|
||||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
@ -3775,12 +3789,14 @@
|
||||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.3.5",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.2",
|
||||
"yallist": "^3.0.0"
|
||||
@ -3799,6 +3815,7 @@
|
||||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
@ -3879,7 +3896,8 @@
|
||||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
@ -3891,6 +3909,7 @@
|
||||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
@ -3976,7 +3995,8 @@
|
||||
"safe-buffer": {
|
||||
"version": "5.1.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
@ -4012,6 +4032,7 @@
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
@ -4031,6 +4052,7 @@
|
||||
"version": "3.0.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
}
|
||||
@ -4074,12 +4096,14 @@
|
||||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"yallist": {
|
||||
"version": "3.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -7585,7 +7609,8 @@
|
||||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"aproba": {
|
||||
"version": "1.2.0",
|
||||
@ -7606,12 +7631,14 @@
|
||||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
@ -7626,17 +7653,20 @@
|
||||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
@ -7753,7 +7783,8 @@
|
||||
"inherits": {
|
||||
"version": "2.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
@ -7765,6 +7796,7 @@
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
@ -7779,6 +7811,7 @@
|
||||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
@ -7786,12 +7819,14 @@
|
||||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.2.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.1",
|
||||
"yallist": "^3.0.0"
|
||||
@ -7810,6 +7845,7 @@
|
||||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
@ -7890,7 +7926,8 @@
|
||||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
@ -7902,6 +7939,7 @@
|
||||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
@ -7987,7 +8025,8 @@
|
||||
"safe-buffer": {
|
||||
"version": "5.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
@ -8023,6 +8062,7 @@
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
@ -8042,6 +8082,7 @@
|
||||
"version": "3.0.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
}
|
||||
@ -8085,12 +8126,14 @@
|
||||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"yallist": {
|
||||
"version": "3.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -22232,7 +22275,7 @@
|
||||
"lodash": "^4.17.11",
|
||||
"oboe": "2.1.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"
|
||||
},
|
||||
"dependencies": {
|
||||
@ -22277,7 +22320,7 @@
|
||||
"requires": {
|
||||
"underscore": "1.8.3",
|
||||
"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": {
|
||||
|
@ -15,6 +15,7 @@
|
||||
"lint": "npm run lint:js && npm run lint:css"
|
||||
},
|
||||
"dependencies": {
|
||||
"@oceanprotocol/art": "^2.2.0",
|
||||
"@oceanprotocol/squid": "^0.2.8",
|
||||
"@types/react-helmet": "^5.0.8",
|
||||
"classnames": "^2.2.6",
|
||||
|
@ -1,5 +1,5 @@
|
||||
import React from 'react'
|
||||
import Content from '../components/Content'
|
||||
import Content from '../components/atoms/Content'
|
||||
import styles from './Footer.module.scss'
|
||||
|
||||
import meta from '../data/meta.json'
|
||||
|
@ -1,2 +1,95 @@
|
||||
@import '../styles/variables';
|
||||
|
||||
.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;
|
||||
}
|
||||
|
@ -1,21 +1,33 @@
|
||||
import React from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import Content from '../components/Content'
|
||||
import { NavLink } from 'react-router-dom'
|
||||
import { ReactComponent as Logo } from '@oceanprotocol/art/logo/logo.svg'
|
||||
import styles from './Header.module.scss'
|
||||
|
||||
import menu from '../data/menu.json'
|
||||
import meta from '../data/meta.json'
|
||||
|
||||
const Header = () => (
|
||||
<header className={styles.header}>
|
||||
<Content wide>
|
||||
<nav>
|
||||
<div className={styles.headerContent}>
|
||||
<NavLink to={'/'} className={styles.headerLogo}>
|
||||
<Logo className={styles.headerLogoImage} />
|
||||
<h1 className={styles.headerTitle}>{meta.title}</h1>
|
||||
</NavLink>
|
||||
|
||||
<nav className={styles.headerMenu}>
|
||||
{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}
|
||||
</Link>
|
||||
</NavLink>
|
||||
))}
|
||||
</nav>
|
||||
</Content>
|
||||
</div>
|
||||
</header>
|
||||
)
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
@import '../styles/variables';
|
||||
@import '../../styles/variables';
|
||||
|
||||
.content {
|
||||
padding: 0 $spacer / 2;
|
@ -2,7 +2,6 @@
|
||||
|
||||
.form {
|
||||
width: 100%;
|
||||
margin-top: 4rem;
|
||||
|
||||
fieldset {
|
||||
border: 0;
|
||||
|
@ -1,7 +1,8 @@
|
||||
@import '../../styles/variables';
|
||||
|
||||
.header {
|
||||
margin-bottom: $spacer;
|
||||
margin-top: $spacer;
|
||||
margin-bottom: $spacer * 2;
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
|
@ -1,6 +1,6 @@
|
||||
import React from 'react'
|
||||
import Helmet from 'react-helmet'
|
||||
import Content from '../Content'
|
||||
import Content from '../atoms/Content'
|
||||
import styles from './Route.module.scss'
|
||||
import meta from '../../data/meta.json'
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user