bendtherules/buildit-weather-app
1
0
Fork 0
mirror of https://github.com/bendtherules/buildit-weather-app.git synced 2026-08-19 00:31:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove css classname prefixes + use singleinstancforecast

Browse Source
This commit is contained in:
bendtherules
2018-04-02 02:30:47 +05:30
parent 0a08889bd6
commit 42f9f32a9c
2 changed files with 58 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/Components/SingleDayForecast/Component.tsx
+18 -13
View File
@@ -2,6 +2,7 @@ import * as React from 'react';
import './Component.css';
import '../../../node_modules/open-weather-icons/dist/css/open-weather-icons.css';
import { Forecast5DaysSeperated, ForecaseAtInstance, Utils } from '../../Utils';
import { SingleInstanceForecast } from '../SingleInstanceForecast/Component';
export interface SingleDayForecastProps {
forecastCurrentDay: Array<ForecaseAtInstance>;
@@ -94,42 +95,46 @@ export class SingleDayForecast extends React.Component<SingleDayForecastProps, {
return (
<div className="SingleDayForecast">
<div className="SingleDayForecast-inner">
<div className="forecast-summary">
<div className="summary">
<div className="summary-weather-icon-container">
<div className={`summary-weather-icon owi owi-3x owi-${summary.modeWeatherIcon}`} />
<div className="weather-icon-container">
<div className={`weather-icon owi owi-3x owi-${summary.modeWeatherIcon}`} />
</div>
<div className="summary-date">
<div className="date">
{day.format('Do MMM')}
</div>
<div className="summary-weather-description">
<div className="weather-description">
{Utils.stringToNormalCase(summary.modeWeatherDescription)}
</div>
<div className="summary-temp" title={`Temperature : ${summary.avgTemp.toFixed(0)}°C`}>
<div className="temp-desc">
<div className="temp" title={`Temperature : ${summary.avgTemp.toFixed(0)}°C`}>
<div className="desc">
T :
</div>
<div className="temp-value">
<div className="value">
{summary.avgTemp.toFixed(0)}&deg;C
</div>
<div className="clearfix"/>
</div>
<div className="summary-humidity" title={`Humidity : ${summary.avgHumidity.toFixed(0)} %`}>
<div className="humidity-desc">
<div className="humidity" title={`Humidity : ${summary.avgHumidity.toFixed(0)} %`}>
<div className="desc">
H :
</div>
<div className="humidity-value">
<div className="value">
{summary.avgHumidity.toFixed(0)} %
</div>
<div className="clearfix"/>
</div>
<div className="bottom-dividor" />
</div>
<div className="forecast-details">
BLANK
<div className="details">
{this.props.forecastCurrentDay.map((forecastAtInstance) => {
return <SingleInstanceForecast forecastAtInstance={forecastAtInstance} key={forecastAtInstance.dt} />;
})}
</div>
</div>
</div>