jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-08-02 22:17:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Removes Height, Light Width and Line Color from Sensor (#2122)

Browse Source 
* Sensor fix

* SVG prettified - Use Accent Color only - Dont Calc height

* Prettier
This commit is contained in:
Zack Arnett 2018-11-27 11:17:59 -05:00 committed by Paulus Schoutsen
parent 97f5d8e7e2
commit 4487c3dc1a
1 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/panels/lovelace/cards/hui-sensor-card.js
View File

@ -42,15 +42,11 @@ class HuiSensorCard extends EventsMixin(LitElement) {
const cardConfig = { const cardConfig = {
detail: 1, detail: 1,
icon: false, icon: false,
height: 100,
hours_to_show: 24, hours_to_show: 24,
line_color: "var(--accent-color)",
line_width: 5,
...config, ...config,
}; };
cardConfig.hours_to_show = Number(cardConfig.hours_to_show); cardConfig.hours_to_show = Number(cardConfig.hours_to_show);
cardConfig.height = Number(cardConfig.height); cardConfig.height = Number(cardConfig.height);
cardConfig.line_width = Number(cardConfig.line_width);
cardConfig.detail = cardConfig.detail =
cardConfig.detail === 1 || cardConfig.detail === 2 cardConfig.detail === 1 || cardConfig.detail === 2
? cardConfig.detail ? cardConfig.detail
@ -64,7 +60,7 @@ class HuiSensorCard extends EventsMixin(LitElement) {
return change; return change;
} }
render({ _config, _entity, _line } = this) { render({ _entity, _line } = this) {
return html` return html`
${this._style()} ${this._style()}
<ha-card @click="${this._handleClick}"> <ha-card @click="${this._handleClick}">
@ -85,11 +81,17 @@ class HuiSensorCard extends EventsMixin(LitElement) {
${ ${
_line _line
? svg` ? svg`
<svg width='100%' height='100%' viewBox='0 0 500 ${_config.height}'> <svg width="100%" height="100%" viewBox="0 0 500 100">
<path d=${_line} fill='none' stroke=${_config.line_color} <path
stroke-width=${_config.line_width} d="${_line}"
stroke-linecap='round' stroke-linejoin='round' /> fill="none"
</svg>` stroke="var(--accent-color)"
stroke-width="5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
`
: "" : ""
} }
</div> </div>
@ -144,8 +146,8 @@ class HuiSensorCard extends EventsMixin(LitElement) {
_calcPoints(history, hours, width, detail = 1) { _calcPoints(history, hours, width, detail = 1) {
const coords = []; const coords = [];
const margin = this._config.line_width; const margin = 5;
const height = this._config.height - margin * 4; const height = 80;
width -= margin * 2; width -= margin * 2;
let yRatio = (this._max - this._min) / height; let yRatio = (this._max - this._min) / height;
yRatio = yRatio !== 0 ? yRatio : height; yRatio = yRatio !== 0 ? yRatio : height;