mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-13 04:16:34 +00:00
History tooltip RTL fix (#24917)
* History tooltip RTL fix * Fix background color
This commit is contained in:
parent
ca642d46cc
commit
7c46d2d2f4
@ -590,6 +590,10 @@ export class HaChartBase extends LitElement {
|
||||
lineStyle: { color: style.getPropertyValue("--info-color") },
|
||||
crossStyle: { color: style.getPropertyValue("--info-color") },
|
||||
},
|
||||
extraCssText:
|
||||
"direction:" +
|
||||
style.getPropertyValue("--direction") +
|
||||
";margin-inline-start:3px;margin-inline-end:8px;",
|
||||
},
|
||||
timeline: {},
|
||||
};
|
||||
|
@ -135,7 +135,7 @@ export class StateHistoryChartLine extends LitElement {
|
||||
seriesIndex: index,
|
||||
value: lastData,
|
||||
// HTML copied from echarts. May change based on options
|
||||
marker: `<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${dataset.color};"></span>`,
|
||||
marker: `<span style="display:inline-block;margin-right:4px;margin-inline-end:4px;margin-inline-start:initial;border-radius:10px;width:10px;height:10px;background-color:${dataset.color};"></span>`,
|
||||
});
|
||||
});
|
||||
const unit = this.unit
|
||||
|
@ -127,7 +127,7 @@ export class StateHistoryChartTimeline extends LitElement {
|
||||
|
||||
private _renderTooltip: TooltipFormatterCallback<TooltipPositionCallbackParams> =
|
||||
(params: TooltipPositionCallbackParams) => {
|
||||
const { value, name, marker, seriesName } = Array.isArray(params)
|
||||
const { value, name, marker, seriesName, color } = Array.isArray(params)
|
||||
? params[0]
|
||||
: params;
|
||||
const title = seriesName
|
||||
@ -138,8 +138,12 @@ export class StateHistoryChartTimeline extends LitElement {
|
||||
"ui.components.history_charts.duration"
|
||||
)}: ${millisecondsToDuration(durationInMs)}`;
|
||||
|
||||
const markerLocalized = !computeRTL(this.hass)
|
||||
? marker
|
||||
: `<span style="direction: rtl;display:inline-block;margin-right:4px;margin-inline-end:4px;border-radius:10px;width:10px;height:10px;background-color:${color};"></span>`;
|
||||
|
||||
const lines = [
|
||||
marker + name,
|
||||
markerLocalized + name,
|
||||
formatDateTimeWithSeconds(
|
||||
new Date(value![1]),
|
||||
this.hass.locale,
|
||||
|
Loading…
x
Reference in New Issue
Block a user