diff --git a/src/Components/Home/index.js b/src/Components/Home/index.js index cf767cff..2e8dc410 100644 --- a/src/Components/Home/index.js +++ b/src/Components/Home/index.js @@ -1,9 +1,9 @@ import React from 'react'; +import { TouchableHighlight, Linking } from 'react-native'; import ImageContent from './../ImageContent'; -import SectionHeader from './../SectionHeader'; import SectionSubheader from './../SectionSubheader'; import { getHome } from './../../content/home'; -import { Box, Content, Description } from './styles'; +import { Box, Content, Description, IconContainer, Icon } from './styles'; import ContributionSection from './contribution/ContributionSection'; function Home() { @@ -21,12 +21,33 @@ function Home() { return ( - + ( + + + + Linking.openURL('https://medium.com/anitab-org-open-source')}> + + + Linking.openURL('https://anitab-org.zulipchat.com/#')}> + + + Linking.openURL('https://github.com/anitab-org')}> + + + + {content.introduction.content.par} + + )} + /> + {content.sections.map((section, index) => { return ( renderContent(index, section)} /> ); diff --git a/src/Components/Home/styles.js b/src/Components/Home/styles.js index 2f529647..809c4fc1 100644 --- a/src/Components/Home/styles.js +++ b/src/Components/Home/styles.js @@ -1,14 +1,12 @@ -import { View, Text, StyleSheet } from 'react-native'; +import { View, Text, StyleSheet, Image } from 'react-native'; import { styled } from 'react-native-reflect'; export const Box = styled(View, { flex: 1, width: '80%', flexDirection: 'column', - paddingLeft: 16, - paddingRight: 16, + paddingRight: 32, flexWrap: 'wrap', - marginTop: 32, }); export const Content = styled(View, { @@ -27,6 +25,18 @@ export const Description = styled(Text, { textAlign: 'left', }); +export const IconContainer = styled(View, { + flexDirection: 'row', + marginVertical: 8, + paddingLeft: 16, +}); + +export const Icon = styled(Image, { + marginRight: 8, + width: 32, + height: 32, +}); + const styles = StyleSheet.create({ container: { display: 'flex', diff --git a/src/assets/medium.png b/src/assets/medium.png new file mode 100644 index 00000000..1a5ff7f0 Binary files /dev/null and b/src/assets/medium.png differ diff --git a/src/content/home.js b/src/content/home.js index 1db9532e..a94b19ae 100644 --- a/src/content/home.js +++ b/src/content/home.js @@ -1,4 +1,14 @@ const home = { + introduction: { + title: 'AnitaB.org Open Source', + image: { + source: require('./../assets/landing/landing.png'), + }, + content: { + par: + 'Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quis omnis minus, quisquam ab architecto dolor hic dolores, ducimus explicabo, voluptates fugit dolorum itaque enim nam. Enim nulla, vitae recusandae est pariatur consequuntur aperiam molestiae, minus vero, fugiat ipsam facilis cupiditate alias dolorem mollitia officiis. Excepturi, blanditiis?', + }, + }, sections: [ { title: 'Getting Started',