git ssb - dx: [and] fix About and Thanks dialog styles · Daan Patchwork/manyverse@1d28192a

Commit 1d28192ad8069b9ae51edaf4e0ef55d0fe4c772c

dx: [and] fix About and Thanks dialog styles

Andre Staltz committed on 1/4/2020, 2:37:13 PM
Parent: b6353dd4cafb3f1069049d395c4b051ad4cb1995

Files changed

src/frontend/components/dialogs/Dialog.ts	changed
src/frontend/components/dialogs/DialogButton.ts	changed
src/frontend/components/dialogs/TextDialog.ts	changed
src/frontend/global-styles/dimens.ts	changed
src/frontend/screens/compose/styles.ts	changed

src/frontend/components/dialogs/Dialog.tsView
		@@ -28,18 +28,30 @@
28	28	maxHeight: 500,
29	29	maxWidth: 270,
30	30	minHeight: 100,
31	31	backgroundColor: Palette.backgroundText,
32		- borderRadius: Platform.select({ios: 10, default: 0}),
	32	+ borderRadius: Platform.select({
	33	+ default: 2,
	34	+ ios: 10,
	35	+ }),
	36	+ ...Platform.select({
	37	+ android: {
	38	+ minWidth: 300,
	39	+ elevation: 8,
	40	+ },
	41	+ }),
33	42	},
34	43
35	44	content: {
36	45	paddingVertical: Dimensions.verticalSpaceBig,
37	46	paddingHorizontal: Dimensions.horizontalSpaceBig,
38	47	color: Palette.text,
39	48	fontSize: Typography.fontSizeNormal,
40	49	fontFamily: Typography.fontFamilyReadableText,
41		- textAlign: Platform.select({ios: 'center', default: 'left'}),
	50	+ textAlign: Platform.select({
	51	+ default: 'left',
	52	+ ios: 'center',
	53	+ }),
42	54	},
43	55	});
44	56
45	57	export type Props = {};

src/frontend/components/dialogs/DialogButton.tsView
		@@ -15,8 +15,9 @@
15	15	} from 'react-native';
16	16	import {h} from '@cycle/react';
17	17	import {Palette} from '../../global-styles/palette';
18	18	import {Typography} from '../../global-styles/typography';
	19	+import {Dimensions} from '../../global-styles/dimens';
19	20
20	21	const Touchable = Platform.select<any>({
21	22	android: TouchableNativeFeedback,
22	23	default: TouchableOpacity,
		@@ -26,29 +27,44 @@
26	27	container: {
27	28	flexDirection: 'row',
28	29	alignItems: 'center',
29	30	backgroundColor: 'transparent',
30		- minHeight: 48,
31	31	...Platform.select({
	32	+ default: {
	33	+ justifyContent: 'center',
	34	+ width: 70,
	35	+ height: 40,
	36	+ position: 'absolute',
	37	+ bottom: Dimensions.verticalSpaceLarge,
	38	+ right: Dimensions.horizontalSpaceBig,
	39	+ },
32	40	ios: {
	41	+ minHeight: 48,
33	42	justifyContent: 'center',
34	43	borderTopColor: Palette.backgroundTextWeak,
35	44	borderTopWidth: 1,
36	45	borderBottomLeftRadius: 10,
37	46	borderBottomRightRadius: 10,
38	47	},
39		- android: {
40		- justifyContent: 'flex-end',
41		- },
42	48	}),
43	49	},
44	50
45	51	text: {
46		- color: Palette.textBrand,
47	52	textAlignVertical: 'center',
48		- fontWeight: Platform.select({ios: 'normal', default: 'bold'}),
49		- fontSize: Typography.fontSizeBig,
50		- textAlign: Platform.select({ios: 'center', android: 'right'}),
	53	+ ...Platform.select({
	54	+ default: {
	55	+ color: Palette.text,
	56	+ fontWeight: 'bold',
	57	+ fontSize: Typography.fontSizeNormal,
	58	+ textAlign: 'right',
	59	+ },
	60	+ ios: {
	61	+ color: Palette.textBrand,
	62	+ fontWeight: 'normal',
	63	+ fontSize: Typography.fontSizeBig,
	64	+ textAlign: 'center',
	65	+ },
	66	+ }),
51	67	},
52	68	});
53	69
54	70	export type Props = {

src/frontend/components/dialogs/TextDialog.tsView
		@@ -14,23 +14,35 @@
14	14	import DialogButton from './DialogButton';
15	15
16	16	export const styles = StyleSheet.create({
17	17	content: {
18		- paddingVertical: Dimensions.verticalSpaceBig,
19		- paddingHorizontal: Dimensions.horizontalSpaceBig,
	18	+ ...Platform.select({
	19	+ default: {
	20	+ paddingVertical: Dimensions.verticalSpaceLarger,
	21	+ paddingHorizontal: Dimensions.horizontalSpaceLarge,
	22	+ fontFamily: 'normal',
	23	+ textAlign: 'left',
	24	+ marginBottom: Dimensions.verticalSpaceLarge * 2,
	25	+ },
	26	+ ios: {
	27	+ paddingVertical: Dimensions.verticalSpaceBig,
	28	+ paddingHorizontal: Dimensions.horizontalSpaceBig,
	29	+ fontFamily: Typography.fontFamilyReadableText,
	30	+ textAlign: 'center',
	31	+ },
	32	+ }),
	33	+ ...Platform.select({android: {minWidth: 300}}),
20	34	color: Palette.textWeak,
21	35	fontSize: Typography.fontSizeNormal,
22		- fontFamily: Typography.fontFamilyReadableText,
23		- textAlign: Platform.select({ios: 'center', default: 'left'}),
24	36	},
25	37
26	38	title: {
27	39	fontSize: Typography.fontSizeBig,
28	40	fontWeight: 'bold',
29	41	color: Palette.text,
30	42	},
31	43
32		- spacer: {fontSize: 5},
	44	+ spacer: {fontSize: Platform.select({ios: 5, default: 15})},
33	45	});
34	46
35	47	export type Props = {
36	48	title?: string;

src/frontend/global-styles/dimens.tsView
		@@ -13,8 +13,10 @@
13	13	horizontalSpaceNormal: 12,
14	14	horizontalSpaceSmall: 7,
15	15	horizontalSpaceTiny: 4,
16	16
	17	+ verticalSpaceLarger: 28,
	18	+ verticalSpaceLarge: 20,
17	19	verticalSpaceBig: 14,
18	20	verticalSpaceNormal: 10,
19	21	verticalSpaceSmall: 7,
20	22	verticalSpaceTiny: 3,

src/frontend/screens/compose/styles.tsView
		@@ -77,9 +77,12 @@
77	77	paddingBottom: Dimensions.verticalSpaceSmall,
78	78	paddingLeft: Dimensions.horizontalSpaceSmall,
79	79	paddingRight: 1,
80	80	marginRight: Dimensions.horizontalSpaceBig,
81		- marginTop: Platform.select({ios: 20, default: Dimensions.verticalSpaceBig}),
	81	+ marginTop: Platform.select({
	82	+ ios: Dimensions.verticalSpaceLarge,
	83	+ default: Dimensions.verticalSpaceBig,
	84	+ }),
82	85	alignSelf: 'stretch',
83	86	fontSize: Typography.fontSizeBig,
84	87	textAlign: 'left',
85	88	textAlignVertical: 'top',

Built with git-ssb-web

Daan Patchwork / manyverse

Commit 1d28192ad8069b9ae51edaf4e0ef55d0fe4c772c

dx: [and] fix About and Thanks dialog styles

Files changed