diff --git a/src/components/projects/ProjectsHeader.jsx b/src/components/projects/ProjectsHeader.jsx
index ccf917a..ed0a1b0 100644
--- a/src/components/projects/ProjectsHeader.jsx
+++ b/src/components/projects/ProjectsHeader.jsx
@@ -1,4 +1,5 @@
-import React, { Fragment } from 'react'
+import React, { Fragment, useRef } from 'react'
+import { Link } from 'react-router-dom'
import Typography from '@material-ui/core/Typography'
import { makeStyles } from '@material-ui/core/styles'
import Card from '@material-ui/core/Card'
@@ -9,6 +10,12 @@ import StatusButton from '../base/Button'
import Icon from '../base/icons/IconByName'
import AssembleFlow from '../image/AssembleFlow'
+const scrollToRef = (ref) => window.scroll({
+ top: ref.current.offsetTop,
+ left: 0,
+ behavior: 'smooth'
+})
+
const useStyles = makeStyles(({
breakpoints: {
up
@@ -78,8 +85,10 @@ const useStyles = makeStyles(({
fontSize: '20px',
fontWeight: 'bold',
marginTop: '3rem'
+ },
+ link: {
+ textDecoration: 'none'
}
-
}))
function CreatorsCard() {
@@ -103,16 +112,19 @@ function CreatorsCard() {
-
+
+
+
);
}
-function FundersCard() {
+function FundersCard({ listedRef }) {
const classes = useStyles();
+ const executeScroll = () => scrollToRef(listedRef)
return (
@@ -134,6 +146,7 @@ function FundersCard() {
@@ -142,17 +155,18 @@ function FundersCard() {
function ProjectsHeader() {
const classes = useStyles()
+ const listedRef = useRef(null)
return (
Open and Transparent Funding
Assemble helps you to bring your web3 projects to life
-
+
- Listed Projects
+ Listed Projects
)
}