Your music, beautifully tracked. All yours. (coming soon) teal.fm
teal-fm atproto

update font thicknesses b/c ios safari

+25 -25
+4 -4
apps/amethyst/app/auth/login.tsx
··· 23 23 const handleLogin = async () => { 24 24 if (!handle) { 25 25 setErr("Please enter a handle"); 26 - return 26 + return; 27 27 } 28 28 29 29 setIsLoading(true); ··· 71 71 <View className="flex items-center"> 72 72 <Icon icon={AtSign} className="color-bsky" name="at" size={64} /> 73 73 </View> 74 - <Text className="text-3xl font-semibold text-center text-foreground"> 74 + <Text className="text-3xl text-center text-foreground"> 75 75 Sign in with your PDS 76 76 </Text> 77 77 <View> ··· 118 118 > 119 119 {isRedirecting ? ( 120 120 <> 121 - <Text className="font-semibold text-lg">Redirecting</Text> 121 + <Text className="text-lg">Redirecting</Text> 122 122 <Icon icon={Check} /> 123 123 </> 124 124 ) : ( 125 125 <> 126 - <Text className="font-semibold text-lg">Login</Text> 126 + <Text className="text-lg">Sign in</Text> 127 127 <Icon icon={ChevronRight} /> 128 128 </> 129 129 )}
+1 -1
apps/amethyst/app/auth/logoutModal.tsx
··· 32 32 router.navigate("/"); 33 33 }} 34 34 > 35 - <Text className="font-semibold text-lg">Sign out</Text> 35 + <Text className="text-lg">Sign out</Text> 36 36 </Button> 37 37 38 38 {/* Use a light status bar on iOS to account for the black space above the modal */}
+2 -2
apps/amethyst/app/auth/options.tsx
··· 16 16 }} 17 17 /> 18 18 <View className="gap-2"> 19 - <Text className="text-5xl font-semibold text-center text-foreground"> 19 + <Text className="text-5xl text-center text-foreground"> 20 20 Get started with 21 21 </Text> 22 - <Text className="text-center text-5xl font-semibold text-foreground"> 22 + <Text className="text-center text-5xl text-foreground"> 23 23 teal 24 24 <Text className="text-5xl font-serif-old-italic">.fm</Text> 25 25 </Text>
+18 -18
apps/amethyst/app/auth/signup.tsx
··· 4 4 import { Text } from "@/components/ui/text"; 5 5 import { Button } from "@/components/ui/button"; 6 6 import { Icon } from "@/lib/icons/iconWithClassName"; 7 - import { ArrowRight } from "lucide-react-native"; 7 + import { ArrowRight, AtSignIcon } from "lucide-react-native"; 8 8 9 9 import { Stack, router } from "expo-router"; 10 10 import { FontAwesome6 } from "@expo/vector-icons"; ··· 19 19 headerShown: false, 20 20 }} 21 21 /> 22 - <View className="flex-1 justify-center p-8 gap-4 pb-32 w-screen max-w-screen-md"> 23 - <Text className="text-4xl font-semibold text-center text-foreground"> 24 - Sign up with{" "} 22 + <View className="flex-1 justify-center p-8 gap-4 pb-32 w-screen max-w-md"> 23 + <Text className="text-3xl text-center text-foreground -mb-2"> 24 + Sign up via{" "} 25 25 <Icon 26 - icon={FontAwesome6} 27 - className="color-bsky" 28 - name="bluesky" 29 - size={28} 26 + icon={AtSignIcon} 27 + className="color-bsky inline mb-2" 28 + size={32} 30 29 />{" "} 31 - Bluesky 30 + ATProto 31 + </Text> 32 + <Text className="text-foreground text-xl text-center"> 33 + No account? No problem. 32 34 </Text> 33 35 <View className="flex flex-col justify-center items-center"> 34 - <Text className="text-foreground text-lg"> 35 - No account? That's fine. 36 - </Text> 37 - <Text className="text-foreground text-center text-lg"> 38 - Sign up for Bluesky, then return here to sign in. 36 + <Text className="mb-2 text-center -mx-3"> 37 + To use teal.fm, you’ll need a PDS—your personal data storage on the 38 + AT Protocol. Signing up with Bluesky is a great way to begin. 39 39 </Text> 40 - <Text className="text-muted-foreground mt-2 mb-4 text-center text-xs"> 41 - You'll need a PDS to use teal.fm. Bluesky is a good way to get one. 40 + <Text className="text-center mb-4 text-xs text-muted-foreground"> 41 + Sign up with Bluesky, then return here to start exploring. 42 42 </Text> 43 43 {/* on click, open tab, then in the background navigate to /login */} 44 44 <Button ··· 53 53 router.replace("/auth/login"); 54 54 }, 1000); 55 55 }} 56 - className="flex flex-row justify-center items-center gap-2" 56 + className="flex flex-row justify-center items-center gap-2 bg-bsky" 57 57 > 58 - <Text className="text-sm ml-2 text-secondary">Go</Text> 58 + <Text className="text-sm ml-2 text-secondary">To Bluesky</Text> 59 59 <Icon icon={ArrowRight} /> 60 60 </Button> 61 61 </View>