feat: Add a Jump to top button for Terms page

workspace/apps/starkgate/web/src/components/UI/JumbToTop/JumbToTop.jsx

@@ -0,0 +1,23 @@
+import React, { useEffect, useState } from 'react';
+import styles from './JumpToTop.module.scss';
+
+export const JumpToTop = () => {
+  const [visible, setVisible] = useState(false);
+
+  useEffect(() => {
+    const onScroll = () => setVisible(window.scrollY > 300);
+    window.addEventListener('scroll', onScroll);
+    return () => window.removeEventListener('scroll', onScroll);
+  }, []);
+
+  if (!visible) return null;
+
+  return (
+    <button
+      onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
+      className={styles.jumpToTop}
+    >
+      ↑ Top
+    </button>
+  );
+};

workspace/apps/starkgate/web/src/components/UI/JumbToTop/JumbToTop.module.scss

@@ -0,0 +1,15 @@
+@import '../../../index';
+
+.jumpToTop {
+  position: fixed;
+  bottom: 24px;
+  right: 24px;
+  background-color: $--color-granite-gray;
+  color: $--color-white;
+  padding: 8px 12px;
+  border: none;
+  border-radius: 4px;
+  z-index: 9999;
+  cursor: pointer;
+  transition: opacity 0.3s ease;
+}

workspace/apps/starkgate/web/src/components/UI/index.jsx

@@ -53,3 +53,4 @@ export * from './Link/Link';
 export * from './Image/Image';
 export * from './SideButton/SideButton';
 export * from './TermsDisclaimer/TermsDisclaimer';
+export * from './JumbToTop/JumbToTop';

workspace/apps/starkgate/web/src/routes/Terms/Terms.jsx

@@ -1,7 +1,8 @@
 import React, {useEffect} from 'react';
 
+
 import {useEnvs, useHeadTranslation, useTermsTracking, useTermsTranslation, useTitle} from '@hooks';
-import {FullScreenContainer} from '@ui';
+import {FullScreenContainer, JumbToTop} from '@ui';
 
 import styles from './Terms.module.scss';
 import TermsOfUse from './TermsOfUse';
@@ -22,6 +23,7 @@ export const Terms = () => {
       <div className={styles.terms}>
         <Header />
         <div className={styles.text}>{TermsOfUse}</div>
+        <JumpToTop />
       </div>
     </FullScreenContainer>
   );
@@ -36,4 +38,4 @@ const Header = () => {
       <div className={styles.title}>{titleTxt}</div>
     </div>
   );
-};
+};