jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-25 18:26:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Set the max number of columns to 3 for area dashboard (#24802)

Browse Source 
* Set the max number of columns to 4 for area dashboard

* Set it to 3
This commit is contained in:
Paul Bottein 2025-03-27 16:39:47 +01:00 committed by Bram Kragten
parent 94ee99160b
commit 23229b3e3b
2 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/panels/lovelace/strategies/areas/area-view-strategy.ts
View File

@ -1,5 +1,6 @@
import { ReactiveElement } from "lit"; import { ReactiveElement } from "lit";
import { customElement } from "lit/decorators"; import { customElement } from "lit/decorators";
import { clamp } from "../../../../common/number/clamp";
import type { LovelaceBadgeConfig } from "../../../../data/lovelace/config/badge"; import type { LovelaceBadgeConfig } from "../../../../data/lovelace/config/badge";
import type { LovelaceCardConfig } from "../../../../data/lovelace/config/card"; import type { LovelaceCardConfig } from "../../../../data/lovelace/config/card";
import type { LovelaceSectionRawConfig } from "../../../../data/lovelace/config/section"; import type { LovelaceSectionRawConfig } from "../../../../data/lovelace/config/section";
@ -144,7 +145,10 @@ export class AreaViewStrategy extends ReactiveElement {
}); });
} }
// Take the full width if there is only one section to avoid misalignment between cards and header // Allow between 2 and 3 columns (the max should be set to define the width of the header)
const maxColumns = clamp(sections.length, 2, 3);
// Take the full width if there is only one section to avoid narrow header on desktop
if (sections.length === 1) { if (sections.length === 1) {
sections[0].column_span = 2; sections[0].column_span = 2;
} }
@ -160,7 +164,7 @@ export class AreaViewStrategy extends ReactiveElement {
content: `## ${area.name}`, content: `## ${area.name}`,
}, },
}, },
max_columns: 2, max_columns: maxColumns,
sections: sections, sections: sections,
badges: badges, badges: badges,
}; };

2
src/panels/lovelace/strategies/areas/areas-overview-view-strategy.ts
View File

@ -95,7 +95,7 @@ export class AreasOverviewViewStrategy extends ReactiveElement {
return { return {
type: "sections", type: "sections",
max_columns: 2, max_columns: 3,
sections: areaSections, sections: areaSections,
}; };
} }