diff --git a/client-app/app/(app)/compose.tsx b/client-app/app/(app)/compose.tsx index a24b143..41ac210 100644 --- a/client-app/app/(app)/compose.tsx +++ b/client-app/app/(app)/compose.tsx @@ -198,7 +198,7 @@ export default function ComposeScreen() { return ( {/* Header */} - {/* Tab strip */} + {/* Tab strip — больше воздуха между табами. Горизонтальный padding + на контейнере + gap между Pressable'ами делает табы "breathable", + индикатор активной вкладки — тонкая полоска только под текстом, + шириной примерно с лейбл. */} ({ flex: 1, alignItems: 'center', - paddingVertical: 14, + paddingVertical: 16, backgroundColor: pressed ? '#0a0a0a' : 'transparent', })} > @@ -172,6 +177,7 @@ export default function FeedScreen() { color: tab === key ? '#ffffff' : '#6a6a6a', fontWeight: tab === key ? '700' : '500', fontSize: 14, + letterSpacing: -0.1, }} > {TAB_LABELS[key]} @@ -179,8 +185,8 @@ export default function FeedScreen() { {tab === key && ( - {/* Floating compose button */} + {/* Floating compose button — pinned to the bottom-right corner + with 14px side inset. Vertical offset clears the 5-icon NavBar + (which lives below this view in the same layer) by sitting + ~14px above its top edge. */} router.push('/(app)/compose' as never)} style={({ pressed }) => ({ position: 'absolute', - right: 18, - bottom: Math.max(insets.bottom, 12) + 70, // clear the NavBar + right: 14, + bottom: Math.max(insets.bottom, 0) + 62, width: 56, height: 56, borderRadius: 28, backgroundColor: pressed ? '#1a8cd8' : '#1d9bf0',