[Pro][Dashboard] SmartDash - a dashboard for Homey

Hello,

in devices i haven’t any insight avaible.

and when i try to put insight i have a msg : Warning - null

you have checked on multiple devices?

no just one

ok, check many types. What is your smarphone? Android or Ios (Ios version is coming in apple store)?

i have the dash on android and on nspanel

Ah OK! With nspanel is more simple make testing.
Tomorrow i try to release a test app for checking some things

ok perfect

Is it maybe an option to have custom CSS:

on setting level (for all panels/widgets)
on panel screen so the CSS is for widgets in that specific panel
on widget level to have 1 widget customized

It was the first time. I think it is after every homey reboot, because from what others said and in my case it happened after reboot due to wifi connection broke.

The css is great!

Few commments from a quick testing:

  1. add the manual you made here to the app css window itself
  2. consider css window for each widget rather than one window for all where you address the widget by _x_y. The widget _x_y may be automatically added and we may not even know how you call them. We then may just write the subclasses like .body, .state etc. It will also reduce amount of trials and errors.
  3. seems that some settings are overrided by css and some override the css formating. The custom css should be always overriding the preset options. I am not able to e.g. get rid of the border shadow at the bottom of the widget …

BR
Tomas

1 Like

I release an update, for nspanel, after install, go in a devices, select a device and check if now the insights infos are present. Example:

  1. once the system is stable I insert the guide.
  2. Yes, is a good solution for the problem! :+1:
  3. MMM, is strange, if i add
    #widget_0_8 .content { box-shadow: none; border-radius: 0 }
    it work. For some params can be necessary add !important

I have some YES/NO variables in my homey. The value is set by some complicated flows.

It is possible to change variables by creating a generic button on a panel. But touching the button will change the variable. I don’t want that.

I just want to see the state of the variable and set the color of the square base on that.

If VARIABLE = yes. → background-color: green
If VARIABLE = no. → background-color: red

Simple solution:
In homey create an virtual device and update the status on variable changing!
In smartdash use css to change background color (see sample code)

In next update i move css at widget level, no more need to indicate the id

Hello

I don’t see any insight info in devices

Sorry

Yahoo Mail : Recherchez, organisez, maîtrisez

I made another testing. You were right @diapolon , I just didnt use correct css command…

Anyway, i managed basically anything I wanted to try. Beside basics like transparent background and different text colors etc. to make icons bigger (by font-size), move name to the bottom (padding-top), make status disappear (opacity) etc.

Only thing i cannot change now is the icon itself to a custom image.

I noticed that when you have a lot of css and want to put 1 command per line to make it easy to read, the box does not provide a sidebar and eventually you get your virtual keyboard over the css. Thats something that could be fixed to make the experience more seamless.

BR
Tomas

Sandro,

Could you share some examples ?
I;m not a good enough programmer to figure it out my self.

I have two backdoors with a door sensor on both doors.

I’ve put them in my first panel as a 0,5x0,5 widget.
I want to:

  • get rid off all text and icon.
  • have the widget completely invisible when the sensor is off ( alarm_state = false door closed)
  • see the widget pop up in red (no icon/no text) when alarm_state = true (so change background to red)

This way I want to create 6 0,5x0,5 widgets on the first line of my panel to show status of doors and my security cams and the gardena garden watering. (When the garden is being watered by gardena the button should show up in blue)

You can use something like this

#widget_0_14 .content { background-color: transparent; color: transparent !important }
#widget_0_14.on .content { background-color: red }
#widget_0_14 .content .state { display: none }

Replace 0 with correct panel and 14 with correct widget.
This work if the widget is a socket or light.
If you use another type maybe need adjust

EDIT: work also with genericCapability widget if the capability is on/off

The icons are mid font icon (material design icons)