upgrade to native wind v4

This commit is contained in:
Jorrin
2024-01-27 13:53:41 +01:00
parent 26a1b623e7
commit 4c634abc1e
21 changed files with 396 additions and 201 deletions

View File

@@ -1,12 +1,11 @@
import { Image } from 'react-native';
import { Image, Text, View } from 'react-native';
import { TMDB_POSTER_PATH } from '../../constants/General';
import { StyledText, StyledView } from '../ui/Styled';
export default function Item() {
return (
<StyledView className="w-full">
<StyledView className="mb-2 aspect-[9/14] w-full overflow-hidden rounded-2xl">
<View className="w-full">
<View className="mb-2 aspect-[9/14] w-full overflow-hidden rounded-2xl">
<Image
source={{
uri: `${TMDB_POSTER_PATH}/w342//gdIrmf2DdY5mgN6ycVP0XlzKzbE.jpg`,
@@ -14,13 +13,13 @@ export default function Item() {
}}
className="h-full w-full object-cover"
/>
</StyledView>
<StyledText className="font-bold text-white">Hamilton</StyledText>
<StyledView className="flex-row items-center gap-3">
<StyledText className="text-xs text-gray-600">Movie</StyledText>
<StyledView className="h-1 w-1 rounded-3xl bg-gray-600" />
<StyledText className="text-sm text-gray-600">2023</StyledText>
</StyledView>
</StyledView>
</View>
<Text className="font-bold text-white">Hamilton</Text>
<View className="flex-row items-center gap-3">
<Text className="text-xs text-gray-600">Movie</Text>
<View className="h-1 w-1 rounded-3xl bg-gray-600" />
<Text className="text-sm text-gray-600">2023</Text>
</View>
</View>
);
}

View File

@@ -1,4 +1,4 @@
import { StyledText, StyledView } from '../ui/Styled';
import { Text, View } from 'react-native';
type Props = {
title?: React.ReactNode | string;
@@ -8,17 +8,13 @@ type Props = {
export default function ScreenLayout({ title, subtitle, children }: Props) {
return (
<StyledView tw="bg-shade-900 flex-1 p-12">
<View tw="bg-shade-900 flex-1 p-12">
{typeof title === 'string' && (
<StyledText className="text-2xl font-bold text-white">
{title}
</StyledText>
<Text className="text-2xl font-bold text-white">{title}</Text>
)}
{typeof title !== 'string' && title}
<StyledText className="mt-1 text-sm font-bold text-white">
{subtitle}
</StyledText>
<StyledView className="py-3">{children}</StyledView>
</StyledView>
<Text className="mt-1 text-sm font-bold text-white">{subtitle}</Text>
<View className="py-3">{children}</View>
</View>
);
}

View File

@@ -1,6 +0,0 @@
import { styled } from 'nativewind';
import { Text, View } from 'react-native';
export const StyledText = styled(Text, 'text-white');
export const StyledView = styled(View);