fix: fix links and mobile nav (#12)

Author: aspectrr

app/(home)/integrations/_pages/page.en.tsx

@@ -1,4 +1,4 @@
-import { Cards, IndexCard } from '@/components/card';
+import { Cards, IndexCard } from "@/components/card";
 import {
   API,
   BrowserUseIcon,
@@ -7,7 +7,7 @@ import {
   Container,
   MagicIcon,
   OpenAIIcon,
-} from '@/components/ui/icon';
+} from "@/components/ui/icon";
 
 export default function IntegrationsPage() {
   return (
@@ -21,14 +21,14 @@ export default function IntegrationsPage() {
           <Cards>
             <IndexCard
               icon={<BrowserUseIcon />}
-              href="/integrations/browser-use/overview"
+              href="/integrations/browser-use/integrations-overview"
               title="Browser-Use Integration"
               tag="Browser Agent"
               description="Use Browser-Use to interact with a Steel browser."
             />
             <IndexCard
               icon={<ClaudeIcon />}
-              href="/integrations/claude-computer-use/overview"
+              href="/integrations/claude-computer-use/integrations-overview"
               title="Claude Computer Use"
               tag="Browser Agent"
               description="Use Claude Computer Use with Steel Browser."
@@ -42,7 +42,7 @@ export default function IntegrationsPage() {
             />
             <IndexCard
               icon={<Cloud />}
-              href="/integrations/crewai/overview"
+              href="/integrations/crewai/integrations-overview"
               title="CrewAI"
               tag="Multi-Agent"
               description="Learn how to use CrewAI with Steel Browser."

app/(home)/overview/_pages/page.en.tsx

@@ -44,7 +44,10 @@ export default function HomePage() {
               />
               <div className="flex flex-col [&_p]:mb-6 space-y-3">
                 <h3 className="text-3xl">Steel Documentation</h3>
-                <p>Find all the guides and resources you need to build on the Steel API.</p>
+                <p>
+                  Find all the guides and resources you need to build on the
+                  Steel API.
+                </p>
               </div>
             </div>
           </div>
@@ -56,7 +59,7 @@ export default function HomePage() {
                 variant="default"
                 title="Sessions API"
                 description="Explore API endpoints for managing Steel Sessions."
-                tags={['API', 'Sessions']}
+                tags={["API", "Sessions"]}
               />
             </Cards>
             <Cards className="xl:!grid-cols-4">
@@ -66,49 +69,55 @@ export default function HomePage() {
                 variant="default"
                 title="Captchas API"
                 description="Explore API endpoints for managing Steel Captchas."
-                tags={['API', 'Captchas']}
+                tags={["API", "Captchas"]}
               />
               <Card
                 className="group space-y-1"
                 href="/overview/extensions-api/overview"
                 variant="default"
                 title="Extensions API"
                 description="Explore API endpoints for building on Steel."
-                tags={['API', 'Extensions']}
+                tags={["API", "Extensions"]}
               />
               <Card
                 className="group space-y-1"
                 href="/overview/credentials-api/overview"
                 title="Credentials API"
                 description="Explore API endpoints for managing Steel Credentials."
-                tags={['API', 'Credentials']}
+                tags={["API", "Credentials"]}
               />
               <Card
                 className="group space-y-1"
                 href="/overview/files-api/overview"
                 title="Files API"
                 description="Explore API Endpoints for managing Files on Steel."
-                tags={['API', 'Files']}
+                tags={["API", "Files"]}
               />
             </Cards>
           </div>
           <div className="flex flex-col">
-            <h4 id="explore-by-category" className="text-muted-foreground scroll-m-20">
-              <a href="#explore-by-category" className="not-prose group text-sm uppercase">
+            <h4
+              id="explore-by-category"
+              className="text-muted-foreground scroll-m-20"
+            >
+              <a
+                href="#explore-by-category"
+                className="not-prose group text-sm uppercase"
+              >
                 Integrations
               </a>
             </h4>
             <hr className="border-t border-border my-2" />
             <Cards className="xl:!grid-cols-3">
               <SmallCard
                 icon={<BrowserUseIcon />}
-                href="/integrations/browser-use/overview"
+                href="/integrations/browser-use/integrations-overview"
                 title="Browser-Use Integration"
                 description="Use Browser-Use to interact with a Steel browser."
               />
               <SmallCard
                 icon={<ClaudeIcon />}
-                href="/integrations/claude-computer-use/overview"
+                href="/integrations/claude-computer-use/integrations-overview"
                 title="Claude Computer Use"
                 description="Use Claude Computer Use with Steel Browser."
               />
@@ -120,7 +129,7 @@ export default function HomePage() {
               />
               <SmallCard
                 icon={<Cloud />}
-                href="/integrations/crewai/overview"
+                href="/integrations/crewai/integrations-overview"
                 title="CrewAI"
                 description="Learn how to use CrewAI with Steel Browser."
               />
@@ -139,8 +148,14 @@ export default function HomePage() {
             </Cards>
           </div>
           <div className="flex flex-col">
-            <h4 id="explore-by-category" className="text-muted-foreground scroll-m-20">
-              <a href="#explore-by-category" className="not-prose group text-sm uppercase">
+            <h4
+              id="explore-by-category"
+              className="text-muted-foreground scroll-m-20"
+            >
+              <a
+                href="#explore-by-category"
+                className="not-prose group text-sm uppercase"
+              >
                 Libraries &amp; SDKs
               </a>
             </h4>
@@ -161,8 +176,14 @@ export default function HomePage() {
             </Cards>
           </div>
           <div className="flex flex-col">
-            <h4 id="explore-by-category" className="text-muted-foreground scroll-m-20">
-              <a href="#explore-by-category" className="not-prose group text-sm uppercase">
+            <h4
+              id="explore-by-category"
+              className="text-muted-foreground scroll-m-20"
+            >
+              <a
+                href="#explore-by-category"
+                className="not-prose group text-sm uppercase"
+              >
                 Resources
               </a>
             </h4>

components/layout/mobile-navigation.tsx

@@ -106,7 +106,7 @@ export function MobileNavigation({
           <SearchToggle />
         </div>
 
-        <nav className="overflow-y-auto h-[calc(100vh-64px)] bg-background px-3">
+        <nav className="overflow-y-auto h-[calc(100dvh-64px)] bg-background px-3">
           <div className="py-2">
             {activeSubmenu ? (
               (