Fix tile card size

This commit is contained in:
Paul Bottein 2024-05-27 13:53:39 +02:00
parent d3c83e0157
commit fb499f09fb
No known key found for this signature in database
2 changed files with 17 additions and 3 deletions

View File

@ -1,3 +1,4 @@
import { mdiSwapHorizontal } from "@mdi/js";
import type { HassEntity } from "home-assistant-js-websocket"; import type { HassEntity } from "home-assistant-js-websocket";
import { import {
CSSResultGroup, CSSResultGroup,
@ -9,7 +10,7 @@ import {
} from "lit"; } from "lit";
import { customElement, property, state } from "lit/decorators"; import { customElement, property, state } from "lit/decorators";
import "../../../components/ha-control-button"; import "../../../components/ha-control-button";
import "../../../components/ha-icon-next"; import "../../../components/ha-svg-icon";
import { HomeAssistant } from "../../../types"; import { HomeAssistant } from "../../../types";
import type { HuiErrorCard } from "../cards/hui-error-card"; import type { HuiErrorCard } from "../cards/hui-error-card";
import { LovelaceCardFeatureLayout } from "../cards/types"; import { LovelaceCardFeatureLayout } from "../cards/types";
@ -86,7 +87,7 @@ export class HuiCardFeatures extends LitElement {
@click=${this._next} @click=${this._next}
.label=${"Next"} .label=${"Next"}
> >
<ha-icon-next></ha-icon-next> <ha-svg-icon .path=${mdiSwapHorizontal}></ha-svg-icon>
</ha-control-button> </ha-control-button>
` `
: nothing} : nothing}
@ -132,6 +133,9 @@ export class HuiCardFeatures extends LitElement {
} }
.next { .next {
flex: none !important; flex: none !important;
--control-button-background-opacity: 0;
--control-button-padding: 0;
width: 32px;
} }
`; `;
} }

View File

@ -126,9 +126,19 @@ export class HuiTileCard extends LitElement implements LovelaceCard {
grid_columns: 2, grid_columns: 2,
grid_rows: 1, grid_rows: 1,
}; };
const featureLayoutType = this._config?.feature_layout?.type || "vertical";
if (this._config?.features?.length) { if (this._config?.features?.length) {
options.grid_rows += Math.ceil((this._config.features.length * 2) / 3); if (featureLayoutType === "compact") {
options.grid_rows += 1;
} else if (featureLayoutType === "horizontal") {
options.grid_rows += 1;
options.grid_columns = 4;
} else {
options.grid_rows += Math.ceil((this._config.features.length * 2) / 3);
}
} }
if (this._config?.vertical) { if (this._config?.vertical) {
options.grid_rows++; options.grid_rows++;
} }