refactor(App, navigation): migrate to Expo Router and clean up navigation structure

- Updated App entry point to utilize Expo Router, simplifying the navigation setup.
- Removed legacy navigation components and services to streamline the codebase.
- Adjusted package.json to reflect the new entry point and updated dependencies for compatibility.
- Enhanced overall application structure by consolidating navigation logic and improving maintainability.

src/components/business/CommentItem.tsx

@@ -329,18 +329,18 @@ const CommentItem: React.FC<CommentItemProps> = ({
                 {/* 子评论操作按钮 */}
                 <View style={styles.subReplyActions}>
                   <TouchableOpacity
-                    style={styles.actionButton}
+                    style={styles.subActionButton}
                     onPress={() => onReplyPress?.(reply)}
                   >
                     <MaterialCommunityIcons name="reply" size={12} color={colors.text.hint} />
-                    <Text variant="caption" color={colors.text.hint} style={styles.actionText}>
+                    <Text variant="caption" color={colors.text.hint} style={styles.subActionText}>
                       回复
                     </Text>
                   </TouchableOpacity>
                   {/* 删除按钮 - 子评论作者可见 */}
                   {isSubReplyAuthor && (
                     <TouchableOpacity
-                      style={styles.actionButton}
+                      style={styles.subActionButton}
                       onPress={() => handleSubReplyDelete(reply)}
                       disabled={isDeleting}
                     >
@@ -349,7 +349,7 @@ const CommentItem: React.FC<CommentItemProps> = ({
                         size={12}
                         color={colors.text.hint}
                       />
-                      <Text variant="caption" color={colors.text.hint} style={styles.actionText}>
+                      <Text variant="caption" color={colors.text.hint} style={styles.subActionText}>
                         {isDeleting ? '删除中' : '删除'}
                       </Text>
                     </TouchableOpacity>
@@ -476,21 +476,26 @@ const CommentItem: React.FC<CommentItemProps> = ({
 const styles = StyleSheet.create({
   container: {
     flexDirection: 'row',
-    paddingVertical: spacing.sm,
+    paddingTop: spacing.md,
+    paddingBottom: spacing.xs,
     paddingHorizontal: spacing.lg,
-    backgroundColor: colors.background.paper,
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    borderBottomColor: colors.divider,
+    backgroundColor: 'transparent',
   },
   content: {
     flex: 1,
     marginLeft: spacing.sm,
+    backgroundColor: colors.background.paper,
+    borderRadius: borderRadius.lg,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: colors.divider,
+    paddingHorizontal: spacing.md,
+    paddingVertical: spacing.sm,
   },
   header: {
     flexDirection: 'row',
     justifyContent: 'space-between',
     alignItems: 'flex-start',
-    marginBottom: spacing.xs,
+    marginBottom: spacing.sm,
   },
   userInfo: {
     flexDirection: 'row',
@@ -537,7 +542,9 @@ const styles = StyleSheet.create({
     backgroundColor: colors.background.default,
     paddingHorizontal: spacing.xs,
     paddingVertical: 2,
-    borderRadius: borderRadius.sm,
+    borderRadius: 999,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: colors.divider,
   },
   floorText: {
     fontSize: fontSizes.xs,
@@ -546,7 +553,7 @@ const styles = StyleSheet.create({
     marginBottom: spacing.xs,
   },
   commentContent: {
-    marginBottom: spacing.xs,
+    marginBottom: spacing.sm,
   },
   text: {
     lineHeight: 20,
@@ -559,17 +566,24 @@ const styles = StyleSheet.create({
   actionButton: {
     flexDirection: 'row',
     alignItems: 'center',
-    marginRight: spacing.md,
-    paddingVertical: spacing.xs,
+    marginRight: spacing.sm,
+    paddingHorizontal: spacing.sm,
+    paddingVertical: 5,
+    borderRadius: 999,
+    backgroundColor: colors.background.default,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: colors.divider,
   },
   actionText: {
-    marginLeft: 2,
+    marginLeft: 4,
     fontSize: fontSizes.xs,
   },
   subRepliesContainer: {
     marginTop: spacing.sm,
     backgroundColor: colors.background.default,
-    borderRadius: borderRadius.md,
+    borderRadius: borderRadius.lg,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: colors.divider,
     padding: spacing.sm,
   },
   subReplyItem: {
@@ -607,6 +621,16 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     marginTop: spacing.xs,
   },
+  subActionButton: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginRight: spacing.sm,
+    paddingVertical: 2,
+  },
+  subActionText: {
+    marginLeft: 2,
+    fontSize: fontSizes.xs,
+  },
 });
 
 export default CommentItem;