Merge pull request #37 from UTDNebula/horizontal-overscroll-fix

Horizontal scroll overflow fix
UTDNebula · Feb 7, 2024 · a1f46bc · a1f46bc
2 parents 3368ec7 + 1cdcee8
commit a1f46bc
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 8 deletions.
diff --git a/src/components/CTA.tsx b/src/components/CTA.tsx
@@ -5,13 +5,13 @@ import Blob from '@/components/Blob';
 const CTA = () => {
   return (
     <div className="relative flex place-content-center my-24 overflow-y-visible overflow-x-clip">
-      <div className="absolute top-0 left-0 w-screen h-full overflow-visible">
+      <div className="absolute top-0 left-0 w-full h-full overflow-visible">
         <Blob className="-left-12 -top-[25%] -z-20" color="pink" size="medium" />
         <Blob className="left-[15%] top-[35%] -z-20" color="royal" size="medium" />
         <Image
           src={Circles}
           alt={''}
-          className="absolute -top-48 h-screen w-screen overflow-visible -z-10 object-cover"
+          className="absolute -top-48 h-screen w-full overflow-visible -z-10 object-cover"
         />
         <Blob className="left-[70%] -top-16 -z-20" color="periwinkle" size="medium" />
       </div>

diff --git a/src/components/Carousel.tsx b/src/components/Carousel.tsx
@@ -40,7 +40,7 @@ function Carousel<T extends any[]>(
 
   return (
     <div
-      className="flex overflow-x-scroll text-white scroll-smooth no-scrollbar w-screen"
+      className="flex overflow-x-scroll text-white scroll-smooth no-scrollbar w-full"
       style={{ scrollSnapType: 'x mandatory' }}
       ref={ref}
     >
@@ -50,7 +50,7 @@ function Carousel<T extends any[]>(
           <div
             id={key}
             key={key}
-            className="flex flex-shrink-0 w-screen px-8 snap-start lg:px-32 xl:px-48"
+            className="flex flex-shrink-0 w-full px-8 snap-start lg:px-32 xl:px-48"
           >
             {children(item, idx, data.length, prev(idx), next(idx))}
           </div>

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
@@ -235,7 +235,7 @@ const Navbar = () => {
                             <Disclosure.Panel
                               as="ul"
                               className={clsx(
-                                'lg:absolute lg:w-screen lg:bg-dark-gradient lg:backdrop-blur-md border border-x-0 border-opacity-25 lg:left-0 lg:top-20 lg:mt-6 lg:py-10 lg:px-20 justify-items-center lg:flex-wrap lg:flex lg:gap-10 contents',
+                                'lg:absolute lg:w-full lg:bg-dark-gradient lg:backdrop-blur-md border border-x-0 border-opacity-25 lg:left-0 lg:top-20 lg:mt-6 lg:py-10 lg:px-20 justify-items-center lg:flex-wrap lg:flex lg:gap-10 contents',
                               )}
                             >
                               {item.children.map((child, innerIndex) => (

diff --git a/src/components/Projects.tsx b/src/components/Projects.tsx
@@ -90,9 +90,9 @@ export default function Projects() {
   }, [carouselRef]);
   const carouselKeyBase = 'projects';
   return (
-    <div className="w-screen overflow-x-clip">
-      <div className="bg-stars bg-cover rounded-full flex items-center justify-center w-screen aspect-square lg:scale-[115%] scale-[200%] lg:my-52 my-[34rem] shadow-[0px_0px_87px_-1px_#312E81]">
-        <div className="shrink-0 flex flex-col justify-center lg:scale-[calc(1/1.15)] scale-[calc(1/2)] h-min w-screen">
+    <div className="w-full overflow-x-clip">
+      <div className="bg-stars bg-cover rounded-full flex items-center justify-center w-full aspect-square lg:scale-[115%] scale-[200%] lg:my-52 my-[34rem] shadow-[0px_0px_87px_-1px_#312E81]">
+        <div className="shrink-0 flex flex-col justify-center lg:scale-[calc(1/1.15)] scale-[calc(1/2)] h-min w-full">
           <div className="text-center flex flex-col items-center">
             <h3 className="text-2xl md:text-4xl text-white">Check Out Our </h3>
             <h1 className="font-kallisto md:text-7xl text-4xl font-bold text-transparent w-min bg-clip-text bg-gradient-to-r from-[#6166FA] via-[#C2C9FF] to-[#FE8164]">