implement scrolling to modal
This commit is contained in:
parent
6796d64585
commit
2a3a07e7ca
|
@ -2,6 +2,15 @@ import GradientText from './GradientText'
|
|||
import Button from './Button'
|
||||
import Link from './Link'
|
||||
|
||||
function scrollToId(id: string) {
|
||||
const element = document.getElementById(id)
|
||||
const y = element.getBoundingClientRect().top + window.scrollY
|
||||
window.scroll({
|
||||
top: y,
|
||||
behavior: 'smooth',
|
||||
})
|
||||
}
|
||||
|
||||
const HeroSection = () => {
|
||||
return (
|
||||
<section className="">
|
||||
|
@ -17,7 +26,7 @@ const HeroSection = () => {
|
|||
</p>
|
||||
</div>
|
||||
<div className="mb-16 flex lg:flex-row md:flex-row lg:justify-center md:justify-center sm:justify-center">
|
||||
<a className="sm:px-1" rel="noreferrer" target="_blank" href="#">
|
||||
<a className="sm:px-1" onClick={() => scrollToId('contribute')}>
|
||||
<Button>Contribute now</Button>
|
||||
</a>
|
||||
<a className="pl-2 " rel="noreferrer" target="_blank" href="#">
|
||||
|
|
|
@ -4,7 +4,7 @@ import StatsModal from './StatsModal'
|
|||
const ModalSection = () => {
|
||||
return (
|
||||
<>
|
||||
<div className="pt-32 pb-48 px-4">
|
||||
<div id="contribute" className="pt-32 pb-48 px-4">
|
||||
<div className="max-w-5xl mx-auto text-center mb-12">
|
||||
<h2 className="mb-4 text-3xl md:text-4xl lg:text-4xl text-white font-bold font-heading">
|
||||
Ready to contribute?
|
||||
|
|
Loading…
Reference in New Issue