{"size": 1139, "ext": "js", "max_stars_repo_path": "app/components/gitHub/RepositoryDetail.js", "max_stars_repo_name": "Bloodleni/react-test-app", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "app/components/gitHub/RepositoryDetail.js", "max_issues_repo_name": "Bloodleni/react-test-app", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "app/components/gitHub/RepositoryDetail.js", "max_forks_repo_name": "Bloodleni/react-test-app", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 18.6721311475, "max_line_length": 56, "alphanum_fraction": 0.636523266}
import React, { Component } from 'react'
import { View, Text } from 'react-native'
import styled from 'styled-components'

const RepositoryContainer = styled.View`
  flex: 1;
  background-color: #fafbfc;
`
const Title = styled.View`
  flex-direction:row;
  padding: 10px;
  justify-content: center;
`

const User = styled.Text`
  font-size: 18px;
  color: #0366d6;
  text-decoration: none;
`

const PathDivider = styled.Text`
  font-size: 18px;
  color: #586069;
  margin: 0 2px;
`

const Name = styled.Text`
  font-size: 18px;
  color: #0366d6;
  text-decoration: none;
  font-weight: bold;
`

const Detail = styled.View`
`

const Description = styled.Text`
  font-size: 16px;
  color: #24292e;
  padding: 10px;
`


export default class RepositoryDetail extends Component{
  render () {
    const { user, name, description } = this.props
    return (
      <RepositoryContainer>
        <Title>
          <User>{user}</User>
          <PathDivider>/</PathDivider>
          <Name>{name}</Name>
        </Title>
        <Detail>
          <Description>{description}</Description>
        </Detail>
      </RepositoryContainer>
    )
  }
}
