{"size": 1357, "ext": "js", "max_stars_repo_path": "src/components/Weather/WeatherShowcase.js", "max_stars_repo_name": "MrPoketes/weatherX", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/Weather/WeatherShowcase.js", "max_issues_repo_name": "MrPoketes/weatherX", "max_issues_repo_issues_event_min_datetime": "2021-10-06T19:36:47.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T07:46:25.000Z", "max_forks_repo_path": "src/components/Weather/WeatherShowcase.js", "max_forks_repo_name": "MrPoketes/weatherX", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 3, "max_forks_count": null, "avg_line_length": 30.1555555556, "max_line_length": 111, "alphanum_fraction": 0.5460574797}
import React from "react";
import {View,Text,Image,StyleSheet} from "react-native";

const WeatherShowcase = ({cityName,image,temp,feelsLike,description})=>{
    description = description.charAt(0).toUpperCase()+description.slice(1);
    return(
        <View style={{flex:1,marginTop:"-15%"}}>
            <View style={{flexDirection:"row",marginTop:"30%"}}>
                <Text style={{fontSize:36}}>{cityName} </Text>
            </View>
            <View>
                <Image style={styles.image} source={{uri:`http://openweathermap.org/img/wn/${image}@2x.png`}}/>
                <Text style={styles.temperature}>{Math.round(temp)}C</Text>
            </View>
            <View>
                <Text style={styles.tempFeels}>Feels like {Math.round(feelsLike)}C</Text>
                <Text style={styles.desc}>{description}</Text>
            </View>
        </View>
    )
}
const styles = StyleSheet.create({
    image:{
        width:100,
        height:100,
        marginBottom:"-10%",
        alignSelf:"center",
    },
    temperature:{
        fontSize:30,
        textAlign:"center",
        marginBottom:"5%"
    },
    tempFeels:{
        textAlign:"center",
        fontSize:20,
        marginTop:"2%",
        marginBottom:"2%"
    },
    desc:{
        textAlign:"center",
        fontSize:16
    }
})
export default WeatherShowcase;