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";...@@ -18,8 +18,12 @@ import { SymbolView } from "../../components/AppSymbol";
18import { ControlPill } from "../../components/ControlPill";18import { ControlPill } from "../../components/ControlPill";
19import { NATIVE_LIQUID_GLASS_SUPPORTED } from "../../native/native-glass";19import { NATIVE_LIQUID_GLASS_SUPPORTED } from "../../native/native-glass";
2020
21const CONTROL_HEIGHT = 44;21const CONTROL_HEIGHT = 38.5; // h-11 with the mobile 14px rem
22const CONTROL_COMPOSER_GAP = 8;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;
23const GLASS_MERGE_SPACING = 12;27const GLASS_MERGE_SPACING = 12;
24const CONTROL_ENTERING = FadeIn.duration(180).reduceMotion(ReduceMotion.System);28const CONTROL_ENTERING = FadeIn.duration(180).reduceMotion(ReduceMotion.System);
25const CONTROL_EXITING = FadeOut.duration(120).reduceMotion(ReduceMotion.System);29const CONTROL_EXITING = FadeOut.duration(120).reduceMotion(ReduceMotion.System);
...@@ -40,7 +44,8 @@ const UniwindGlassContainer = withUniwind(GlassContainer, {...@@ -40,7 +44,8 @@ const UniwindGlassContainer = withUniwind(GlassContainer, {
40});44});
41const AnimatedGlassView = Animated.createAnimatedComponent(UniwindGlassView);45const 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
45/**50/**
46 * What the floating pill says. Syncing and working share one element so the51 * What the floating pill says. Syncing and working share one element so the
...@@ -81,7 +86,7 @@ export function FloatingWorkingControl(props: {...@@ -81,7 +86,7 @@ export function FloatingWorkingControl(props: {
81 <Animated.View86 <Animated.View
82 pointerEvents="box-none"87 pointerEvents="box-none"
83 className="absolute left-0 right-0 z-20 items-center"88 className="absolute left-0 right-0 z-20 items-center"
84 style={{ top: -FLOATING_WORKING_CONTROL_COVERAGE }}89 style={{ top: -CONTROL_OVERLAY_OFFSET }}
85 entering={NATIVE_LIQUID_GLASS_SUPPORTED ? undefined : CONTROL_ENTERING}90 entering={NATIVE_LIQUID_GLASS_SUPPORTED ? undefined : CONTROL_ENTERING}
86 exiting={NATIVE_LIQUID_GLASS_SUPPORTED ? undefined : CONTROL_EXITING}91 exiting={NATIVE_LIQUID_GLASS_SUPPORTED ? undefined : CONTROL_EXITING}
87 >92 >