Visibility in HABpanel

Apps & Services HABPanel
6

My solution based on simulating the container that can be place around a widget. When placing the widget, you need to make sure that you therefore do not embed it in a container and that you select no background (check the appropriate boxes in settings of widget, I unfortunately do not know their english writing since I am on a german sysem). The widget is then wrapped like this:

<div style="height: 100%">
  <div style="display: flex; height: 100%; align-items: center; justify-items: center; padding: 10px; background: {{itemValue('myswitch') == 'ON' ? 'var(--box-bg,#234)' : 'none'}};">
     <div style="flex: 1" ng-show="itemValue('myswitch') == 'ON'">
       my widget
     </div>
   </div>
 </div>

Use myswitch to hide or show it. This however only works if there is no shadow around the widget (for instance translucent theme)

1 Like