Allow custom 2nd line in state-info

[andrey-git]

Allow custom 2nd line in state-info.

To be used in custom UI.

Usage:

<state-info secondary-line><span>Text</span></state-info>

I didn't find a way to change line-height based on existing-vs-missing slot so I used an extra optional attribute for it.

[mention-bot]

@andrey-git, thanks for your PR! By analyzing the history of the files in this pull request, we identified @balloob to be a potential reviewer.

[balloob]

I don't like this. Although I am fine with supporting custom UI, I don't want to complicate our UI so it can be used in custom UI.

[andrey-git]

I could fork the state-info for custom UI, but I think this change is well-contained and might be beneficial for the core UI in the future.

The host([secondary-line]) part could be replaced with a property (like inDialog) or a mixin.

The slot could be unconditional and the caller would have to worry about inDialog compatibility.

I could remove the ::slotted(*) part and style the slot from outside.

It would even be possible to just add the <slot> element and control line-height by overriding --paper-font-common-nowrap

[balloob]

Overriding some mixin so you can use a component sounds like a bad API. The APi itself with in-dialog is already pretty bad. It should have been something as include-last-changed or something.

My concern is that since the default UI is not using this, it will not be tested when we make changes.

[andrey-git]

Here you go - polymer tests setup :)
#255

Tests for this specific element will be written after that PR is submitted :)

[balloob]

okay, you win 😜 Test foundation merged.

[bdurrer]

Haha what a good strategy, tests as candy :-D

[andrey-git]

After #256 is merged I'll add tests to this PR

[balloob]

Merged the test PR.

[andrey-git]

Tests added. Travis run with extra browsers: https://travis-ci.org/andrey-git/home-assistant-polymer/jobs/220284040