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,
},