government ui complated

components/ui/Header.tsx

@@ -27,10 +27,8 @@ export const CustomHeader = ({
   return (
     <View style={[styles.container, isDark ? styles.darkBg : styles.lightBg]}>
       <View style={styles.logoWrapper}>
-        <View style={styles.logoContainer}>
-          <Image source={Logo} style={styles.logo} />
-        </View>
-        <Image source={LogoText} style={{ width: 160, height: 40, objectFit: 'cover' }} />
+        <Image source={Logo} style={styles.logo} />
+        <Image source={LogoText} style={{ width: 160, height: 30, objectFit: 'contain' }} />
       </View>
       {logoutbtn && (
         <TouchableOpacity onPress={logout}>
@@ -46,7 +44,7 @@ export const CustomHeader = ({
 
           {unreadCount > 0 && (
             <View style={styles.badge}>
-              <Text style={styles.badgeText}>{unreadCount > 99 ? '99+' : unreadCount}</Text>
+              <Text style={styles.badgeText}>{unreadCount > 9 ? '9+' : unreadCount}</Text>
             </View>
           )}
 
@@ -87,7 +85,7 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     alignItems: 'center',
     alignContent: 'center',
-    gap: 5,
+    gap: 8,
   },
 
   logoContainer: {
@@ -101,8 +99,8 @@ const styles = StyleSheet.create({
   },
 
   logo: {
-    width: 32,
-    height: 32,
+    width: 40,
+    height: 40,
     resizeMode: 'contain',
   },
 
@@ -130,11 +128,10 @@ const styles = StyleSheet.create({
     minWidth: 18,
     height: 18,
     borderRadius: 9,
-    backgroundColor: '#ef4444', // qizil badge
+    backgroundColor: '#ef4444',
     justifyContent: 'center',
     alignItems: 'center',
     paddingHorizontal: 4,
-    borderWidth: 1.5,
   },
 
   badgeText: {