/**
 * Created by BK on 24/06/16.
 *
 * @flow
 */

'use strict';

import React, { Component } from 'react';
import {
    View,
    Text,
} from 'react-native'
import HeaderIOS from '../../common/Header'

export default class TaskView extends Component {
    render() {
        return (
            <View>
                <HeaderIOS
                    title="Me"
                    leftItem={{
                        title: "Back",
                        layout: "icon",
                        icon: "ios-arrow-back",
                        onPress: () => this.props.navigator.pop()
                    }}
                    rightItem={{
                        title: "Settings",
                        layout: "icon",
                        icon: "ios-settings"
                    }}
                />
                <Text>Router worked!</Text>
            </View>
        );
    }
}

@@ -134,139 +134,473 @@
 xt,%0A
-%7D from 'react-native'%0Aimport HeaderIOS from '../../common/Header'%0A%0Aexport default class TaskView extends Component %7B%0A    render() %7B
+    StyleSheet,%0A    Navigator,%0A%7D from 'react-native'%0Aimport GlobalStyles from '../../common/GlobalStyles'%0Aimport HeaderIOS from '../../common/Header'%0A%0Aexport type Task = %7B%0A    title: string,%0A    desc: string,%0A    reward: string,%0A    complete: string,%0A%7D%0A%0Atype Props = %7B%0A    task: Task,%0A    navigator: Navigator,%0A%7D%0A%0Aexport default class TaskView extends Component %7B%0A    props: Props;%0A%0A    render() %7B%0A        //const %7Btitle, desc, reward, complete%7D = this.props.task;%0A
 %0A   
@@ -690,10 +690,12 @@
 le=%22
-Me
+Task
 %22%0A  
@@ -960,152 +960,371 @@
     
-    rightItem=%7B%7B%0A                        title: %22Settings%22,%0A                        layout: %22icon%22,%0A                        icon: %22ios-settings%22
+/%3E%0A                %3CView style=%7BGlobalStyles.contentWrapper%7D%3E%0A                    %3CView style=%7Bstyles.taskSummary%7D%3E%0A                        %3CText style=%7B%5BGlobalStyles.sectionHeader, styles.taskTitle%5D%7D%3EtaskTitle%3C/Text%3E%0A                        %3CText style=%7Bstyles.reward%7D%3EtaskReward%3C/Text%3E%0A                        %3CText style=%7Bstyles.complete%7D%3EtaskCompletion%3C/Text%3E
 %0A   
@@ -1332,34 +1332,39 @@
                 
-%7D%7D
+%3C/View%3E
 %0A               
@@ -1368,90 +1368,299 @@
     
-/%3E%0A                %3CText%3ERouter worked!%3C/Text%3E%0A            %3C/View%3E%0A        );%0A    %7D%0A%7D
+    %3CView style=%7Bstyles.desc%7D%3E%0A                        %3CText style=%7BGlobalStyles.sectionHeader%7D%3EDescription%3C/Text%3E%0A                    %3C/View%3E%0A                %3C/View%3E%0A            %3C/View%3E%0A        );%0A    %7D%0A%7D%0A%0Aconst styles = StyleSheet.create(%7B%0A    taskSummary: %7B%0A    %7D,%0A    taskTitle: %7B%0A    %7D,%0A%7D)
 %0A

Implement basic layout and styling for TaskView