mirror of
https://github.com/fergalmoran/argon-react-native.git
synced 2026-01-04 07:36:19 +00:00
unused variables removed
This commit is contained in:
2
App.js
2
App.js
@@ -1,5 +1,5 @@
|
||||
import React from 'react';
|
||||
import { Platform, StatusBar, Image } from 'react-native';
|
||||
import { Image } from 'react-native';
|
||||
import { AppLoading, Asset } from 'expo';
|
||||
import { Block, GalioProvider } from 'galio-framework';
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import React from "react";
|
||||
import { StyleSheet } from "react-native";
|
||||
import PropTypes from 'prop-types';
|
||||
import { Button, Text, theme } from "galio-framework";
|
||||
import { Button } from "galio-framework";
|
||||
|
||||
import argonTheme from "../constants/Theme";
|
||||
|
||||
|
||||
@@ -6,8 +6,6 @@ import { Block, Text, theme } from 'galio-framework';
|
||||
|
||||
import { argonTheme } from '../constants';
|
||||
|
||||
const { width } = Dimensions.get('screen');
|
||||
|
||||
|
||||
class Card extends React.Component {
|
||||
render() {
|
||||
|
||||
@@ -10,8 +10,8 @@ const iOSLogo = require("../assets/imgs/ios.png");
|
||||
const androidLogo = require("../assets/imgs/android.png");
|
||||
// internet imgs
|
||||
|
||||
const ProfilePicture = "https://images.unsplash.com/photo-1519837958954-18e957143de9?fit=crop&w=3034&q=80"
|
||||
//const ProfilePicture = 'https://images.unsplash.com/photo-1492633423870-43d1cd2775eb?fit=crop&w=1650&q=80';
|
||||
const ProfilePicture = 'https://images.unsplash.com/photo-1492633423870-43d1cd2775eb?fit=crop&w=1650&q=80';
|
||||
|
||||
const Viewed = [
|
||||
'https://images.unsplash.com/photo-1501601983405-7c7cabaa1581?fit=crop&w=240&q=80',
|
||||
'https://images.unsplash.com/photo-1543747579-795b9c2c3ada?fit=crop&w=240&q=80',
|
||||
|
||||
@@ -1,16 +1,14 @@
|
||||
import React from "react";
|
||||
import { Easing, Animated } from "react-native";
|
||||
import {
|
||||
createSwitchNavigator,
|
||||
createStackNavigator,
|
||||
createDrawerNavigator,
|
||||
createAppContainer
|
||||
} from "react-navigation";
|
||||
|
||||
import { Block, Text } from "galio-framework";
|
||||
import { Block } from "galio-framework";
|
||||
|
||||
// screens
|
||||
import Components from "../screens/Components";
|
||||
import Home from "../screens/Home";
|
||||
import Onboarding from "../screens/Onboarding";
|
||||
import Pro from "../screens/Pro";
|
||||
|
||||
801
package-lock.json
generated
801
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,676 +0,0 @@
|
||||
import React from "react";
|
||||
import {
|
||||
ScrollView,
|
||||
StyleSheet,
|
||||
TouchableOpacity,
|
||||
TouchableWithoutFeedback,
|
||||
Image,
|
||||
ImageBackground,
|
||||
Dimensions
|
||||
} from "react-native";
|
||||
//galio
|
||||
import { Block, Text, Button as GaButton, theme } from "galio-framework";
|
||||
//argon
|
||||
import { argonTheme, articles, Images, tabs } from "../constants/";
|
||||
import { Button, Select, Icon, Input, Header, Card, Switch } from "../components/";
|
||||
|
||||
const { width } = Dimensions.get("screen");
|
||||
|
||||
const thumbMeasure = (width - 48 - 32) / 3;
|
||||
const cardWidth = width - theme.SIZES.BASE * 2;
|
||||
const categories = [
|
||||
{
|
||||
title: "Music Album",
|
||||
description:
|
||||
"Rock music is a genre of popular music. It developed during and after the 1960s in the United Kingdom.",
|
||||
image:
|
||||
"https://images.unsplash.com/photo-1470225620780-dba8ba36b745?fit=crop&w=840&q=80",
|
||||
price: "$125"
|
||||
},
|
||||
{
|
||||
title: "Events",
|
||||
description:
|
||||
"Rock music is a genre of popular music. It developed during and after the 1960s in the United Kingdom.",
|
||||
image:
|
||||
"https://images.unsplash.com/photo-1543747579-795b9c2c3ada?fit=crop&w=840&q=80",
|
||||
price: "$35"
|
||||
}
|
||||
];
|
||||
|
||||
class Components extends React.Component {
|
||||
state = {
|
||||
"switch-1": true,
|
||||
"switch-2": false
|
||||
};
|
||||
|
||||
toggleSwitch = switchId =>
|
||||
this.setState({ [switchId]: !this.state[switchId] });
|
||||
|
||||
renderProduct = (item, index) => {
|
||||
const { navigation } = this.props;
|
||||
|
||||
return (
|
||||
<TouchableWithoutFeedback
|
||||
style={{ zIndex: 3 }}
|
||||
key={`product-${item.title}`}
|
||||
onPress={() => navigation.navigate("Pro", { product: item })}
|
||||
>
|
||||
<Block center style={styles.productItem}>
|
||||
<Image
|
||||
resizeMode="cover"
|
||||
style={styles.productImage}
|
||||
source={{ uri: item.image }}
|
||||
/>
|
||||
<Block center style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Text
|
||||
center
|
||||
size={16}
|
||||
color={theme.COLORS.MUTED}
|
||||
style={styles.productPrice}
|
||||
>
|
||||
{item.price}
|
||||
</Text>
|
||||
<Text center size={34}>
|
||||
{item.title}
|
||||
</Text>
|
||||
<Text
|
||||
center
|
||||
size={16}
|
||||
color={theme.COLORS.MUTED}
|
||||
style={styles.productDescription}
|
||||
>
|
||||
{item.description}
|
||||
</Text>
|
||||
</Block>
|
||||
</Block>
|
||||
</TouchableWithoutFeedback>
|
||||
);
|
||||
};
|
||||
|
||||
renderButtons = () => {
|
||||
return (
|
||||
<Block flex>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Buttons
|
||||
</Text>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Block center>
|
||||
<Button color="default" style={styles.button}>
|
||||
DEFAULT
|
||||
</Button>
|
||||
</Block>
|
||||
<Block center>
|
||||
<Button
|
||||
color="secondary"
|
||||
textStyle={{ color: "black", fontSize: 12, fontWeight: "700" }}
|
||||
style={styles.button}
|
||||
>
|
||||
SECONDARY
|
||||
</Button>
|
||||
</Block>
|
||||
<Block center>
|
||||
<Button style={styles.button}>PRIMARY</Button>
|
||||
</Block>
|
||||
<Block center>
|
||||
<Button color="info" style={styles.button}>
|
||||
INFO
|
||||
</Button>
|
||||
</Block>
|
||||
<Block center>
|
||||
<Button color="success" style={styles.button}>
|
||||
SUCCESS
|
||||
</Button>
|
||||
</Block>
|
||||
<Block center>
|
||||
<Button color="warning" style={styles.button}>
|
||||
WARNING
|
||||
</Button>
|
||||
</Block>
|
||||
<Block center>
|
||||
<Button color="error" style={styles.button}>
|
||||
ERROR
|
||||
</Button>
|
||||
</Block>
|
||||
<Block row space="evenly">
|
||||
<Block flex left>
|
||||
<Select
|
||||
defaultIndex={1}
|
||||
options={["01", "02", "03", "04", "05"]}
|
||||
/>
|
||||
</Block>
|
||||
<Block flex center>
|
||||
<Button small center color="default" style={styles.optionsButton}>
|
||||
DELETE
|
||||
</Button>
|
||||
</Block>
|
||||
<Block flex={1.25} right>
|
||||
<Button center color="default" style={styles.optionsButton}>
|
||||
SAVE FOR LATER
|
||||
</Button>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderText = () => {
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Typography
|
||||
</Text>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Text
|
||||
h1
|
||||
style={{ marginBottom: theme.SIZES.BASE / 2 }}
|
||||
color={argonTheme.COLORS.DEFAULT}
|
||||
>
|
||||
Heading 1
|
||||
</Text>
|
||||
<Text
|
||||
h2
|
||||
style={{ marginBottom: theme.SIZES.BASE / 2 }}
|
||||
color={argonTheme.COLORS.DEFAULT}
|
||||
>
|
||||
Heading 2
|
||||
</Text>
|
||||
<Text
|
||||
h3
|
||||
style={{ marginBottom: theme.SIZES.BASE / 2 }}
|
||||
color={argonTheme.COLORS.DEFAULT}
|
||||
>
|
||||
Heading 3
|
||||
</Text>
|
||||
<Text
|
||||
h4
|
||||
style={{ marginBottom: theme.SIZES.BASE / 2 }}
|
||||
color={argonTheme.COLORS.DEFAULT}
|
||||
>
|
||||
Heading 4
|
||||
</Text>
|
||||
<Text
|
||||
h5
|
||||
style={{ marginBottom: theme.SIZES.BASE / 2 }}
|
||||
color={argonTheme.COLORS.DEFAULT}
|
||||
>
|
||||
Heading 5
|
||||
</Text>
|
||||
<Text
|
||||
p
|
||||
style={{ marginBottom: theme.SIZES.BASE / 2 }}
|
||||
color={argonTheme.COLORS.DEFAULT}
|
||||
>
|
||||
Paragraph
|
||||
</Text>
|
||||
<Text muted>This is a muted paragraph.</Text>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderInputs = () => {
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Inputs
|
||||
</Text>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Input
|
||||
right
|
||||
placeholder="Regular"
|
||||
iconContent={<Block />}
|
||||
/>
|
||||
</Block>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Input
|
||||
right
|
||||
placeholder="Regular Custom"
|
||||
style={{ borderColor: argonTheme.COLORS.INFO, borderRadius: 4, backgroundColor: '#fff' }}
|
||||
iconContent={<Block />}
|
||||
/>
|
||||
</Block>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Input
|
||||
placeholder="Icon left"
|
||||
iconContent={
|
||||
<Icon
|
||||
size={11}
|
||||
style={{ marginRight: 10 }}
|
||||
color={argonTheme.COLORS.ICON}
|
||||
name="search-zoom-in"
|
||||
family="ArgonExtra"
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</Block>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Input
|
||||
right
|
||||
placeholder="Icon Right"
|
||||
iconContent={
|
||||
<Icon
|
||||
size={11}
|
||||
color={argonTheme.COLORS.ICON}
|
||||
name="search-zoom-in"
|
||||
family="ArgonExtra"
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</Block>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Input
|
||||
success
|
||||
right
|
||||
placeholder="Success"
|
||||
iconContent={
|
||||
<Block middle style={{ width: 20, height: 20, borderRadius: 10, backgroundColor: argonTheme.COLORS.INPUT_SUCCESS }}>
|
||||
<Icon
|
||||
size={11}
|
||||
color={argonTheme.COLORS.ICON}
|
||||
name="g-check"
|
||||
family="ArgonExtra"
|
||||
/>
|
||||
</Block>
|
||||
}
|
||||
/>
|
||||
</Block>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Input
|
||||
error
|
||||
right
|
||||
placeholder="Error Input"
|
||||
iconContent={
|
||||
<Block middle style={{ width: 20, height: 20, borderRadius: 10, backgroundColor: argonTheme.COLORS.INPUT_ERROR }}>
|
||||
<Icon
|
||||
size={11}
|
||||
color={argonTheme.COLORS.ICON}
|
||||
name="support"
|
||||
family="ArgonExtra"
|
||||
/>
|
||||
</Block>
|
||||
}
|
||||
/>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderSwitches = () => {
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Switches
|
||||
</Text>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Block
|
||||
row
|
||||
middle
|
||||
space="between"
|
||||
style={{ marginBottom: theme.SIZES.BASE }}
|
||||
>
|
||||
<Text size={14}>Switch is ON</Text>
|
||||
<Switch
|
||||
value={this.state["switch-1"]}
|
||||
onValueChange={() => this.toggleSwitch("switch-1")}
|
||||
/>
|
||||
</Block>
|
||||
<Block row middle space="between">
|
||||
<Text size={14}>Switch is OFF</Text>
|
||||
<Switch
|
||||
value={this.state["switch-2"]}
|
||||
onValueChange={() => this.toggleSwitch("switch-2")}
|
||||
/>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderTableCell = () => {
|
||||
const { navigation } = this.props;
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Table Cell
|
||||
</Text>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Block style={styles.rows}>
|
||||
<TouchableOpacity onPress={() => navigation.navigate("Pro")}>
|
||||
<Block row middle space="between" style={{ paddingTop: 7 }}>
|
||||
<Text size={14}>Manage Options</Text>
|
||||
<Icon
|
||||
name="stre-right"
|
||||
family="Galio"
|
||||
style={{ paddingRight: 5 }}
|
||||
/>
|
||||
</Block>
|
||||
</TouchableOpacity>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderNavigation = () => {
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Navigation
|
||||
</Text>
|
||||
<Block>
|
||||
<Block style={{ marginBottom: theme.SIZES.BASE }}>
|
||||
<Header back title="Title" navigation={this.props.navigation} />
|
||||
</Block>
|
||||
|
||||
<Block style={{ marginBottom: theme.SIZES.BASE }}>
|
||||
<Header back title="Title" navigation={this.props.navigation} bgColor={argonTheme.COLORS.ACTIVE} titleColor="white" iconColor="white" />
|
||||
</Block>
|
||||
|
||||
<Block style={{ marginBottom: theme.SIZES.BASE }}>
|
||||
<Header search title="Title" navigation={this.props.navigation} />
|
||||
</Block>
|
||||
|
||||
<Block style={{ marginBottom: theme.SIZES.BASE }}>
|
||||
<Header tabs={tabs.categories} search title="Title" navigation={this.props.navigation} />
|
||||
</Block>
|
||||
|
||||
<Block style={{ marginBottom: theme.SIZES.BASE }}>
|
||||
<Header
|
||||
options
|
||||
search
|
||||
title="Title"
|
||||
optionLeft="Option 1"
|
||||
optionRight="Option 2"
|
||||
navigation={this.props.navigation}
|
||||
/>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderSocial = () => {
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Social
|
||||
</Text>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Block row center space="between">
|
||||
<Block flex middle right>
|
||||
<GaButton
|
||||
round
|
||||
onlyIcon
|
||||
shadowless
|
||||
icon="facebook"
|
||||
iconFamily="FontAwesome"
|
||||
iconColor={theme.COLORS.WHITE}
|
||||
iconSize={theme.SIZES.BASE * 1.625}
|
||||
color={theme.COLORS.FACEBOOK}
|
||||
style={styles.social}
|
||||
/>
|
||||
</Block>
|
||||
<Block flex middle center>
|
||||
<GaButton
|
||||
round
|
||||
onlyIcon
|
||||
shadowless
|
||||
icon="twitter"
|
||||
iconFamily="FontAwesome"
|
||||
iconColor={theme.COLORS.WHITE}
|
||||
iconSize={theme.SIZES.BASE * 1.625}
|
||||
color={theme.COLORS.TWITTER}
|
||||
style={[styles.social, styles.shadow]}
|
||||
/>
|
||||
</Block>
|
||||
<Block flex middle left>
|
||||
<GaButton
|
||||
round
|
||||
onlyIcon
|
||||
shadowless
|
||||
icon="dribbble"
|
||||
iconFamily="FontAwesome"
|
||||
iconColor={theme.COLORS.WHITE}
|
||||
iconSize={theme.SIZES.BASE * 1.625}
|
||||
color={theme.COLORS.DRIBBBLE}
|
||||
style={[styles.social, styles.shadow]}
|
||||
/>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderCards = () => {
|
||||
return (
|
||||
<Block flex style={styles.group}>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Cards
|
||||
</Text>
|
||||
<Block flex>
|
||||
<Block style={{ paddingHorizontal: theme.SIZES.BASE }}>
|
||||
<Card item={articles[0]} horizontal />
|
||||
<Block flex row>
|
||||
<Card
|
||||
item={articles[1]}
|
||||
style={{ marginRight: theme.SIZES.BASE }}
|
||||
/>
|
||||
<Card item={articles[2]} />
|
||||
</Block>
|
||||
<Card item={articles[4]} full />
|
||||
<Block flex card shadow style={styles.category}>
|
||||
<ImageBackground
|
||||
source={{ uri: Images.Products["View article"] }}
|
||||
style={[
|
||||
styles.imageBlock,
|
||||
{ width: width - theme.SIZES.BASE * 2, height: 252 }
|
||||
]}
|
||||
imageStyle={{
|
||||
width: width - theme.SIZES.BASE * 2,
|
||||
height: 252
|
||||
}}
|
||||
>
|
||||
<Block style={styles.categoryTitle}>
|
||||
<Text size={18} bold color={theme.COLORS.WHITE}>
|
||||
View article
|
||||
</Text>
|
||||
</Block>
|
||||
</ImageBackground>
|
||||
</Block>
|
||||
</Block>
|
||||
<Block flex style={{ marginTop: theme.SIZES.BASE / 2 }}>
|
||||
<ScrollView
|
||||
horizontal={true}
|
||||
pagingEnabled={true}
|
||||
decelerationRate={0}
|
||||
scrollEventThrottle={16}
|
||||
snapToAlignment="center"
|
||||
showsHorizontalScrollIndicator={false}
|
||||
snapToInterval={cardWidth + theme.SIZES.BASE * 0.375}
|
||||
contentContainerStyle={{
|
||||
paddingHorizontal: theme.SIZES.BASE / 2
|
||||
}}
|
||||
>
|
||||
{categories &&
|
||||
categories.map((item, index) =>
|
||||
this.renderProduct(item, index)
|
||||
)}
|
||||
</ScrollView>
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
renderAlbum = () => {
|
||||
const { navigation } = this.props;
|
||||
|
||||
return (
|
||||
<Block
|
||||
flex
|
||||
style={[styles.group, { paddingBottom: theme.SIZES.BASE * 5 }]}
|
||||
>
|
||||
<Text bold size={16} style={styles.title}>
|
||||
Album
|
||||
</Text>
|
||||
<Block style={{ marginHorizontal: theme.SIZES.BASE * 2 }}>
|
||||
<Block flex right>
|
||||
<Text
|
||||
size={12}
|
||||
color={theme.COLORS.PRIMARY}
|
||||
onPress={() => navigation.navigate("Home")}
|
||||
>
|
||||
View All
|
||||
</Text>
|
||||
</Block>
|
||||
<Block
|
||||
row
|
||||
space="between"
|
||||
style={{ marginTop: theme.SIZES.BASE, flexWrap: "wrap" }}
|
||||
>
|
||||
{Images.Viewed.map((img, index) => (
|
||||
<Block key={`viewed-${img}`} style={styles.shadow}>
|
||||
<Image
|
||||
resizeMode="cover"
|
||||
source={{ uri: img }}
|
||||
style={styles.albumThumb}
|
||||
/>
|
||||
</Block>
|
||||
))}
|
||||
</Block>
|
||||
</Block>
|
||||
</Block>
|
||||
);
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Block flex center>
|
||||
<ScrollView
|
||||
style={styles.components}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
{this.renderButtons()}
|
||||
{this.renderText()}
|
||||
{this.renderInputs()}
|
||||
{this.renderSwitches()}
|
||||
{this.renderTableCell()}
|
||||
{this.renderNavigation()}
|
||||
{this.renderSocial()}
|
||||
{this.renderCards()}
|
||||
{this.renderAlbum()}
|
||||
</ScrollView>
|
||||
</Block>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
title: {
|
||||
paddingBottom: theme.SIZES.BASE,
|
||||
paddingHorizontal: theme.SIZES.BASE * 2,
|
||||
marginTop: 44,
|
||||
color: argonTheme.COLORS.HEADER
|
||||
},
|
||||
group: {
|
||||
paddingTop: theme.SIZES.BASE * 2
|
||||
},
|
||||
shadow: {
|
||||
shadowColor: "black",
|
||||
shadowOffset: { width: 0, height: 2 },
|
||||
shadowRadius: 4,
|
||||
shadowOpacity: 0.2,
|
||||
elevation: 2
|
||||
},
|
||||
button: {
|
||||
marginBottom: theme.SIZES.BASE,
|
||||
width: width - theme.SIZES.BASE * 2
|
||||
},
|
||||
optionsButton: {
|
||||
width: "auto",
|
||||
height: 34,
|
||||
paddingHorizontal: theme.SIZES.BASE,
|
||||
paddingVertical: 10
|
||||
},
|
||||
input: {
|
||||
borderBottomWidth: 1
|
||||
},
|
||||
inputDefault: {
|
||||
borderBottomColor: argonTheme.COLORS.PLACEHOLDER
|
||||
},
|
||||
inputTheme: {
|
||||
borderBottomColor: argonTheme.COLORS.PRIMARY
|
||||
},
|
||||
inputTheme: {
|
||||
borderBottomColor: argonTheme.COLORS.PRIMARY
|
||||
},
|
||||
inputInfo: {
|
||||
borderBottomColor: argonTheme.COLORS.INFO
|
||||
},
|
||||
inputSuccess: {
|
||||
borderBottomColor: argonTheme.COLORS.SUCCESS
|
||||
},
|
||||
inputWarning: {
|
||||
borderBottomColor: argonTheme.COLORS.WARNING
|
||||
},
|
||||
inputDanger: {
|
||||
borderBottomColor: argonTheme.COLORS.ERROR
|
||||
},
|
||||
imageBlock: {
|
||||
overflow: "hidden",
|
||||
borderRadius: 4
|
||||
},
|
||||
rows: {
|
||||
height: theme.SIZES.BASE * 2
|
||||
},
|
||||
social: {
|
||||
width: theme.SIZES.BASE * 3.5,
|
||||
height: theme.SIZES.BASE * 3.5,
|
||||
borderRadius: theme.SIZES.BASE * 1.75,
|
||||
justifyContent: "center"
|
||||
},
|
||||
category: {
|
||||
backgroundColor: theme.COLORS.WHITE,
|
||||
marginVertical: theme.SIZES.BASE / 2,
|
||||
borderWidth: 0
|
||||
},
|
||||
categoryTitle: {
|
||||
height: "100%",
|
||||
paddingHorizontal: theme.SIZES.BASE,
|
||||
backgroundColor: "rgba(0, 0, 0, 0.5)",
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
},
|
||||
albumThumb: {
|
||||
borderRadius: 4,
|
||||
marginVertical: 4,
|
||||
alignSelf: "center",
|
||||
width: thumbMeasure,
|
||||
height: thumbMeasure
|
||||
},
|
||||
productItem: {
|
||||
width: cardWidth - theme.SIZES.BASE * 2,
|
||||
marginHorizontal: theme.SIZES.BASE,
|
||||
shadowColor: "black",
|
||||
shadowOffset: { width: 0, height: 7 },
|
||||
shadowRadius: 10,
|
||||
shadowOpacity: 0.2
|
||||
},
|
||||
productImage: {
|
||||
width: cardWidth - theme.SIZES.BASE,
|
||||
height: cardWidth - theme.SIZES.BASE,
|
||||
borderRadius: 3
|
||||
},
|
||||
productPrice: {
|
||||
paddingTop: theme.SIZES.BASE,
|
||||
paddingBottom: theme.SIZES.BASE / 2
|
||||
},
|
||||
productDescription: {
|
||||
paddingTop: theme.SIZES.BASE
|
||||
// paddingBottom: theme.SIZES.BASE * 2,
|
||||
}
|
||||
});
|
||||
|
||||
export default Components;
|
||||
@@ -1,10 +1,9 @@
|
||||
import React from 'react';
|
||||
import { StyleSheet, Dimensions, ScrollView } from 'react-native';
|
||||
import { Button, Block, Text, Input, theme } from 'galio-framework';
|
||||
import { Block, theme } from 'galio-framework';
|
||||
|
||||
import { Icon, Card } from '../components';
|
||||
import { Card } from '../components';
|
||||
import articles from '../constants/articles';
|
||||
import argonTheme from "../constants/Theme";
|
||||
const { width } = Dimensions.get('screen');
|
||||
|
||||
class Home extends React.Component {
|
||||
|
||||
@@ -13,15 +13,6 @@ const { height, width } = Dimensions.get("screen");
|
||||
import argonTheme from "../constants/Theme";
|
||||
import Images from "../constants/Images";
|
||||
|
||||
/*
|
||||
<Block flex center>
|
||||
<ImageBackground
|
||||
source={Images.Onboarding}
|
||||
style={{ height, width, zIndex: 1 }}
|
||||
/>
|
||||
</Block>
|
||||
*/
|
||||
|
||||
class Onboarding extends React.Component {
|
||||
render() {
|
||||
const { navigation } = this.props;
|
||||
|
||||
Reference in New Issue
Block a user