dimitar/fitaiProto
1
0 Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

redesign take 2 complete

Browse Source 
fix artefacts from previous dessign
This commit is contained in:
dimitar committed 2026-03-12 17:56:46 +01:00
1 parent aba9b1395b
commit 5d6166df1b
17 files changed
+941 -878
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

apps/mobile/src/app/(tabs)/attendance.tsx
+8 -6
View File
@@ -103,20 +103,22 @@ export default function AttendanceScreen() {
>
{/* Header */}
<View style={styles.header}>
<Text style={[typography.h1, { color: colors.textPrimary }]}>
📍 Attendance
<Text
style={[typography.h1, { color: colors.textPrimary, fontSize: 32 }]}
>
Attendance
</Text>
<Text
style={[
typography.body,
{ color: colors.textSecondary, marginTop: 4 },
{ color: colors.textSecondary, marginTop: 8 },
]}
>
{activeCheckIn
? "You're crushing it today! 💪"
? "You're crushing it today!"
: history.length === 0
? "Ready to start your fitness journey? 🚀"
: "Track your gym visits and build streaks! 🔥"}
? "Ready to start your fitness journey?"
: "Track your gym visits and build streaks!"}
</Text>
</View>
apps/mobile/src/app/(tabs)/goals.tsx
+68 -36
View File
@@ -150,21 +150,26 @@ export default function GoalsScreen() {
>
{/* Header */}
<View style={styles.header}>
<View>
<Text style={[typography.h1, { color: colors.textPrimary }]}>
🎯 Fitness Goals
<View style={{ flex: 1 }}>
<Text
style={[
typography.h1,
{ color: colors.textPrimary, fontSize: 32 },
]}
>
Goals
</Text>
<Text
style={[
typography.body,
{ color: colors.textSecondary, marginTop: 4 },
{ color: colors.textSecondary, marginTop: 8 },
]}
>
{activeGoals.length === 0
? "Ready to crush some goals? 💪"
? "Ready to crush some goals?"
: activeGoals.length === 1
? "You're on a mission! Keep it up! 🚀"
: `${activeGoals.length} goals in progress. Legend! ⭐`}
? "You're on a mission! Keep it up!"
: `${activeGoals.length} goals in progress. Let's go!`}
</Text>
</View>
<TouchableOpacity
@@ -183,45 +188,69 @@ export default function GoalsScreen() {
{goals && goals.length > 0 && (
<View style={styles.section}>
<View style={styles.statsRow}>
<MinimalCard variant="bordered" style={styles.statCard}>
<Text style={[typography.stat, { color: colors.primary }]}>
<MinimalCard
variant="elevated"
style={[styles.statCard, { backgroundColor: colors.primary }]}
>
<Text
style={[
typography.statLarge,
{ color: colors.white, fontSize: 36 },
]}
>
{activeGoals.length}
</Text>
<Text
style={[
typography.caption,
{ color: colors.textTertiary, marginTop: 4 },
typography.label,
{ color: "rgba(255,255,255,0.8)", marginTop: 4 },
]}
>
🎯 Active
ACTIVE
</Text>
</MinimalCard>
<MinimalCard variant="bordered" style={styles.statCard}>
<Text style={[typography.stat, { color: colors.success }]}>
<MinimalCard
variant="elevated"
style={[styles.statCard, { backgroundColor: colors.success }]}
>
<Text
style={[
typography.statLarge,
{ color: colors.white, fontSize: 36 },
]}
>
{completedGoals.length}
</Text>
<Text
style={[
typography.caption,
{ color: colors.textTertiary, marginTop: 4 },
typography.label,
{ color: "rgba(255,255,255,0.8)", marginTop: 4 },
]}
>
{completedGoals.length >= 5 ? "🏆" : "✅"} Completed
COMPLETED
</Text>
</MinimalCard>
<MinimalCard variant="bordered" style={styles.statCard}>
<Text style={[typography.stat, { color: colors.textPrimary }]}>
<MinimalCard
variant="elevated"
style={[styles.statCard, { backgroundColor: colors.accent }]}
>
<Text
style={[
typography.statLarge,
{ color: colors.white, fontSize: 36 },
]}
>
{avgProgress}%
</Text>
<Text
style={[
typography.caption,
{ color: colors.textTertiary, marginTop: 4 },
typography.label,
{ color: "rgba(255,255,255,0.8)", marginTop: 4 },
]}
>
{avgProgress >= 75 ? "🔥" : "📊"} Progress
PROGRESS
</Text>
</MinimalCard>
</View>
@@ -287,8 +316,9 @@ export default function GoalsScreen() {
{/* Active Goals */}
<View style={styles.section}>
<SectionHeader
title={`🚀 Active Goals (${activeGoals.length})`}
actionLabel="Add New"
title={`Active Goals (${activeGoals.length})`}
subtitle="Keep pushing forward!"
actionLabel="+ Add New"
onActionPress={() => setIsModalVisible(true)}
/>
{activeGoals.length === 0 ? (
@@ -331,7 +361,8 @@ export default function GoalsScreen() {
{completedGoals.length > 0 && (
<View style={styles.section}>
<SectionHeader
title={`✨ Completed Goals (${completedGoals.length})`}
title={`Completed (${completedGoals.length})`}
subtitle="Great work!"
/>
<View style={styles.goalsList}>
{completedGoals.map((goal) => (
@@ -386,15 +417,15 @@ const styles = StyleSheet.create({
flexDirection: "row",
justifyContent: "space-between",
alignItems: "flex-start",
paddingHorizontal: 24,
paddingHorizontal: 20,
paddingTop: 60,
paddingBottom: 24,
paddingBottom: 20,
},
debugButton: {
padding: 8,
},
section: {
paddingHorizontal: 24,
paddingHorizontal: 20,
marginBottom: 24,
},
statsRow: {
@@ -405,6 +436,7 @@ const styles = StyleSheet.create({
flex: 1,
alignItems: "center",
paddingVertical: 20,
paddingHorizontal: 12,
borderRadius: 20,
},
analyticsHeader: {
@@ -433,18 +465,18 @@ const styles = StyleSheet.create({
},
fabContainer: {
position: "absolute",
right: 24,
right: 20,
bottom: 90,
},
fab: {
width: 56,
height: 56,
borderRadius: 28,
width: 64,
height: 64,
borderRadius: 22,
justifyContent: "center",
alignItems: "center",
shadowOffset: { width: 0, height: 4 },
shadowOpacity: 0.2,
shadowRadius: 8,
elevation: 4,
shadowOffset: { width: 0, height: 6 },
shadowOpacity: 0.35,
shadowRadius: 12,
elevation: 8,
},
});
apps/mobile/src/app/(tabs)/index.tsx
+394 -549
View File
File diff suppressed because it is too large. Load diff
apps/mobile/src/app/(tabs)/profile.tsx
+18 -7
View File
@@ -213,7 +213,10 @@ export default function ProfileScreen() {
contentContainerStyle={styles.content}
>
{/* Header Card */}
<MinimalCard variant="elevated" style={styles.profileCard}>
<MinimalCard
variant="elevated"
style={[styles.profileCard, { backgroundColor: colors.primary }]}
>
<View style={styles.avatarContainer}>
{user?.imageUrl ? (
<Image source={{ uri: user.imageUrl }} style={styles.avatar} />
@@ -221,29 +224,36 @@ export default function ProfileScreen() {
<View
style={[
styles.placeholderAvatar,
{ backgroundColor: colors.primary },
{
backgroundColor: colors.white,
borderWidth: 3,
borderColor: colors.white,
},
]}
>
<Ionicons name="person" size={40} color={colors.white} />
<Ionicons name="person" size={40} color={colors.primary} />
</View>
)}
</View>
<Text
style={[typography.h2, { color: colors.textPrimary, marginTop: 16 }]}
style={[
typography.h1,
{ color: colors.white, marginTop: 16, fontSize: 28 },
]}
>
{user?.fullName || "User"}
</Text>
<Text
style={[
typography.body,
{ color: colors.textSecondary, marginTop: 4 },
{ color: "rgba(255,255,255,0.8)", marginTop: 4 },
]}
>
{user?.primaryEmailAddress?.emailAddress}
</Text>
<Badge
label="Premium Member"
variant="primary"
variant="success"
style={{ marginTop: 12 }}
/>
</MinimalCard>
@@ -580,8 +590,9 @@ const styles = StyleSheet.create({
flex: 1,
},
content: {
padding: 24,
padding: 20,
paddingTop: 60,
paddingBottom: 100,
},
profileCard: {
alignItems: "center",
apps/mobile/src/app/(tabs)/recommendations.tsx
+16 -9
View File
@@ -130,19 +130,24 @@ export default function RecommendationsScreen() {
>
{/* Header */}
<View style={styles.header}>
<View>
<Text style={[typography.h1, { color: colors.textPrimary }]}>
✨ AI Recommendations
<View style={{ flex: 1 }}>
<Text
style={[
typography.h1,
{ color: colors.textPrimary, fontSize: 32 },
]}
>
Recommendations
</Text>
<Text
style={[
typography.body,
{ color: colors.textSecondary, marginTop: 4 },
{ color: colors.textSecondary, marginTop: 8 },
]}
>
{recommendations.length === 0
? "Let's create your perfect plan! 🚀"
: `${recommendations.length} plan${recommendations.length !== 1 ? "s" : ""} ready for you! 💪`}
? "Let's create your perfect plan!"
: `${recommendations.length} plan${recommendations.length !== 1 ? "s" : ""} ready for you!`}
</Text>
</View>
<TouchableOpacity
@@ -152,9 +157,10 @@ export default function RecommendationsScreen() {
>
<IconContainer
variant="colored"
backgroundColor={`${colors.accent}20`}
backgroundColor={colors.accent}
size="lg"
>
<Ionicons name="sparkles" size={24} color={colors.accent} />
<Ionicons name="sparkles" size={24} color={colors.white} />
{unreadCount > 0 && (
<View
style={[
@@ -174,10 +180,11 @@ export default function RecommendationsScreen() {
{/* Generate Button */}
<View style={styles.section}>
<MinimalButton
title="🎯 Generate New Plan"
title="Generate New Plan"
onPress={handleGenerateRecommendation}
variant="primary"
size="lg"
fullWidth
loading={generating}
disabled={generating}
textStyle={{ fontSize: 16 }}