{"size": 1968, "ext": "js", "max_stars_repo_path": "mobile/screens/AboutScreen.js", "max_stars_repo_name": "grochavieira/ClubeRecreativo-ProjetoMobile", "max_stars_repo_stars_event_min_datetime": "2020-10-15T10:01:13.000Z", "max_stars_repo_stars_event_max_datetime": "2021-02-01T16:42:59.000Z", "max_issues_repo_path": "mobile/screens/AboutScreen.js", "max_issues_repo_name": "grochavieira/ClubeRecreativo-ProjetoMobile", "max_issues_repo_issues_event_min_datetime": "2020-08-30T01:41:30.000Z", "max_issues_repo_issues_event_max_datetime": "2020-08-30T01:41:30.000Z", "max_forks_repo_path": "mobile/screens/AboutScreen.js", "max_forks_repo_name": "grochavieira/ClubeRecreativo-ProjetoMobile", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": 4, "max_forks_count": null, "avg_line_length": 26.24, "max_line_length": 75, "alphanum_fraction": 0.6163617886}
import React from 'react';
import {View, StyleSheet, Text, ScrollView} from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import IconAwesome from 'react-native-vector-icons/FontAwesome5';

import Colors from '../constants/colors';
import Header from '../components/Header';

export default function AboutScreen() {
  return (
    <LinearGradient
      colors={[Colors.primaria, Colors.secundaria]}
      style={styles.cor}>
      <ScrollView
        contentContainerStyle={{flexGrow: 1}}
        showsVerticalScrollIndicator={false}>
        <View style={styles.principalContainer}>
          <Header textHeader="Sobre" />
          <View style={styles.aboutContainer}>
            <View style={styles.aboutHeader}>
              <IconAwesome name="info" size={24} color={Colors.primaria} />
              <Text style={styles.aboutHeaderText}>INFORMAÇÕES</Text>
            </View>
            <View style={styles.aboutFooter}>
              <Text style={styles.aboutFooterText}>Versão v1.00</Text>
            </View>
          </View>
        </View>
      </ScrollView>
    </LinearGradient>
  );
}

const styles = StyleSheet.create({
  principalContainer: {
    alignItems: 'center',
    justifyContent: 'center',
  },
  cor: {
    flex: 1,
  },
  aboutContainer: {
    width: '80%',
    backgroundColor: 'rgb(255,255,255)',
    borderRadius: 4,
    margin: 10,
    justifyContent: 'space-between',
  },
  aboutHeader: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'center',
    borderBottomWidth: 1,
    borderColor: 'rgba(0, 0, 0, 0.1)',
  },
  aboutFooterText: {
    color: 'black',
    margin: 5,
    fontSize: 15,
  },
  aboutHeaderText: {
    color: Colors.primaria,
    margin: 20,
    fontSize: 15,
    fontWeight: 'bold',
  },
  aboutFooter: {
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'rgba(0, 0, 0, 0.1)',
    borderRadius: 4,
    paddingVertical: 20,
  },
});
