99 lines
2.5 KiB
Plaintext
99 lines
2.5 KiB
Plaintext
<div>
|
|
<style type="text/css">
|
|
.weather_widget1{
|
|
background: none;
|
|
display: inline-block;
|
|
width: 100%;
|
|
padding: 1.5em 0.8em;;
|
|
font-size:inherit;
|
|
font-weight: 500;
|
|
background: #accbe7;
|
|
}
|
|
.weather_widget1 .white_text{
|
|
color: #333;
|
|
font-size:inherit;
|
|
overflow-wrap: break-word;
|
|
}
|
|
.weatherICON{
|
|
padding: 0;
|
|
}
|
|
|
|
.weatherTXT{
|
|
font-weight: 700;
|
|
}
|
|
.UviItem{
|
|
font-weight: 700;
|
|
}
|
|
.weatherItem{
|
|
font-weight: 700;
|
|
}
|
|
.weatherBlock{
|
|
margin-bottom:1em;
|
|
}
|
|
@media(min-width:769px){
|
|
.weatherICON img{
|
|
width: 60%;
|
|
}
|
|
.weather_widget1{
|
|
text-align: center;
|
|
}
|
|
}
|
|
@media(max-width:769px){
|
|
.weatherICON img{
|
|
width: 100%;
|
|
}
|
|
.weatherICON {
|
|
padding: 0;
|
|
width: 50%;
|
|
margin: auto;
|
|
}
|
|
.one{
|
|
float: left;
|
|
}
|
|
.two{
|
|
float: right;
|
|
}
|
|
.three{
|
|
clear: both;
|
|
float: left;
|
|
}
|
|
.four{
|
|
float: right;
|
|
}
|
|
.five{
|
|
clear: both;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
<div class="weather_widget1" data-list="weather" data-level="0">
|
|
<div class="col-sm-12 columns weatherBlock">
|
|
<div class="col-sm-4 columns weatherICON">
|
|
<img src="{{wx_svg}}" data-name="wx_svg" title="{{wx_text}}" alt="{{wx_text}}" />
|
|
</div>
|
|
<div class="col-sm-4 columns one">
|
|
<div class="weatherTXT" data-name="wx_text">{{wx_text}}</div>
|
|
<div class="Tempature white_text" data-name="avgt">{{avgt}}<span>℃</span></div>
|
|
</div>
|
|
<div class="col-sm-4 columns two">
|
|
<div class="UviItem">{{uv-head}}</div>
|
|
<div class="UviText white_text" data-name="uvi_text">{{uvi_text}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-12 columns weatherBlock">
|
|
<div class="col-sm-4 columns three">
|
|
<div class="weatherItem">{{relative_humidity-head}}</div>
|
|
<div class="weatherItemNum white_text"><span data-name="rh">{{rh}}</span>%</div>
|
|
</div>
|
|
<div class="col-sm-4 columns four">
|
|
<div class="weatherItem">{{current_wind_speed-head}}</div>
|
|
<div class="weatherItemNum white_text"><span data-name="ws">{{ws}}</span>m/s</div>
|
|
</div>
|
|
<div class="col-sm-4 columns five">
|
|
<div class="weatherItem">{{accumulated_rainfall-head}}</div>
|
|
<div class="weatherItemNum white_text"><span data-name="rain">{{rain}}</span>mm</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|