diff --git a/src/components/app/MobileDrawer.tsx b/src/components/app/MobileDrawer.tsx
index ea630ce..f2f325e 100644
--- a/src/components/app/MobileDrawer.tsx
+++ b/src/components/app/MobileDrawer.tsx
@@ -6,7 +6,7 @@ import { useState } from 'react'
 import { usePathname, useRouter } from 'next/navigation'
 
 import {
-  MAIN_SIDEBAR,
+  MOBILE_MAIN_SIDEBAR,
   MOBILE_REACT_SIDEBAR,
   MOBILE_SHADCN_SIDEBAR,
 } from '@/data/sidebar-links'
@@ -20,12 +20,12 @@ export default function MobileDrawer() {
   const pathname = usePathname()
 
   const ACTIVE_SIDEBAR = pathname.includes('/docs')
-    ? MAIN_SIDEBAR
+    ? MOBILE_MAIN_SIDEBAR
     : pathname.includes('/react')
     ? MOBILE_REACT_SIDEBAR
     : pathname.includes('/shadcn')
     ? MOBILE_SHADCN_SIDEBAR
-    : MAIN_SIDEBAR
+    : MOBILE_MAIN_SIDEBAR
 
   const [isDrawerActive, setIsDrawerActive] = useState(false)
 
@@ -36,7 +36,7 @@ export default function MobileDrawer() {
 
   return (
     <>
-      <div className="hidden w-[172px] m900:block m800:w-[44px] m400:w-9">
+      <div className="hidden w-[236px] m900:block m800:w-[108px] m400:w-9">
         <button
           onClick={() => setIsDrawerActive(true)}
           className="flex items-center justify-center rounded-base border-2 border-border dark:border-darkBorder p-2 shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] transition-all hover:translate-x-[3px] hover:translate-y-[3px] hover:shadow-none"
diff --git a/src/data/sidebar-links.ts b/src/data/sidebar-links.ts
index ef6326d..0ceaf6b 100644
--- a/src/data/sidebar-links.ts
+++ b/src/data/sidebar-links.ts
@@ -17,6 +17,25 @@ const SHADCN_LINKS = SHADCN_COMPONENTS.map((component) => {
   }
 })
 
+const GETTING_STARTED_LINKS = [
+  {
+    href: '/docs',
+    text: 'Introduction',
+  },
+  {
+    href: '/docs/styling',
+    text: 'Styling',
+  },
+  {
+    href: '/docs/resources',
+    text: 'Resources',
+  },
+  {
+    href: '/templates',
+    text: 'Templates',
+  },
+]
+
 const MAIN_SIDEBAR = [
   'Getting started',
   {
@@ -64,18 +83,7 @@ const SHADCN_SIDEBAR = [
 
 const MOBILE_REACT_SIDEBAR = [
   'Getting started',
-  {
-    href: '/docs',
-    text: 'Introduction',
-  },
-  {
-    href: '/docs/styling',
-    text: 'Styling',
-  },
-  {
-    href: '/docs/resources',
-    text: 'Resources',
-  },
+  ...GETTING_STARTED_LINKS,
   {
     href: '/shadcn/installation',
     text: 'Shadcn components',
@@ -91,18 +99,7 @@ const MOBILE_REACT_SIDEBAR = [
 
 const MOBILE_SHADCN_SIDEBAR = [
   'Getting started',
-  {
-    href: '/docs',
-    text: 'Introduction',
-  },
-  {
-    href: '/docs/styling',
-    text: 'Styling',
-  },
-  {
-    href: '/docs/resources',
-    text: 'Resources',
-  },
+  ...GETTING_STARTED_LINKS,
   {
     href: '/react/installation',
     text: 'React components',
@@ -116,10 +113,28 @@ const MOBILE_SHADCN_SIDEBAR = [
   ...SHADCN_LINKS,
 ]
 
+const MOBILE_MAIN_SIDEBAR = [
+  'Getting started',
+  ...GETTING_STARTED_LINKS,
+  'Components',
+  {
+    href: '/react/installation',
+    text: 'React',
+  },
+  {
+    href: '/shadcn/installation',
+    text: 'Shadcn',
+  },
+]
+
 export {
   MAIN_SIDEBAR,
   REACT_SIDEBAR,
   SHADCN_SIDEBAR,
   MOBILE_REACT_SIDEBAR,
   MOBILE_SHADCN_SIDEBAR,
+  MOBILE_MAIN_SIDEBAR,
+  REACT_LINKS,
+  SHADCN_LINKS,
+  GETTING_STARTED_LINKS,
 }