ui tweaks

components/shared/HeaderTemplate.tsx

@@ -10,27 +10,29 @@ const HeaderTemplate = (props: {
   link?: React.ReactNode;
 }) => {
   const { user, profileData } = useAuthContext();
+
+  const headerHeight:number = 80;
   return (
     <View row centerV marginV-15>
       <ImageBackground
       source={require("../../assets/images/profile-picture.png")}
         style={{
-          width: 65,
-          height: 65,
+          height: headerHeight,
+          aspectRatio: 1,
           borderRadius: 22,
           overflow: "hidden",
           marginRight: 20,
         }}
       />
-      <View>
+      <View gap-3>
         {props.isWelcome && (
-          <Text text70L>Welcome, {profileData?.firstName}!</Text>
+          <Text text70L style={{fontSize: 17, fontFamily: "Manrope_400Regular"}}>Welcome, {profileData?.firstName}!</Text>
         )}
-        <Text text70B style={{ fontSize: 17 }}>
+        <Text text70B style={{ fontSize: 18, fontFamily: "Manrope_700Bold" }}>
           {props.message}
         </Text>
         {props.children && <View>{props.children}</View>}
-        {props.link && <View>{props.link}</View>}
+        {props.link && <View marginT-8>{props.link}</View>}
       </View>
     </View>
   );

components/shared/PointsSlider.tsx

@@ -20,9 +20,9 @@ const PointsSlider = (props: {
           maximumValue={100}
         />
         <View row spread>
-          <Text>0</Text>
-          <Text>50</Text>
-          <Text>100</Text>
+          <Text style={{fontSize: 13, color: '#858585'}}>0</Text>
+          <Text style={{fontSize: 13, color: '#858585'}}>50</Text>
+          <Text style={{fontSize: 13, color: '#858585'}}>100</Text>
         </View>
       </View>
       <View style={{ marginLeft: "auto" }}>