authorgravatar for julius0216@outlook.comJulius Marminge <julius0216@outlook.com> 2026-09-05 15:57:43-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-09-05 15:57:43-07:00
log1cb49c3df2e0fb4bc2c6e88b0f102c1f9eb8cee5
tree4df54e8f1911be1802b17c422ede695c20de3f09
parent3fb8942a427d564cfee4724ad6e40eb9c8881aea
signature Signed by PGP key B5690EEEBB952194

fix(mobile): even out the working pill's spacing (#10209)

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

1 files changed, 9 insertions(+), 4 deletions(-)

apps/mobile/src/features/threads/floating-working-control.tsx+9-4
......@@ -18,8 +18,12 @@ import { SymbolView } from "../../components/AppSymbol";
1818import { ControlPill } from "../../components/ControlPill";
1919import { NATIVE_LIQUID_GLASS_SUPPORTED } from "../../native/native-glass";
2020
21const CONTROL_HEIGHT = 44;
22const CONTROL_COMPOSER_GAP = 8;
21const CONTROL_HEIGHT = 38.5; // h-11 with the mobile 14px rem
22// The collapsed composer capsule starts 6 below its overlay's top edge, so
23// the pill sits at (gap - 6) above the overlay to leave the same gap to the
24// capsule as the feed's end inset leaves between it and the last row.
25const CONTROL_GAP = 8;
26const COMPOSER_CAPSULE_INSET = 6;
2327const GLASS_MERGE_SPACING = 12;
2428const CONTROL_ENTERING = FadeIn.duration(180).reduceMotion(ReduceMotion.System);
2529const CONTROL_EXITING = FadeOut.duration(120).reduceMotion(ReduceMotion.System);
......@@ -40,7 +44,8 @@ const UniwindGlassContainer = withUniwind(GlassContainer, {
4044});
4145const AnimatedGlassView = Animated.createAnimatedComponent(UniwindGlassView);
4246
43export const FLOATING_WORKING_CONTROL_COVERAGE = CONTROL_HEIGHT + CONTROL_COMPOSER_GAP;
47const CONTROL_OVERLAY_OFFSET = CONTROL_HEIGHT + CONTROL_GAP - COMPOSER_CAPSULE_INSET;
48export const FLOATING_WORKING_CONTROL_COVERAGE = CONTROL_OVERLAY_OFFSET + CONTROL_GAP;
4449
4550/**
4651 * What the floating pill says. Syncing and working share one element so the
......@@ -81,7 +86,7 @@ export function FloatingWorkingControl(props: {
8186 <Animated.View
8287 pointerEvents="box-none"
8388 className="absolute left-0 right-0 z-20 items-center"
84 style={{ top: -FLOATING_WORKING_CONTROL_COVERAGE }}
89 style={{ top: -CONTROL_OVERLAY_OFFSET }}
8590 entering={NATIVE_LIQUID_GLASS_SUPPORTED ? undefined : CONTROL_ENTERING}
8691 exiting={NATIVE_LIQUID_GLASS_SUPPORTED ? undefined : CONTROL_EXITING}
8792 >