This commit is contained in:
Zack Arnett 2020-09-06 01:43:05 -05:00
parent 7a73cf444e
commit 96d220468e
4 changed files with 80 additions and 54 deletions

View File

@ -10,6 +10,7 @@ import {
property,
TemplateResult,
} from "lit-element";
import { classMap } from "lit-html/directives/class-map";
import { isComponentLoaded } from "../../../common/config/is_component_loaded";
import "../../../components/ha-card";
import "../../../components/ha-icon-next";
@ -37,7 +38,7 @@ class HaConfigDashboard extends LitElement {
protected render(): TemplateResult {
const content = html`
<ha-config-section .narrow=${this.narrow}>
<ha-config-section .isWide=${this.isWide}>
<div slot="header">
${this.hass.localize("ui.panel.config.header")}
</div>
@ -46,36 +47,38 @@ class HaConfigDashboard extends LitElement {
${this.hass.localize("ui.panel.config.introduction")}
</div>
${this.cloudStatus && isComponentLoaded(this.hass, "cloud")
? html`
<div class="content ${classMap({ narrow: this.narrow })}">
${this.cloudStatus && isComponentLoaded(this.hass, "cloud")
? html`
<ha-card class="cloud">
<ha-config-navigation
.hass=${this.hass}
.showAdvanced=${this.showAdvanced}
.pages=${[
{
component: "cloud",
path: "/config/cloud",
translationKey: "ui.panel.config.cloud.caption",
info: this.cloudStatus,
iconPath: mdiCloudLock,
},
]}
></ha-config-navigation>
</ha-card>
`
: ""}
${Object.values(configSections).map(
(section) => html`
<ha-card>
<ha-config-navigation
.hass=${this.hass}
.showAdvanced=${this.showAdvanced}
.pages=${[
{
component: "cloud",
path: "/config/cloud",
translationKey: "ui.panel.config.cloud.caption",
info: this.cloudStatus,
iconPath: mdiCloudLock,
},
]}
.pages=${section}
></ha-config-navigation>
</ha-card>
`
: ""}
${Object.values(configSections).map(
(section) => html`
<ha-card>
<ha-config-navigation
.hass=${this.hass}
.showAdvanced=${this.showAdvanced}
.pages=${section}
></ha-config-navigation>
</ha-card>
`
)}
)}
</div>
${isComponentLoaded(this.hass, "zha")
? html`
<div class="promo-advanced">
@ -174,6 +177,27 @@ class HaConfigDashboard extends LitElement {
.promo-advanced a {
color: var(--secondary-text-color);
}
.content {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0;
}
.content > * {
width: calc(50% - 12px);
margin: 12px 0;
align-self: flex-start;
}
.cloud {
width: 100%;
}
.narrow.content > * {
width: 100%;
}
`,
];
}

View File

@ -1,10 +1,30 @@
import {
mdiAccount,
mdiBadgeAccountHorizontal,
mdiDevices,
mdiHomeAssistant,
mdiInformation,
mdiMapMarkerRadius,
mdiMathLog,
mdiNfcVariant,
mdiPalette,
mdiPencil,
mdiPuzzle,
mdiRobot,
mdiScriptText,
mdiServer,
mdiShape,
mdiSofa,
mdiTools,
mdiViewDashboard,
} from "@mdi/js";
import "@polymer/paper-item/paper-item";
import "@polymer/paper-item/paper-item-body";
import { PolymerElement } from "@polymer/polymer";
import {
customElement,
property,
internalProperty,
property,
PropertyValues,
} from "lit-element";
import { isComponentLoaded } from "../../common/config/is_component_loaded";
@ -14,26 +34,6 @@ import "../../layouts/hass-loading-screen";
import { HassRouterPage, RouterOptions } from "../../layouts/hass-router-page";
import { PageNavigation } from "../../layouts/hass-tabs-subpage";
import { HomeAssistant, Route } from "../../types";
import {
mdiPuzzle,
mdiDevices,
mdiShape,
mdiSofa,
mdiRobot,
mdiPalette,
mdiScriptText,
mdiTools,
mdiViewDashboard,
mdiAccount,
mdiMapMarkerRadius,
mdiBadgeAccountHorizontal,
mdiHomeAssistant,
mdiServer,
mdiInformation,
mdiMathLog,
mdiPencil,
mdiNfcVariant,
} from "@mdi/js";
declare global {
// for fire event
@ -167,8 +167,6 @@ export const configSections: { [name: string]: PageNavigation[] } = {
iconPath: mdiInformation,
core: true,
},
],
advanced: [
{
component: "customize",
path: "/config/customize",

View File

@ -6,12 +6,12 @@ import {
property,
TemplateResult,
} from "lit-element";
import "../../../layouts/hass-tabs-subpage";
import { haStyle } from "../../../resources/styles";
import { HomeAssistant, Route } from "../../../types";
import { configSections } from "../ha-panel-config";
import "./integrations-card";
import "./system-health-card";
import { configSections } from "../ha-panel-config";
import "../../../layouts/hass-tabs-subpage";
const JS_TYPE = __BUILD__;
const JS_VERSION = __VERSION__;
@ -93,10 +93,10 @@ class HaConfigInfo extends LitElement {
>Python 3</a
>,
<a
href="https://www.polymer-project.org"
href="https://lit-element.polymer-project.org/"
target="_blank"
rel="noreferrer"
>Polymer</a
>LitElement</a
>, ${this.hass.localize("ui.panel.config.info.icons_by")}
<a
href="https://www.google.com/design/icons/"

View File

@ -1,20 +1,20 @@
import "../../../components/ha-icon-button";
import "@polymer/paper-item/paper-item";
import "@polymer/paper-item/paper-item-body";
import "../../../components/ha-circular-progress";
import {
css,
CSSResult,
customElement,
html,
internalProperty,
LitElement,
property,
internalProperty,
TemplateResult,
} from "lit-element";
import "../../../components/buttons/ha-call-service-button";
import "../../../components/buttons/ha-progress-button";
import "../../../components/ha-card";
import "../../../components/ha-circular-progress";
import "../../../components/ha-icon-button";
import { domainToName } from "../../../data/integration";
import {
fetchSystemLog,
@ -164,6 +164,10 @@ export class SystemLogCard extends LitElement {
align-items: center;
justify-content: center;
}
.card-actions {
display: flex;
}
`;
}
}