u

code/allapp/allapp-rn/src/app/(tabs)/_layout.tsx

@@ -5,7 +5,7 @@ import { useCallback, useEffect, useState } from 'react'
 import { Text, TouchableOpacity, View } from 'react-native'
 import Animated, { useAnimatedRef } from 'react-native-reanimated'
 import Sortable from 'react-native-sortables'
-import { ADrawer, LucideIcon } from '@/components/common/ao'
+import { ADivider, ADrawer, LucideIcon } from '@/components/common/ao'
 import { useNavStore } from '@/store/navigation'
 
 export default function TabsLayout() {
@@ -75,37 +75,42 @@ export default function TabsLayout() {
 
       <View
         className="
-          absolute
-          left-3 right-3 bottom-8
           h-14
           flex-row items-center
           px-2
           gap-4
+          bg-white
         "
-        style={{ zIndex: 0 }}
+        style={{
+          zIndex: 0,
+          elevation: 24,
+          shadowColor: '#000',
+          shadowOffset: { width: 0, height: 100 },
+        }}
       >
-        <View className="bg-white rounded-md shadow-lg h-12 w-12">
-          <TouchableOpacity className="w-full h-full items-center justify-center">
-            <LucideIcon icon="Bot" size={26} clickable={false} strokeWidth={2} />
-          </TouchableOpacity>
-        </View>
+        <TouchableOpacity className="w-12 items-center justify-center">
+          <LucideIcon icon="Bot" size={24} clickable={false} strokeWidth={2} />
+        </TouchableOpacity>
 
-        <View className="flex-1 bg-white rounded-md shadow-lg h-12">
-          <TouchableOpacity
-            className="w-full h-full items-center justify-center flex flex-row"
-            onPress={() => {
-              setShowNavDrawer(true)
-            }}
-          >
-            <LucideIcon icon={currentNav.icon} size={20} strokeWidth={2} />
-            <Text className="font-semibold text-lg ml-2">{currentNav.label}</Text>
-          </TouchableOpacity>
-        </View>
-        <View className="bg-white rounded-md shadow-lg h-12 w-12">
-          <TouchableOpacity className="w-full h-full items-center justify-center" onPress={refreshPage}>
-            <LucideIcon icon="RefreshCcw" size={26} clickable={false} strokeWidth={2} />
-          </TouchableOpacity>
-        </View>
+        <ADivider
+          direction="vertical"
+        />
+
+        <TouchableOpacity
+          className="flex-1 items-center justify-center flex flex-row"
+          onPress={() => {
+            setShowNavDrawer(true)
+          }}
+        >
+          <LucideIcon icon={currentNav.icon} size={22} strokeWidth={2} />
+          <Text className="font-semibold text-lg ml-2">{currentNav.label}</Text>
+        </TouchableOpacity>
+
+        <ADivider direction="vertical" />
+
+        <TouchableOpacity className="w-12 items-center justify-center" onPress={refreshPage}>
+          <LucideIcon icon="RefreshCcw" size={24} clickable={false} strokeWidth={2} />
+        </TouchableOpacity>
       </View>
 
       <ADrawer