diff --git a/back/bots/static/screenshots/sign-in.png b/back/bots/static/screenshots/sign-in.png index 9078425..3f5fefe 100644 Binary files a/back/bots/static/screenshots/sign-in.png and b/back/bots/static/screenshots/sign-in.png differ diff --git a/docs/screenshots/login-screen-polish/after-dark-login.png b/docs/screenshots/login-screen-polish/after-dark-login.png new file mode 100644 index 0000000..fbe1cb0 Binary files /dev/null and b/docs/screenshots/login-screen-polish/after-dark-login.png differ diff --git a/docs/screenshots/login-screen-polish/after-light-login.png b/docs/screenshots/login-screen-polish/after-light-login.png new file mode 100644 index 0000000..5461d86 Binary files /dev/null and b/docs/screenshots/login-screen-polish/after-light-login.png differ diff --git a/docs/screenshots/login-screen-polish/before-dark-login.png b/docs/screenshots/login-screen-polish/before-dark-login.png new file mode 100644 index 0000000..936392f Binary files /dev/null and b/docs/screenshots/login-screen-polish/before-dark-login.png differ diff --git a/docs/screenshots/login-screen-polish/before-light-login.png b/docs/screenshots/login-screen-polish/before-light-login.png new file mode 100644 index 0000000..915c020 Binary files /dev/null and b/docs/screenshots/login-screen-polish/before-light-login.png differ diff --git a/front/app/login.tsx b/front/app/login.tsx index 3650843..701de91 100644 --- a/front/app/login.tsx +++ b/front/app/login.tsx @@ -1,6 +1,7 @@ import React, { useEffect, useState } from "react"; import { StyleSheet, Platform, Button, View, Text, Alert, ActivityIndicator } from "react-native"; import { ThemedView } from "@/components/ThemedView"; +import { ThemedText } from "@/components/ThemedText"; import { ThemedTextInput } from "@/components/ThemedTextInput"; import { getTokens, setTokens, TokenData } from "@/api/tokens"; import { useRouter } from "expo-router"; @@ -27,6 +28,7 @@ const LoginScreen = () => { const router = useRouter(); const borderColor = useThemeColor({}, "border"); const textColor = useThemeColor({}, "text"); + const mutedTextColor = useThemeColor({}, "icon"); useEffect(() => { const checkForCachedPin = async () => { @@ -185,11 +187,13 @@ const LoginScreen = () => { )} + + Safe AI tutors for your kids + + - - - + ); @@ -202,8 +206,13 @@ const styles = StyleSheet.create({ mainContent: { flex: 1, justifyContent: "center", - alignItems: "center", - paddingHorizontal: 20, + paddingHorizontal: 24, + gap: 16, + }, + tagline: { + marginTop: 16, + textAlign: "center", + paddingHorizontal: 24, }, devSection: { display: "flex", @@ -218,9 +227,6 @@ const styles = StyleSheet.create({ tokenInput: { marginBottom: 10, }, - appleButton: { - marginTop: 30, - }, }); export default LoginScreen; diff --git a/front/assets/images/apple-sign-in-dark.png b/front/assets/images/apple-sign-in-dark.png deleted file mode 100644 index acc7f85..0000000 Binary files a/front/assets/images/apple-sign-in-dark.png and /dev/null differ diff --git a/front/components/AppleSignInButton.tsx b/front/components/AppleSignInButton.tsx index 4290164..188d23f 100644 --- a/front/components/AppleSignInButton.tsx +++ b/front/components/AppleSignInButton.tsx @@ -1,22 +1,19 @@ import React from 'react'; -import { Pressable, StyleSheet, Image, useColorScheme } from 'react-native'; +import { Pressable, StyleSheet, Image } from 'react-native'; type AppleSignInButtonProps = { onPress: () => void; } export const AppleSignInButton = ({ onPress }: AppleSignInButtonProps) => { - const colorScheme = useColorScheme(); - const imageSource = colorScheme === "dark" ? require("../assets/images/apple-sign-in-dark.png") : require("../assets/images/apple-sign-in.png"); - return ( - [ styles.appleButton, pressed && styles.appleButtonPressed, ]}> diff --git a/front/components/GoogleSignInButton.tsx b/front/components/GoogleSignInButton.tsx index cd206ad..4587e12 100644 --- a/front/components/GoogleSignInButton.tsx +++ b/front/components/GoogleSignInButton.tsx @@ -22,6 +22,7 @@ export const GoogleSignInButton = ({ onPress }: GoogleSignInButtonProps) => { ); @@ -29,14 +30,17 @@ export const GoogleSignInButton = ({ onPress }: GoogleSignInButtonProps) => { const styles = StyleSheet.create({ googleButton: { + width: "100%", + height: 50, flexDirection: "row", alignItems: "center", + justifyContent: "center", }, googleButtonPressed: { opacity: 0.8, }, googleImage: { - width: 300, - height: 71, + width: "100%", + height: "100%", }, }); \ No newline at end of file