Live Preview with Expo
Scan the QR code with your camera. Don't have Expo yet? Enter your email or phone number and we'll send a link.
No items found.

Store View

Details

Show off your store and featured products.

Preview this Screen

Scan with your camera to preview on your phone:

Download Expo
Screen Code

-- CODE language-jsx --
import React from 'react';
import Images from '../config/Images';
import {
 CardContainer,
 Container,
 Icon,
 ScreenContainer,
 withTheme,
} from '@draftbit/ui';
import { Image, StyleSheet, Text, View } from 'react-native';
const REPLACE_SCREEN_NAME = props => {
 const { theme } = props;
 return (
   <ScreenContainer scrollable={true} hasSafeArea={false}>
     <Image
       style={styles.imageR8}
       source={Images.Vineyard}
       resizeMode=""cover""
     />
     <Container
       style={styles.containerAo}
       elevation={0}
       useThemeGutterPadding={true}
     >
       <Text
         style={StyleSheet.flatten([
           styles.textEl,
           theme.typography.headline4,
           { color: theme.colors.strong },
         ])}
       >
         Red River Vineyards
       </Text>
       <View style={styles.viewVy}>
         <Icon
           style={styles.iconYH}
           name=""Entypo/location-pin""
           size={16}
           color={theme.colors.light}
         />
         <Text
           style={StyleSheet.flatten([
             styles.text6D,
             theme.typography.caption,
             { color: theme.colors.light },
           ])}
         >
           St Helena, CA 94574
         </Text>
       </View>
       <Text
         style={StyleSheet.flatten([
           styles.textCa,
           theme.typography.subtitle2,
           { color: theme.colors.medium },
         ])}
       >
         Red River Vineyards was founded in 1962, but our legacy dates back to
         the late 1800s when wine grapes were first planted on the Napa Valley
         property that is now our estate home. The depth of this history
         reminds us that as stewards of this land, our family’s commitment to
         its health and vitality will be felt far into the future.
       </Text>
     </Container>
     <Container
       style={styles.containerGI}
       elevation={0}
       useThemeGutterPadding={true}
     >
       <CardContainer
         style={styles.cardContainerM4}
         image=""https://apps-draftbit-com.s3.amazonaws.com/xxQUEDSJ/assets/4d0c765e-2044-4d2c-9337-a566ed575428""
         title=""Cabernet Sauvignon""
         elevation={2}
         numColumns={2}
         aspectRatio={1.5}
         titleCentered={true}
       />
       <CardContainer
         style={styles.cardContainerJj}
         image=""https://apps-draftbit-com.s3.amazonaws.com/xxQUEDSJ/assets/65003eac-1a5d-439b-814d-7e7a17345336""
         title=""Cabernet Franc""
         elevation={2}
         numColumns={2}
         aspectRatio={1.5}
         titleCentered={true}
       />
       <CardContainer
         style={styles.cardContainerCz}
         image=""https://apps-draftbit-com.s3.amazonaws.com/xxQUEDSJ/assets/0d8affff-2c50-4a30-af87-5ce0a34fcb36""
         title=""Sauvignon Blanc""
         elevation={2}
         numColumns={2}
         aspectRatio={1.5}
         titleCentered={true}
       />
       <CardContainer
         style={styles.cardContainerJo}
         image=""https://apps-draftbit-com.s3.amazonaws.com/xxQUEDSJ/assets/88236e08-1747-41bc-9025-5090b6b9a655""
         title=""Vitners Reserve""
         elevation={2}
         numColumns={2}
         aspectRatio={1.5}
         titleCentered={true}
       />
     </Container>
   </ScreenContainer>
 );
};
const styles = StyleSheet.create({
 textEl: {
   width: '100%',
   textAlign: 'auto',
 },
 imageR8: {
   width: '100%',
   height: 300,
 },
 iconYH: {
   width: 16,
   height: 16,
 },
 cardContainerM4: {
   width: 167,
   height: 172,
   marginBottom: 16,
 },
 containerAo: {
   paddingTop: 16,
   paddingBottom: 16,
 },
 text6D: {
   paddingLeft: 4,
   flexGrow: 1,
   textAlign: 'auto',
 },
 viewVy: {
   flexDirection: 'row',
 },
 cardContainerJj: {
   width: 167,
   height: 172,
 },
 containerGI: {
   flexWrap: 'wrap',
   flexDirection: 'row',
   justifyContent: 'space-around',
 },
 textCa: {
   width: '100%',
   marginTop: 8,
   textAlign: 'auto',
 },
 cardContainerCz: {
   width: 167,
   height: 172,
 },
 cardContainerJo: {
   width: 167,
   height: 172,
 },
});
export default withTheme(REPLACE_SCREEN_NAME);

Screen Variants:

Additional Details

Changelog

No items found.

Request access to the private beta.