jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-04-24 21:37:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add a docs icon to the config flow dialog

Browse Source
This commit is contained in:
Paulus Schoutsen 2022-02-10 14:27:38 -08:00
parent ed84ce9692
commit f59cb661cd
1 changed files with 34 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/dialogs/config-flow/dialog-data-entry-flow.ts
View File

@ -1,5 +1,5 @@
import "@material/mwc-button";
import { mdiClose } from "@mdi/js";
import { mdiClose, mdiHelpCircleOutline } from "@mdi/js";
import type { UnsubscribeFunc } from "home-assistant-js-websocket";
import {
css,
@ -33,6 +33,7 @@ import {
} from "../../data/device_registry";
import { haStyleDialog } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
import { documentationUrl } from "../../util/documentation-url";
import { showAlertDialog } from "../generic/show-dialog-box";
import {
DataEntryFlowDialogParams,
@ -231,14 +232,33 @@ class DataEntryFlowDialog extends LitElement {
// to reset the element.
""
: html`
<ha-icon-button
.label=${this.hass.localize(
"ui.panel.config.integrations.config_flow.dismiss"
)}
.path=${mdiClose}
dialogAction="close"
?rtl=${computeRTL(this.hass)}
></ha-icon-button>
<div class="dialog-actions">
${this._step
? html`
<a
href=${documentationUrl(
this.hass,
`/integrations/${this._step.handler}`
)}
target="_blank"
rel="noreferrer noopener"
><ha-icon-button
.label=${"Help"}
.path=${mdiHelpCircleOutline}
?rtl=${computeRTL(this.hass)}
></ha-icon-button
></a>
`
: ""}
<ha-icon-button
.label=${this.hass.localize(
"ui.panel.config.integrations.config_flow.dismiss"
)}
.path=${mdiClose}
dialogAction="close"
?rtl=${computeRTL(this.hass)}
></ha-icon-button>
</div>
${this._step === null
? this._handler
? html`<step-flow-pick-flow
@ -452,16 +472,19 @@ class DataEntryFlowDialog extends LitElement {
ha-dialog {
--dialog-content-padding: 0;
}
ha-icon-button {
.dialog-actions {
padding: 16px;
position: absolute;
top: 0;
right: 0;
}
ha-icon-button[rtl] {
.dialog-actions[rtl] {
right: auto;
left: 0;
}
.dialog-actions > * {
color: var(--secondary-text-color);
}
`,
];
}