Improve home screen design

HansGabriel · Dec 5, 2023 · 3e60b9b · 3e60b9b
1 parent 9301dff
commit 3e60b9b
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 7 deletions.
diff --git a/apps/expo/src/components/HomeTestDisplayCard.tsx b/apps/expo/src/components/HomeTestDisplayCard.tsx
@@ -32,15 +32,15 @@ const HomeTestDisplayCard: FC<Props> = (props) => {
         </View>
         <View className="flex-shrink-0 overflow-hidden p-3">
           <Text
-            className="text-md mb-3 h-10 overflow-hidden truncate font-bold leading-5 text-black"
-            numberOfLines={2}
+            className="text-md mb-3 h-5 overflow-hidden truncate font-bold leading-5 text-black"
+            numberOfLines={1}
             ellipsizeMode="tail"
           >
             {props.title}
           </Text>
           <View className="mt-1 flex-row items-center">
             <Image
-              className="h-3 w-3 flex-shrink-0 rounded-full"
+              className="h-4 w-4 flex-shrink-0 rounded-full"
               source={props.userImageSource}
               testID="user-image"
             />

diff --git a/apps/expo/src/components/top-trekers/TopTrekersHomeCard.tsx b/apps/expo/src/components/top-trekers/TopTrekersHomeCard.tsx
@@ -11,12 +11,12 @@ const TopTrekersHomeCard: FC<Props> = (props) => {
     <View className="h-21 mx-3 w-20 flex-shrink-0 flex-col items-center justify-center p-2">
       <View className="relative h-20 w-20">
         <Image
-          className="absolute top-0 left-0 h-20 w-20 rounded-full"
+          className="absolute left-0 top-0 h-20 w-20 rounded-full"
           source={props.imageSource}
         />
       </View>
       <Text
-        className="text-#212121 font-nunito-bold leading-5.6 self-stretch break-words text-center text-lg tracking-tighter"
+        className="text-#212121 font-nunito-bold leading-5.6 self-stretch break-words text-center tracking-tighter"
         numberOfLines={2}
         ellipsizeMode="tail"
       >

diff --git a/apps/expo/src/components/top-trekers/TopTrekersHomeSection.tsx b/apps/expo/src/components/top-trekers/TopTrekersHomeSection.tsx
@@ -2,7 +2,6 @@ import { View, FlatList, TouchableOpacity, SafeAreaView } from "react-native";
 import TopTrekersHomeCard from "./TopTrekersHomeCard";
 import SectionHeader from "../headers/SectionHeader";
 
-import { getFullName } from "@acme/utils/src/strings";
 import { IMAGE_PLACEHOLDER } from "../../constants";
 import { trpc } from "../../utils/trpc";
 
@@ -57,7 +56,7 @@ const TopTrekersHomeSection: FC = () => {
               imageSource={{
                 uri: item.imageUrl ?? IMAGE_PLACEHOLDER,
               }}
-              name={getFullName(item.firstName, item.lastName)}
+              name={item.firstName}
             />
           </TouchableOpacity>
         )}