Content for web and mobile

This commit is contained in:
Stepan 2026-01-06 23:41:08 +01:00
parent 6ced9091b3
commit bc347c3f05
2 changed files with 36 additions and 13 deletions

View File

@ -1,18 +1,41 @@
import { ContentPadding } from "@/constants/theme"; import { ContentPadding } from "@/constants/theme";
import { forwardRef } from "react"; import { forwardRef } from "react";
import { ScrollView, ScrollViewProps, StyleSheet } from "react-native"; import {
Platform,
ScrollView,
ScrollViewProps,
StyleSheet,
} from "react-native";
interface ContentProps extends ScrollViewProps { interface ContentProps extends ScrollViewProps {
children?: React.ReactNode; children?: React.ReactNode;
} }
const Content = forwardRef<ScrollView, ContentProps>(({ children, style, ...rest }, ref) => { const Content = forwardRef<ScrollView, ContentProps>(
({ children, style, ...rest }, ref) => {
return ( return (
<ScrollView ref={ref} contentContainerStyle={[styles.content, style]} {...rest}> <>
{Platform.OS === "web" ? (
<ScrollView
ref={ref}
style={[styles.content, style]}
{...rest}
>
{children} {children}
</ScrollView> </ScrollView>
) : (
<ScrollView
ref={ref}
contentContainerStyle={[styles.content, style]}
{...rest}
>
{children}
</ScrollView>
)}
</>
);
}
); );
});
Content.displayName = "Content"; Content.displayName = "Content";
@ -20,8 +43,8 @@ const styles = StyleSheet.create({
content: { content: {
paddingHorizontal: ContentPadding, paddingHorizontal: ContentPadding,
paddingTop: ContentPadding + 30, paddingTop: ContentPadding + 30,
paddingBottom: ContentPadding + 20 paddingBottom: ContentPadding + 20,
} },
}); });
export default Content; export default Content;

View File

@ -87,9 +87,9 @@ const UserTest = ({ userTest, onPress }: UserTestProps) => {
{userTest.answers.length} Questions {userTest.answers.length} Questions
</ThemedText> </ThemedText>
<ThemedText type="meta"> {testStatus !== TestStatus.InProgress && <ThemedText type="meta">
{successAnswers} / {userTest.answers.length} Correct {successAnswers} / {userTest.answers.length} Correct
</ThemedText> </ThemedText>}
</View> </View>
</Panel> </Panel>
</Pressable> </Pressable>