diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 71f8cf4..c84c0a8 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -143,7 +143,19 @@ divy-03 - + + + + + shubsolos19 +
+ shubsolos19 +
+ diff --git a/community-website/components/ScrollProgressBar.tsx b/community-website/components/ScrollProgressBar.tsx new file mode 100644 index 0000000..33411ac --- /dev/null +++ b/community-website/components/ScrollProgressBar.tsx @@ -0,0 +1,35 @@ +import { useEffect, useState } from "react"; + +const ScrollProgressBar = () => { + const [progress, setProgress] = useState(0); + + useEffect(() => { + const updateProgress = () => { + const scrollTop = window.scrollY; + const docHeight = + document.documentElement.scrollHeight - window.innerHeight; + const percent = docHeight > 0 ? (scrollTop / docHeight) * 100 : 0; + setProgress(percent); + }; + + window.addEventListener("scroll", updateProgress); + return () => window.removeEventListener("scroll", updateProgress); + }, []); + + return ( +
+ ); +}; + +export default ScrollProgressBar; diff --git a/community-website/pages/_app.tsx b/community-website/pages/_app.tsx index 3f5c9d5..a20a2ef 100644 --- a/community-website/pages/_app.tsx +++ b/community-website/pages/_app.tsx @@ -1,8 +1,15 @@ +import ScrollProgressBar from "../components/ScrollProgressBar"; + import '../styles/globals.css' import type { AppProps } from 'next/app' function MyApp({ Component, pageProps }: AppProps) { - return + return ( + <> + + + +) } export default MyApp diff --git a/community-website/pages/contributors.tsx b/community-website/pages/contributors.tsx index da7e585..681d373 100644 --- a/community-website/pages/contributors.tsx +++ b/community-website/pages/contributors.tsx @@ -283,6 +283,27 @@ const Contributors: NextPage = () => { + + + + shubsolos19 +
+ + shubsolos19 + +
+ +