style(ui): Hide scrollbar and adjust background overflow

Author: oopserian

src/index.css

@@ -10,6 +10,14 @@
   body {
     @apply text-zinc-100 bg-zinc-950 w-screen h-screen;
   }
+
+  ::-webkit-scrollbar {
+    width: 0px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: transparent;
+  }
 }
 
 

src/layouts/default.tsx

@@ -19,7 +19,7 @@ const Layout: React.FC = () => {
 
 const Bg = () => {
     return (
-        <div className="fixed w-[60vw] h-[60vw] left-1/4 -top-10 blur-2xl">
+        <div className="fixed w-[60vw] h-[60vw] left-1/4 -top-10 blur-2xl overflow-hidden">
             <p className="w-1/3 h-1/3 rounded-full bg-gradient-to-br from-sky-500 to-sky-400/2 opacity-40 blur-2xl animate-pulse"></p>
             <p style={{ transform: 'rotate3d(1,1,1,230deg)' }} className="absolute -top-1/3 -left-1/3 w-full h-full rounded-full border-[300px] border-sky-400 opacity-30"></p>
         </div>