diff --git a/client-app/app/(app)/feed/[id].tsx b/client-app/app/(app)/feed/[id].tsx index 090aa12..c66dbf1 100644 --- a/client-app/app/(app)/feed/[id].tsx +++ b/client-app/app/(app)/feed/[id].tsx @@ -21,6 +21,7 @@ import { } from 'react-native'; import { Ionicons } from '@expo/vector-icons'; import { router, useLocalSearchParams } from 'expo-router'; +import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { Header } from '@/components/Header'; import { IconButton } from '@/components/IconButton'; @@ -32,6 +33,7 @@ import { } from '@/lib/feed'; export default function PostDetailScreen() { + const insets = useSafeAreaInsets(); const { id: postID } = useLocalSearchParams<{ id: string }>(); const keyFile = useStore(s => s.keyFile); @@ -73,7 +75,7 @@ export default function PostDetailScreen() { }, []); return ( - +
router.back()} />} diff --git a/client-app/app/(app)/feed/index.tsx b/client-app/app/(app)/feed/index.tsx index 2dc8c97..ccfd673 100644 --- a/client-app/app/(app)/feed/index.tsx +++ b/client-app/app/(app)/feed/index.tsx @@ -158,17 +158,18 @@ export default function FeedScreen() { - {/* Tab strip — больше воздуха между табами. Горизонтальный padding - на контейнере + gap между Pressable'ами делает табы "breathable", - индикатор активной вкладки — тонкая полоска только под текстом, - шириной примерно с лейбл. */} + {/* Tab strip — три таба, равномерно распределены по ширине + (justifyContent: space-between). Каждый Pressable hug'ает + свой контент — табы НЕ тянутся на 1/3 ширины, а жмутся к + своему лейблу, что даёт воздух между ними. Индикатор активной + вкладки — тонкая полоска под лейблом. */} {(Object.keys(TAB_LABELS) as TabKey[]).map(key => ( @@ -176,33 +177,31 @@ export default function FeedScreen() { key={key} onPress={() => setTab(key)} style={({ pressed }) => ({ - flex: 1, alignItems: 'center', paddingVertical: 16, - backgroundColor: pressed ? '#0a0a0a' : 'transparent', + paddingHorizontal: 6, + opacity: pressed ? 0.6 : 1, })} > {TAB_LABELS[key]} - {tab === key && ( - - )} + ))} diff --git a/client-app/app/(app)/feed/tag/[tag].tsx b/client-app/app/(app)/feed/tag/[tag].tsx index e9c7d78..a262582 100644 --- a/client-app/app/(app)/feed/tag/[tag].tsx +++ b/client-app/app/(app)/feed/tag/[tag].tsx @@ -10,6 +10,7 @@ import { } from 'react-native'; import { Ionicons } from '@expo/vector-icons'; import { router, useLocalSearchParams } from 'expo-router'; +import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { Header } from '@/components/Header'; import { IconButton } from '@/components/IconButton'; @@ -18,6 +19,7 @@ import { useStore } from '@/lib/store'; import { fetchHashtag, fetchStats, type FeedPostItem } from '@/lib/feed'; export default function HashtagScreen() { + const insets = useSafeAreaInsets(); const { tag: rawTag } = useLocalSearchParams<{ tag: string }>(); const tag = (rawTag ?? '').replace(/^#/, '').toLowerCase(); const keyFile = useStore(s => s.keyFile); @@ -75,7 +77,7 @@ export default function HashtagScreen() { }, [keyFile]); return ( - +
router.back()} />} diff --git a/client-app/components/feed/PostCard.tsx b/client-app/components/feed/PostCard.tsx index 64fe212..f1f0abc 100644 --- a/client-app/components/feed/PostCard.tsx +++ b/client-app/components/feed/PostCard.tsx @@ -173,11 +173,12 @@ function PostCardInner({ post, likedByMe, onStatsChanged, onDeleted, compact }: onLongPress={onLongPress} style={({ pressed }) => ({ flexDirection: 'row', - paddingHorizontal: 14, - paddingVertical: compact ? 10 : 12, + paddingHorizontal: 16, + paddingTop: compact ? 12 : 16, + paddingBottom: compact ? 14 : 18, backgroundColor: pressed ? '#080808' : 'transparent', borderBottomWidth: 1, - borderBottomColor: '#141414', + borderBottomColor: '#222222', })} > {/* Avatar column */} @@ -246,58 +247,69 @@ function PostCardInner({ post, likedByMe, onStatsChanged, onDeleted, compact }: )} - {/* Action row */} + {/* Action row — 4 evenly-spaced buttons (Twitter-style). Each is + wrapped in a flex: 1 container so even if one label is + wider than another, visual spacing between centres stays + balanced. */} - - ({ - flexDirection: 'row', alignItems: 'center', gap: 6, - opacity: pressed ? 0.5 : 1, - })} - > - - - - + + + + ({ + flexDirection: 'row', alignItems: 'center', gap: 6, + opacity: pressed ? 0.5 : 1, + })} > - {formatCount(localLikeCount)} - - - - - { - // Placeholder — copy postID to clipboard in a future PR. - Alert.alert('Ссылка', `dchain://post/${post.post_id}`); - }} - /> + + + + + {formatCount(localLikeCount)} + + + + + + + + { + // Placeholder — copy postID to clipboard in a future PR. + Alert.alert('Ссылка', `dchain://post/${post.post_id}`); + }} + /> +