Hi, guys,
i have made a small widget that allows me to display important information of a ShellyPlugS. You can also change various settings for the ShellyPlugS via the widget. For example: Switch on and off, set time for auto on and off timer, activate and deactivate status or power LED etc.
You can also click on the Ip address to open the original ShellyPlugS web interface.
I am happy to share my widget with you. Maybe some of you have a good idea or suggestions for improvement. 
There is one small thing that still doesn’t work perfectly.
If I now enter an Auto On Timer, for example, the toggle button appears to deactivate this function with one click.
Then there should be a 0 in the fields Auto On Timer and Auto Off Timer. But it does not. Only when you enter the page again. This has something to do with the ng-model. I haven’t found a solution yet.
Many greetings
ShellyPlugS.widget.json (7.4 KB)
CSS-Code for the widget.
.area {
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 15px;
text-align: center;
}
.area div {
/*padding: 15px;*/
}
.img {
width: 38px;
}
.padding15px {
padding: 15px;
box-sizing: border-box;
}
.headlineDiv {
border-bottom: 1px solid #4a4a4a;
margin: 5px 0 5px 0;
color: #fff;
}
.headlineHeadline {
padding: 15px 0 15px 0 !important;
}
#shellyContainer p {
margin:0;
padding:0;
}
.margin10px {
margin-bottom:10px;
}
Icons for the Widget
