refactor(onboarding): Enhanced checkbox visibility in the onboarding …

…process
synonymdev · Dec 21, 2023 · 86ca487 · 86ca487
1 parent 512ad06
commit 86ca487
Showing 1 changed file with 16 additions and 10 deletions.
diff --git a/src/components/CheckButton.tsx b/src/components/CheckButton.tsx
@@ -36,12 +36,8 @@ const CheckButton = memo(
 						)}
 					</View>
 				</View>
-				<View style={styles.rightColumn}>
-					<Checkmark
-						color={checked ? 'brand' : 'gray4'}
-						height={30}
-						width={30}
-					/>
+				<View style={checked ? styles.rightColumn : styles.noCheckRightColumn}>
+					{checked && <Checkmark color={'brand'} height={20} width={20} />}
 				</View>
 			</TouchableOpacity>
 		);
@@ -63,10 +59,20 @@ const styles = StyleSheet.create({
 		alignItems: 'center',
 	},
 	rightColumn: {
-		flex: 1,
-		justifyContent: 'center',
-		alignItems: 'flex-end',
-		marginLeft: 'auto',
+		backgroundColor: '#522100',
+		borderRadius: 8,
+		padding: 5,
+		borderColor: '#FF6600',
+		borderWidth: 1,
+		marginLeft: 35,
+	},
+	noCheckRightColumn: {
+		backgroundColor: '#1a1a1a',
+		borderRadius: 8,
+		padding: 15,
+		borderColor: '#515151',
+		borderWidth: 1,
+		marginLeft: 35,
 	},
 });