fix: improve mobile view

src/components/NavBar.astro

@@ -9,7 +9,7 @@ import ThemeToggle from './ThemeToggle';
   <section class="px-4 py-2">
     <nav class="flex items-center justify-between">
       <a class="text-lg font-bold font-heading" href="/lp2/">
-        <span class="md:hidden">lp2</span>
+        <span class="sm:hidden">Ling. Programação 2</span>
         <span class="max-sm:hidden">Linguagem de Programação 2</span>
       </a>
 

src/components/Sidebar.astro

@@ -4,7 +4,7 @@ import { MENU } from '../consts';
 
 <aside
   id="default-sidebar"
-  class="fixed z-50 left-0 top-11 md:h-screen w-full md:w-40 xl:w-64 self-start shadow-md bg-gray-100 dark:bg-slate-800 hidden dark:border-r-white/30 dark:border-r lg:block"
+  class="fixed z-50 left-0 top-11 md:h-screen w-full md:w-64 self-start shadow-md bg-gray-100 dark:bg-slate-800 hidden dark:border-r-white/30 dark:border-r lg:block"
   aria-label="Sidebar"
 >
   <div class="md:h-screen px-3 py-4 overflow-y-auto">

src/components/TableOfContent.astro

@@ -11,7 +11,7 @@ const { headings } = Astro.props;
 ---
 
 <nav
-  class="toc fixed top-11 right-0 h-[calc(100vh-2.75rem)] py-8 lg:w-56 xl:w-64 self-start hidden lg:block overflow-y-scroll"
+  class="toc fixed top-11 right-0 h-[calc(100vh-2.75rem)] py-8 lg:w-56 xl:w-64 self-start hidden xl:block overflow-y-scroll"
 >
   <ul class="flex flex-col gap-2">
     {

src/layouts/MarkDownLayout.astro

@@ -60,7 +60,7 @@ const githubEditUrl = `${GITHUB_EDIT_URL}/src${file.split('/src').pop()}`;
       <Sidebar />
 
       <article
-        class="mx-auto py-8 max-sm:px-4 max-sm:w-full prose 2xl:prose-xl dark:prose-invert overflow-hidden"
+        class="mx-auto lg:max-xl:ml-64 py-8 max-xl:px-4 max-xl:max-w-none max-md:w-full prose 2xl:prose-xl dark:prose-invert overflow-hidden"
       >
         <slot />