authorgravatar for julius0216@outlook.comJulius Marminge <julius0216@outlook.com> 2026-08-28 17:14:03-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-08-28 17:14:03-07:00
log8fc7f22941969d7a2c06929dc29aa86ae1b02f33
treebf7df9c9fd2cf42c203af47e7b709ffb540228ac
parent38154388d7b0274aefd3f29c38db3b2659c46c29
signature Signed by PGP key B5690EEEBB952194

fix(mobile): restore composer glass and rounded shadows (#8597)

Co-authored-by: Julius Marminge <julius@mac.lan>

4 files changed, 18 insertions(+), 15 deletions(-)

apps/mobile/src/components/ComposerToolbar.tsx+2-2
......@@ -252,7 +252,8 @@ export function ComposerToolbarButton(props: {
252252 // so callers can lift it with max-w-full — flex-filling pills in the
253253 // thread composer stretch to the row's edge. The numeric maxWidth
254254 // prop still wins via the inline style below.
255 "h-11 max-w-[172px] flex-row items-center justify-center rounded-full border shadow-lg shadow-adaptive-black-a10-a25 active:opacity-70",
255 "h-11 max-w-[172px] flex-row items-center justify-center rounded-full border active:opacity-70",
256 variant === "primary" && "shadow-lg shadow-adaptive-black-a10-a25 disabled:shadow-none",
256257 isCircle ? "w-11" : "gap-2 px-3.5",
257258 variant === "primary"
258259 ? props.disabled
......@@ -279,7 +280,6 @@ export function ComposerToolbarButton(props: {
279280 maxWidth: props.maxWidth,
280281 minWidth: props.minWidth,
281282 opacity: props.disabled ? 0.55 : pressed ? 0.72 : 1,
282 shadowOpacity: props.disabled ? 0 : 1,
283283 },
284284 props.style,
285285 ]}
apps/mobile/src/components/GlassSurface.tsx+5-1
......@@ -13,7 +13,11 @@ import { withUniwind } from "uniwind";
1313
1414import { cn } from "../lib/cn";
1515
16const ThemedGlassView = withUniwind(GlassView);
16// Explicit mappings keep the native glassEffectStyle enum out of style-array conversion.
17const ThemedGlassView = withUniwind(GlassView, {
18 style: { fromClassName: "className" },
19 tintColor: { fromClassName: "tintColorClassName", styleProperty: "accentColor" },
20});
1721
1822interface GlassSurfaceProps extends ViewProps {
1923 readonly children: ReactNode;
apps/mobile/src/features/threads/ThreadComposer.tsx+8-12
......@@ -119,21 +119,17 @@ export function ComposerSurface(props: {
119119 /** Existing thread composers morph between pill and card layouts. */
120120 readonly animateLayout?: boolean;
121121}) {
122 // Drop shadow lives on a wrapper: `overflow: "hidden"` on the surface itself
123 // (needed to clip content to the pill shape) would clip the shadow on iOS.
124 const shadowStyle: ViewStyle = {
125 borderRadius: props.style.borderRadius,
126 shadowOpacity: 1,
127 shadowRadius: 14,
128 shadowOffset: { width: 0, height: 6 },
129 elevation: 10,
130 };
131
122 // A box shadow follows the rounded surface even when the glass is transparent.
123 // Keep it outside the clipped content so the shadow can extend past the edge.
132124 return (
133125 <Animated.View
134 className="shadow-adaptive-black-a15-a35"
126 className="shadow-[0_6px_28px] shadow-adaptive-black-a15-a35"
135127 layout={props.animateLayout === false ? undefined : COMPOSER_LAYOUT_TRANSITION}
136 style={shadowStyle}
128 style={{
129 borderRadius: props.style.borderRadius,
130 // Android versions before 9 do not support outset box shadows.
131 elevation: Platform.OS === "android" && Platform.Version < 28 ? 10 : undefined,
132 }}
137133 >
138134 <GlassSurface
139135 chrome="none"
docs/user/mobile-appearance.md+3
......@@ -4,6 +4,9 @@ T3 Code Mobile includes the T3 Code, T3 Chat, Grove, Ocean, Ember, and Iris them
44light and dark colors that apply throughout the app, including code reviews, file previews, the
55terminal, native headers, and sheets.
66
7On supported iOS versions, the new-task and thread composers use the system glass material.
8Other platforms use a themed background.
9
710To change themes:
811
9121. Open **Settings**.