status-im/ETHReport
2
0
Fork 0
mirror of https://github.com/status-im/ETHReport.git synced 2025-02-27 05:00:32 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #11 from Nona-Creative/feat/adding-header-navigation-scrollto

Browse Source 
Adding page header nav and scroll to
This commit is contained in:
sharynt 2018-07-10 15:10:16 +02:00 committed by GitHub
commit df11fc2f0a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 34 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/browseArchives/index.js
View File

@ -118,7 +118,7 @@ class BrowseArchives extends React.Component {
} = this.state; } = this.state;
return ( return (
<div className="browse-wrap"> <div className="browse-wrap" id="browse">
<SearchBar <SearchBar
onSearchInputChange={this.onSearchInputChange} onSearchInputChange={this.onSearchInputChange}
clearSearchInput={this.clearSearchInput} clearSearchInput={this.clearSearchInput}

10
components/pageHeader/index.js
View File

@ -1,7 +1,8 @@
import React from 'react'; import React from 'react';
import AnchorLink from 'react-anchor-link-smooth-scroll';
import './style.scss'; import './style.scss';
export default () => ( const PageHeader = () => (
<div className="page-header"> <div className="page-header">
<div className="container"> <div className="container">
<h1>Ethereum Report</h1> <h1>Ethereum Report</h1>
@ -9,6 +10,13 @@ export default () => (
We&rsquo;ve interviewed 100+ developers to showcase the biggest opportunities in the We&rsquo;ve interviewed 100+ developers to showcase the biggest opportunities in the
Ethereum ecosystem Ethereum ecosystem
</p> </p>
<nav className="page-header-nav">
<AnchorLink offset="24" href="#resources">Resources</AnchorLink>
<AnchorLink offset="24" href="#browse">Browse Archives</AnchorLink>
</nav>
</div> </div>
</div> </div>
); );
export default PageHeader;

17
components/pageHeader/style.scss
View File

@ -11,4 +11,21 @@
font-family: $secondary-font; font-family: $secondary-font;
font-size: calculateRem(36); font-size: calculateRem(36);
} }
p {
margin-bottom: calculateRem(24);
}
}
.page-header-nav {
a {
color: $text-color;
text-decoration: none;
margin: 0 calculateRem(16);
&:hover {
text-decoration: underline;
}
}
} }

2
components/resources/index.js
View File

@ -53,7 +53,7 @@ class Resources extends React.Component {
}; };
return ( return (
<div className="resources-wrap"> <div className="resources-wrap" id="resources">
<div className="container"> <div className="container">
<h2>Resources</h2> <h2>Resources</h2>
<div className="wordclouds-wrap"> <div className="wordclouds-wrap">

5
package-lock.json generated
View File

@ -7380,6 +7380,11 @@
"prop-types": "15.6.2" "prop-types": "15.6.2"
} }
}, },
"react-anchor-link-smooth-scroll": {
"version": "1.0.10",
"resolved": "https://registry.npmjs.org/react-anchor-link-smooth-scroll/-/react-anchor-link-smooth-scroll-1.0.10.tgz",
"integrity": "sha512-CTzSJC/0Tf+EhVAswJeRwazcIGBnnnPEWiPM1uNXLaW+5MKe8v48Lm8auIahlmIeTJCYTAIfXSfZBu3S1Dlbbg=="
},
"react-dom": { "react-dom": {
"version": "16.4.1", "version": "16.4.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.4.1.tgz", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.4.1.tgz",

1
package.json
View File

@ -43,6 +43,7 @@
"node-sass": "^4.9.0", "node-sass": "^4.9.0",
"prop-types": "^15.6.1", "prop-types": "^15.6.1",
"react": "^16.3.2", "react": "^16.3.2",
"react-anchor-link-smooth-scroll": "^1.0.10",
"react-dom": "^16.3.2", "react-dom": "^16.3.2",
"react-slick": "^0.23.1" "react-slick": "^0.23.1"
}, },