diff --git a/src/components/FramePicker.tsx b/src/components/FramePicker.tsx index 54f264a2..213ffc23 100644 --- a/src/components/FramePicker.tsx +++ b/src/components/FramePicker.tsx @@ -90,7 +90,7 @@ const styles = StyleSheet.create({ fontStyle: 'italic', }, title: { - fontSize: 13, + fontSize: 16, fontWeight: 'bold', color: THEME.colors.textMuted, letterSpacing: 1, @@ -101,9 +101,9 @@ const styles = StyleSheet.create({ gap: 8, }, frameThumb: { - width: 80, + width: 120, alignItems: 'center', - padding: 4, + padding: 6, borderRadius: THEME.borderRadius.sm, borderWidth: 1, borderColor: 'transparent', @@ -113,8 +113,8 @@ const styles = StyleSheet.create({ backgroundColor: 'rgba(40, 223, 255, 0.1)', }, noFrameBox: { - width: 66, - height: 44, + width: 100, + height: 66, backgroundColor: THEME.colors.surfaceSecondary, borderRadius: 4, justifyContent: 'center', @@ -123,18 +123,18 @@ const styles = StyleSheet.create({ borderColor: THEME.colors.border, }, noFrameText: { - fontSize: 20, + fontSize: 28, color: THEME.colors.textMuted, }, thumbImage: { - width: 66, - height: 44, + width: 100, + height: 66, borderRadius: 4, }, frameName: { - fontSize: 10, + fontSize: 13, color: THEME.colors.textMuted, - marginTop: 3, + marginTop: 6, textAlign: 'center', }, }); diff --git a/src/components/StickerTray.tsx b/src/components/StickerTray.tsx index a7e20266..0818ff54 100644 --- a/src/components/StickerTray.tsx +++ b/src/components/StickerTray.tsx @@ -93,13 +93,13 @@ export default function StickerTray({ const styles = StyleSheet.create({ container: { position: 'absolute', - bottom: 0, + bottom: 40, left: 0, right: 0, backgroundColor: 'rgba(13, 13, 26, 0.95)', borderTopWidth: 1, borderTopColor: THEME.colors.border, - paddingBottom: 8, + paddingBottom: 16, zIndex: 500, }, header: { @@ -110,7 +110,7 @@ const styles = StyleSheet.create({ paddingVertical: 6, }, headerTitle: { - fontSize: 13, + fontSize: 16, fontWeight: 'bold', color: THEME.colors.textMuted, letterSpacing: 1, @@ -128,16 +128,16 @@ const styles = StyleSheet.create({ dateBtn: { flexDirection: 'row', alignItems: 'center', - gap: 6, + gap: 8, backgroundColor: THEME.colors.surfaceSecondary, - paddingVertical: 5, - paddingHorizontal: 10, + paddingVertical: 10, + paddingHorizontal: 16, borderRadius: THEME.borderRadius.sm, borderWidth: 1, borderColor: THEME.colors.border, }, dateBtnText: { - fontSize: 12, + fontSize: 15, color: THEME.colors.accent, fontWeight: '600', }, @@ -146,15 +146,15 @@ const styles = StyleSheet.create({ paddingVertical: 4, }, emojiBtn: { - width: 44, - height: 44, + width: 60, + height: 60, justifyContent: 'center', alignItems: 'center', - marginHorizontal: 2, + marginHorizontal: 4, borderRadius: THEME.borderRadius.sm, backgroundColor: 'rgba(255, 255, 255, 0.05)', }, emojiText: { - fontSize: 28, + fontSize: 40, }, }); diff --git a/src/screens/PreviewScreen.tsx b/src/screens/PreviewScreen.tsx index c8e9eb67..3f35543c 100644 --- a/src/screens/PreviewScreen.tsx +++ b/src/screens/PreviewScreen.tsx @@ -589,7 +589,7 @@ export default function PreviewScreen({ > @@ -612,7 +612,7 @@ export default function PreviewScreen({ > @@ -692,9 +692,10 @@ const styles = StyleSheet.create({ }, previewPanel: { flex: 1.2, - justifyContent: 'center', + justifyContent: 'flex-start', alignItems: 'center', padding: THEME.spacing.md, + paddingTop: 60, backgroundColor: '#030308', }, viewShotContainer: { @@ -803,9 +804,9 @@ const styles = StyleSheet.create({ editToolBtn: { flexDirection: 'row', alignItems: 'center', - gap: 6, - paddingVertical: 8, - paddingHorizontal: 14, + gap: 8, + paddingVertical: 12, + paddingHorizontal: 20, borderRadius: THEME.borderRadius.round, borderWidth: 1, borderColor: THEME.colors.border, @@ -816,7 +817,7 @@ const styles = StyleSheet.create({ borderColor: THEME.colors.accent, }, editToolText: { - fontSize: 13, + fontSize: 16, fontWeight: '600', color: THEME.colors.accent, },