Remove scrolling in mobile view

RamakrushnaBiswal · Oct 13, 2024 · a23e211 · a23e211
1 parent 7905255
commit a23e211
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/frontend/src/components/Shared/BackToTopButton.jsx b/frontend/src/components/Shared/BackToTopButton.jsx
@@ -44,9 +44,8 @@ const BackToTopButton = () => {
       {shouldRender && (
         <button
           onClick={scrollToTop}
-          className={`z-50 fixed bottom-12 right-8 bg-green-700 hover:bg-green-600 text-white font-bold px-5 py-3 rounded-md shadow-lg hover:shadow-xl transition-all duration-300 transform hover:scale-110 ${
-            isVisible ? 'animate-fadeInBounce' : 'animate-fadeOutBounce'
-          }`}
+          className={`z-50 fixed bottom-12 max-sm:right-16 right-8 bg-green-700 hover:bg-green-600 text-white font-bold px-5 py-3 rounded-md shadow-lg hover:shadow-xl transition-all duration-300 transform hover:scale-110 ${isVisible ? 'animate-fadeInBounce' : 'animate-fadeOutBounce'
+            }`}
           style={{ boxShadow: '0 4px 8px rgba(0, 0, 0, 0.2)' }}
         >
           ↑

diff --git a/frontend/src/components/Shared/GoogleTranslate.jsx b/frontend/src/components/Shared/GoogleTranslate.jsx
@@ -47,7 +47,7 @@ const GoogleTranslate = () => {
     }, []);
 
     return (
-        <div id="google_element" className="pl-20 md:pl-0">
+        <div id="google_element" className="pl-20 max-sm:pl-0 md:pl-0">
             <style jsx>{`
                 .goog-te-combo {
                     @apply w-full bg-white border border-gray-300 rounded px-2 py-1 text-sm;

diff --git a/frontend/src/components/Shared/footer/Footer.jsx b/frontend/src/components/Shared/footer/Footer.jsx
@@ -4,15 +4,16 @@ import Content from './Content';
 const Footer = () => {
   return (
     <footer
-      className="relative h-[800px]"
+      className="relative h-[800px] max-sm:h-[600px]"
       style={{ clipPath: 'polygon(0% 0, 100% 0%, 100% 100%, 0 100%)' }}
     >
-      <div className="relative h-[calc(100vh+800px)] -top-[100vh]">
+      <div className="max-sm:absolute max-sm:inset-0 max-sm:top-0 max-sm:h-[600px] relative h-[calc(100vh+800px)] -top-[100vh] ">
         <div className="h-[600px] sticky top-[calc(100vh-600px)]">
           <Content />
         </div>
       </div>
     </footer>
+
   );
 };