just show it

src/app.tsx

@@ -190,7 +190,7 @@ function AppLayout(props: { children: any }) {
       <div class="flex max-w-screen flex-row">
         <LeftBar />
         <div
-          class="bg-base relative h-screen overflow-x-hidden overflow-y-scroll rounded-t-lg pt-16 shadow-2xl"
+          class="bg-base relative h-screen overflow-x-hidden overflow-y-scroll py-16"
           style={{
             width: `${centerWidth()}px`,
             "margin-left": `${leftBarSize()}px`

src/context/bars.tsx

@@ -27,8 +27,7 @@ const BarsContext = createContext<{
   setRightBarSize: () => {},
   centerWidth: () => 0,
   setCenterWidth: () => {},
-  leftBarVisible: () =>
+  leftBarVisible: () => true,
-    typeof window !== "undefined" ? window.innerWidth >= 768 : true,
   setLeftBarVisible: () => {},
   rightBarVisible: () => true,
   setRightBarVisible: () => {},
@@ -59,16 +58,7 @@ export function BarsProvider(props: { children: any }) {
   onMount(() => {
     // Immediately sync to actual window width
     setWindowWidth(window.innerWidth);
-    const initialIsMobile = isMobile(window.innerWidth);
-    setLeftBarVisible(!initialIsMobile);
 
-    // Initialize immediately on mobile if left bar starts hidden
-    if (initialIsMobile && !leftBarVisible()) {
-      leftBarSized = true;
-      checkAndSync();
-    }
-
-    // Setup resize listener
     const handleResize = () => {
       setWindowWidth(window.innerWidth);
     };

src/routes/index.tsx

@@ -148,7 +148,7 @@ export default function Home() {
               </div>
             </div>
           </div>
-          <Typewriter speed={120} class="max-w-3/4 pt-8 md:max-w-1/2">
+          <Typewriter speed={120} class="mx-auto max-w-3/4 pt-8 md:max-w-1/2">
             And if you love the color schemes of this site
             <div class="mx-auto w-fit">
               <DarkModeToggle />