jollywhoppers.com
Bluesky app fork with some witchin' additions 💫
witchsky.app
bluesky
fork
client
Fix email dialog width on large phones (#8350)
* Fix email dialog width on large phones
* Do it Right™
authored by
Eric Bailey
and committed by
GitHub
2e80fa3d
ce2fffc8
+10
-4
+8
-3
src/components/Prompt.tsx
+8
-3
src/components/Prompt.tsx
···
3
import {msg} from '@lingui/macro'
4
import {useLingui} from '@lingui/react'
5
6
-
import {atoms as a, useBreakpoints, useTheme, type ViewStyleProp} from '#/alf'
7
import {Button, type ButtonColor, ButtonText} from '#/components/Button'
8
import * as Dialog from '#/components/Dialog'
9
import {Text} from '#/components/Typography'
···
32
testID?: string
33
nativeOptions?: Omit<BottomSheetViewProps, 'children'>
34
}>) {
35
-
const {gtMobile} = useBreakpoints()
36
const titleId = React.useId()
37
const descriptionId = React.useId()
38
···
52
<Dialog.ScrollableInner
53
accessibilityLabelledBy={titleId}
54
accessibilityDescribedBy={descriptionId}
55
-
style={[gtMobile ? {width: 400} : a.w_full]}>
56
{children}
57
</Dialog.ScrollableInner>
58
</Context.Provider>
···
3
import {msg} from '@lingui/macro'
4
import {useLingui} from '@lingui/react'
5
6
+
import {
7
+
atoms as a,
8
+
useBreakpoints,
9
+
useTheme,
10
+
type ViewStyleProp,
11
+
web,
12
+
} from '#/alf'
13
import {Button, type ButtonColor, ButtonText} from '#/components/Button'
14
import * as Dialog from '#/components/Dialog'
15
import {Text} from '#/components/Typography'
···
38
testID?: string
39
nativeOptions?: Omit<BottomSheetViewProps, 'children'>
40
}>) {
41
const titleId = React.useId()
42
const descriptionId = React.useId()
43
···
57
<Dialog.ScrollableInner
58
accessibilityLabelledBy={titleId}
59
accessibilityDescribedBy={descriptionId}
60
+
style={web({maxWidth: 400})}>
61
{children}
62
</Dialog.ScrollableInner>
63
</Context.Provider>
+2
-1
src/components/dialogs/EmailDialog/index.tsx
+2
-1
src/components/dialogs/EmailDialog/index.tsx
···
2
import {msg} from '@lingui/macro'
3
import {useLingui} from '@lingui/react'
4
5
import * as Dialog from '#/components/Dialog'
6
import {type StatefulControl} from '#/components/dialogs/Context'
7
import {useGlobalDialogsControlContext} from '#/components/dialogs/Context'
···
38
39
<Dialog.ScrollableInner
40
label={_(msg`Make adjustments to email settings for your account`)}
41
-
style={[{maxWidth: 400}]}>
42
<Inner control={emailDialogControl} />
43
<Dialog.Close />
44
</Dialog.ScrollableInner>
···
2
import {msg} from '@lingui/macro'
3
import {useLingui} from '@lingui/react'
4
5
+
import {web} from '#/alf'
6
import * as Dialog from '#/components/Dialog'
7
import {type StatefulControl} from '#/components/dialogs/Context'
8
import {useGlobalDialogsControlContext} from '#/components/dialogs/Context'
···
39
40
<Dialog.ScrollableInner
41
label={_(msg`Make adjustments to email settings for your account`)}
42
+
style={web({maxWidth: 400})}>
43
<Inner control={emailDialogControl} />
44
<Dialog.Close />
45
</Dialog.ScrollableInner>