fix(mobile-tabs-pager): paint Background.OnContainer on pagerRoot so panes mounted outside PageRoot inherit readable text on native
This commit is contained in:
parent
870e13d895
commit
4a9d5f6384
1 changed files with 13 additions and 0 deletions
|
|
@ -15,6 +15,18 @@ import { color } from 'folds';
|
||||||
// (a) the inter-pane gap during a swipe — the gap colour the user
|
// (a) the inter-pane gap during a swipe — the gap colour the user
|
||||||
// asked for is "light blue same as the header", which IS this
|
// asked for is "light blue same as the header", which IS this
|
||||||
// SurfaceVariant tone — and (b) any sub-pixel rounding seam at rest.
|
// SurfaceVariant tone — and (b) any sub-pixel rounding seam at rest.
|
||||||
|
//
|
||||||
|
// `color: Background.OnContainer` mirrors what the route-level
|
||||||
|
// `<PageRoot>` would have set via its `ContainerColor({ variant:
|
||||||
|
// 'Background' })` wrapper. We mount Direct/Channels/Bots directly
|
||||||
|
// here, bypassing PageRoot for the swipe-pager experience, so without
|
||||||
|
// this declaration the form labels rendered inside the per-pane
|
||||||
|
// StreamHeader curtain (`<Text size="L400">` for Username/Server/
|
||||||
|
// Options) had `color: inherit` cascading all the way up to `body`,
|
||||||
|
// which sets no color → browser default black. The labels became
|
||||||
|
// invisible against the dark form background only on native (where the
|
||||||
|
// pager activates). Desktop / web go through PageRoot and inherit the
|
||||||
|
// expected light tone for free.
|
||||||
export const pagerRoot = style({
|
export const pagerRoot = style({
|
||||||
position: 'relative',
|
position: 'relative',
|
||||||
flex: '1 1 0',
|
flex: '1 1 0',
|
||||||
|
|
@ -24,6 +36,7 @@ export const pagerRoot = style({
|
||||||
overflow: 'hidden',
|
overflow: 'hidden',
|
||||||
touchAction: 'pan-y',
|
touchAction: 'pan-y',
|
||||||
backgroundColor: color.SurfaceVariant.Container,
|
backgroundColor: color.SurfaceVariant.Container,
|
||||||
|
color: color.Background.OnContainer,
|
||||||
});
|
});
|
||||||
|
|
||||||
// Shared static tabs row painted ABOVE the strip. Reserves the
|
// Shared static tabs row painted ABOVE the strip. Reserves the
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue