diff --git a/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts b/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts index 3812e75059..3072fecf02 100644 --- a/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts +++ b/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts @@ -1,3 +1,5 @@ +import { mdiInformation } from "@mdi/js"; +import "@polymer/paper-tooltip"; import { UnsubscribeFunc } from "home-assistant-js-websocket"; import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; import { customElement, property, state } from "lit/decorators"; @@ -5,6 +7,7 @@ import { styleMap } from "lit/directives/style-map"; import { round } from "../../../../common/number/round"; import "../../../../components/ha-card"; import "../../../../components/ha-gauge"; +import "../../../../components/ha-svg-icon"; import { EnergyData, energySourcesByType, @@ -118,8 +121,14 @@ class HuiEnergyCarbonGaugeCard } return html` - ${value !== undefined + + + + This card represents how much of the energy consumed by your home was + generated using non-fossil fuels like solar, wind and nuclear. + + + ${value !== undefined ? html` + + + This card represents your energy dependency. If it's green, it means + you produced more energy than that you consumed from the grid. If it's + in the red, it means that you relied on the grid for part of your + home's energy consumption. + ${value !== undefined ? html` + + + This card represents how much of the solar energy was not used by your + home and was returned to the grid. If you frequently return a lot, try + to conserve this energy by installing a battery or buying an electric + car to charge. + ${value !== undefined ? html`