fix(mobile): improve item separator rendering

- Use Tailwind's height utility class for consistent separator height
- Add `collapsable={false}` to prevent rendering artifacts
- Use `transform: [{ scaleY: 0.5 }]` for precise hairline width
- Update separators in entry list, settings, and subscription modules

Signed-off-by: Innei <tukon479@gmail.com>

apps/mobile/src/modules/entry-list/ItemSeparator.tsx

@@ -1,14 +1,22 @@
-import { StyleSheet, View } from "react-native"
+import { View } from "react-native"
 
 const el = (
-  <View className="bg-opaque-separator mx-4" style={{ height: StyleSheet.hairlineWidth }} />
+  <View
+    className="bg-opaque-separator mx-4 h-px"
+    style={{ transform: [{ scaleY: 0.5 }] }}
+    collapsable={false}
+  />
 )
 
 export const ItemSeparator = () => {
   return el
 }
 const el2 = (
-  <View className="bg-opaque-separator w-full" style={{ height: StyleSheet.hairlineWidth }} />
+  <View
+    className="bg-opaque-separator h-px w-full"
+    style={{ transform: [{ scaleY: 0.5 }] }}
+    collapsable={false}
+  />
 )
 export const ItemSeparatorFullWidth = () => {
   return el2

apps/mobile/src/modules/settings/routes/Lists.tsx

@@ -108,8 +108,9 @@ const AddListButton = () => {
 const ItemSeparatorComponent = () => {
   return (
     <View
-      className="bg-opaque-separator ml-24 flex-1"
-      style={{ height: StyleSheet.hairlineWidth }}
+      className="bg-opaque-separator ml-24 h-px flex-1"
+      collapsable={false}
+      style={{ transform: [{ scaleY: 0.5 }] }}
     />
   )
 }

apps/mobile/src/modules/subscription/ItemSeparator.tsx

@@ -1,7 +1,11 @@
-import { StyleSheet, View } from "react-native"
+import { View } from "react-native"
 
 const el = (
-  <View className="bg-opaque-separator ml-12 flex-1" style={{ height: StyleSheet.hairlineWidth }} />
+  <View
+    className="bg-opaque-separator ml-12 h-px flex-1"
+    collapsable={false}
+    style={{ transform: [{ scaleY: 0.5 }] }}
+  />
 )
 export const ItemSeparator = () => {
   return el