feat: move nav to its own div

Author: Indyandie

src/components/PokeHeader.astro

@@ -25,8 +25,10 @@ import PokeNav from './PokeNav.astro'
     <Search {...Astro.props} />
   </div>
   <div class="sl-hidden md:sl-flex print:hidden right-group">
+    <div class="sl-flex poke-navigation">
+      <PokeNav />
+    </div>
     <div class="sl-flex social-icons">
-      <PokeNav/>
       <SocialIcons {...Astro.props} />
     </div>
     <ThemeSelect {...Astro.props} />
@@ -56,7 +58,9 @@ import PokeNav from './PokeNav.astro'
     gap: 1rem;
     align-items: center;
   }
-  .social-icons::after {
+
+  .social-icons::after,
+  .poke-navigation::after {
     content: '';
     height: 2rem;
     border-inline-end: 1px solid var(--sl-color-gray-5);
@@ -66,9 +70,11 @@ import PokeNav from './PokeNav.astro'
     :global(:root[data-has-sidebar]) {
       --__sidebar-pad: calc(2 * var(--sl-nav-pad-x));
     }
+
     :global(:root:not([data-has-toc])) {
       --__toc-width: 0rem;
     }
+
     .header {
       --__sidebar-width: max(0rem, var(--sl-content-inline-start, 0rem) - var(--sl-nav-pad-x));
       --__main-column-fr: calc(