Fixed footer nav links and also restored the scrollbar'

VaibhavArora314 · Aug 6, 2024 · f12d7da · f12d7da
1 parent c6b5f73
commit f12d7da
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 9 deletions.
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -31,6 +31,7 @@ import Blocked from "./pages/Blocked";
 import GoogleTranslate from "./components/GoogleTranslate";
 import ProgressScrollDown from "./components/ProgressScrollDown";
 import Preloader from "./components/PreLoader"; 
+import "./App.css"
 // import axios from "axios";
 // axios.defaults.baseURL = "http://localhost:3001/";
 

diff --git a/frontend/src/pages/Policy.tsx b/frontend/src/pages/Policy.tsx
@@ -25,11 +25,12 @@ function Policy() {
   return (
     <div className="-mt-4 w-full text-[#1A202C] bg-gradient-animated dark:text-gray-200 dark:bg-[#1A202C] py-16 px-4" style={{ fontFamily: 'Roboto, sans-serif' }}>
       <div className="max-w-7xl mx-auto space-y-12">
-        <div className="bg-white dark:bg-gray-800 p-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
+
+        <div id="privacy-policy" className="py-20 bg-white dark:bg-gray-800 px-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
           <div className="flex flex-col md:flex-row items-start space-y-4 md:space-y-0 md:space-x-8 mb-8">
             <img src={privacy} alt="Privacy" className="rounded-lg w-32 h-32" />
             <div>
-              <h1 id="privacy-policy" className="text-4xl font-bold mb-4 scroll-margin-top">Privacy Policy</h1>
+              <h1 className="text-4xl font-bold mb-4 scroll-margin-top">Privacy Policy</h1>
               <section className="leading-relaxed space-y-4">
                 <p>Your privacy is important to us. This privacy policy explains how we collect, use, and protect your personal information when you use our website.</p>
                 <div>
@@ -72,12 +73,11 @@ function Policy() {
             </div>
           </div>
         </div>
-
-        <div className="bg-white dark:bg-gray-800 p-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
+        <div id="terms-and-conditions" className="py-20 bg-white dark:bg-gray-800 px-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
           <div className="flex flex-col md:flex-row items-start space-y-4 md:space-y-0 md:space-x-8 mb-8">
             <img src={terms} alt="Terms" className="rounded-lg w-32 h-32" />
             <div>
-              <h1 id="terms-and-conditions" className="text-4xl font-bold mb-4 scroll-margin-top">Terms and Conditions</h1>
+              <h1 className="text-4xl font-bold mb-4 scroll-margin-top">Terms and Conditions</h1>
               <section className="leading-relaxed space-y-4">
                 <p>Please read these terms and conditions carefully before using our website.</p>
                 <div>
@@ -123,11 +123,11 @@ function Policy() {
           </div>
         </div>
 
-        <div className="bg-white dark:bg-gray-800 p-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
+        <div id="cookie-policy" className="py-20 bg-white dark:bg-gray-800 px-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
           <div className="flex flex-col md:flex-row items-start space-y-4 md:space-y-0 md:space-x-8 mb-8">
             <img src={cookie} alt="Cookie" className="rounded-lg w-32 h-32" />
             <div>
-              <h1 id="cookie-policy" className="text-4xl font-bold mb-4 scroll-margin-top">Cookie Policy</h1>
+              <h1 className="text-4xl font-bold mb-4 scroll-margin-top">Cookie Policy</h1>
               <section className="leading-relaxed space-y-4">
                 <p>This cookie policy explains how we use cookies and similar technologies on our website.</p>
                 <div>
@@ -165,11 +165,11 @@ function Policy() {
           </div>
         </div>
 
-        <div className="bg-white dark:bg-gray-800 p-8 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
+        <div id="licensing"  className="bg-white dark:bg-gray-800 px-8 py-20 rounded-lg shadow-md transition-transform duration-300 hover:shadow-lg transform hover:scale-105">
           <div className="flex flex-col md:flex-row items-start space-y-4 md:space-y-0 md:space-x-8 mb-8">
             <img src={terms} alt="MITLicense" className="rounded-lg w-32 h-32" />
             <div>
-              <h1 id="licensing" className="text-4xl font-bold mb-4 scroll-margin-top">Licensing</h1>
+              <h1 className="text-4xl font-bold mb-4 scroll-margin-top">Licensing</h1>
               <section className="leading-relaxed space-y-4">
               <h3 className="text-2xl font-semibold mt-4">MIT License</h3>
                 <p>Our project is distributed under the MIT License, a permissive free software license that allows you to reuse, modify, and distribute the software with minimal restrictions, ensuring flexibility and freedom in your development endeavors.</p>