Energy Management: Make date picker position configurable (header vs floating)

[MarianRychtecky]

What type of request is this?

Enhancement to existing card/feature

Existing card or feature name

{"Card" => "Energy"}

Describe the enhancement

In recent updates of Home Assistant, the date picker was moved from the header to a floating element at the bottom of the screen.

While the new placement may improve accessibility for some users, it reduces usability in other scenarios. I propose making the position configurable, allowing users to choose between the original header placement and the current floating layout.

Use cases

• Graph analysis: Floating element overlaps and obscures parts of graphs, especially on smaller screens
• Frequent time navigation: Header placement allows faster and more natural interaction
• Desktop usage: Bottom floating control requires more cursor movement compared to the header
• User preference: Different users have different ergonomic and workflow preferences

Visual examples

Previous behaviour (preferred in some cases):

• Date picker located in the header
• No overlap with graph content
• Consistent with navigation context

Current behavior:

• Floating element at the bottom of the screen
• Overlaps graph area
• Detached from header/navigation context

Anything else?

Proposed solution

Introduce a configurable option:

• Header (legacy placement)
• Floating bottom (current default)

This preserves the new design while allowing flexibility for different use cases.