update template

This commit is contained in:
rulingcom 2021-12-28 11:56:15 +00:00
parent 9363789509
commit a7cb5476ab
1 changed files with 98 additions and 98 deletions

View File

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