UPD: mobile interface for nav sidebar

src/components/NavSidebar.vue

 <script setup lang="ts">
+import { useMediaQuery } from '@vueuse/core'
+
 const navItems = [
   {
     title: 'Home',
@@ -22,6 +24,7 @@ const navItems = [
     active: false,
   },
 ]
+const isMobile = useMediaQuery('(max-width: 768px)')
 </script>
 
 <template>
@@ -31,7 +34,7 @@ const navItems = [
         <SidebarGroup>
           <SidebarMenu>
             <template v-for="item in navItems" :key="item.title">
-              <NavSidebarElement v-if="!item.fromTop" :title="item.title" :url="item.url" :icon="item.icon" :active="item.active" />
+              <NavSidebarElement v-if="!item.fromTop || isMobile" :title="item.title" :url="item.url" :icon="item.icon" :active="item.active" />
             </template>
           </SidebarMenu>
         </SidebarGroup>

src/components/NavSidebarButton.vue

+<template>
+  <Button variant="outline">
+    <Icon
+      icon="radix-icons:moon"
+      class="h-[1.2rem] w-[0.2rem]"
+    />
+    <span class="sr-only">Toggle navigation sidebar</span>
+  </Button>
+</template>

src/components/TopBar.vue

+<script setup lang="ts">
+import { useMediaQuery } from '@vueuse/core'
+
+const isMobile = useMediaQuery('(max-width: 768px)')
+</script>
+
 <template>
   <div h-14 b-b bg-background>
     <div flex gap-2 justify-center p-2>
+      <NavSidebarButton v-if="isMobile" />
       <GlobalSearch />
       <UserNav />
       <DarkModeToggle />