fix(feed): side padding on action row + stable FAB right-anchor
- Post action row (chat / ❤ / eye / share) had only a small paddingRight and no left padding. First icon sat flush under the avatar and share iron against the card edge. Replaced with paddingHorizontal: 12 so both sides get equal breathing room; each of the four cells still flex:1 so the icons distribute evenly. - FAB kept appearing at the LEFT edge instead of the right on user's device despite position:absolute + right:12. Pressable's dynamic- function style can drop absolute-positioning fields between renders on some RN versions. Wrapping the Pressable in a plain absolute- positioned View fixes this: positioning lives on the View (never re-evaluated mid-render), the Pressable inside only declares size and visuals. pointerEvents="box-none" on the wrapper keeps taps outside the button passing through to the feed list below. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -247,14 +247,16 @@ function PostCardInner({ post, likedByMe, onStatsChanged, onDeleted, compact }:
|
||||
{/* 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. */}
|
||||
balanced. paddingHorizontal gives extra breathing room on
|
||||
both sides so the first icon isn't flush under the avatar
|
||||
and the share icon isn't flush with the card edge. */}
|
||||
<View
|
||||
style={{
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
marginTop: 12,
|
||||
paddingRight: 4,
|
||||
paddingHorizontal: 12,
|
||||
}}
|
||||
>
|
||||
<View style={{ flex: 1, alignItems: 'flex-start' }}>
|
||||
|
||||
Reference in New Issue
Block a user