mirror of
https://github.com/home-assistant/frontend
synced 2024-09-28 00:43:28 +02:00
Remove Polymer app layout (#17739)
* Remove legacy app layout * Remove left over ha-app-layout import
This commit is contained in:
parent
d817e92a57
commit
63c3d6406d
@ -82,7 +82,6 @@
|
||||
"@material/web": "=1.0.0-pre.16",
|
||||
"@mdi/js": "7.2.96",
|
||||
"@mdi/svg": "7.2.96",
|
||||
"@polymer/app-layout": "3.1.0",
|
||||
"@polymer/iron-flex-layout": "3.0.1",
|
||||
"@polymer/iron-input": "3.0.1",
|
||||
"@polymer/iron-resizable-behavior": "3.0.1",
|
||||
|
@ -1,103 +0,0 @@
|
||||
/* eslint-plugin-disable lit */
|
||||
/**
|
||||
@license
|
||||
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
||||
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
||||
Code distributed by Google as part of the polymer project is also
|
||||
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
||||
*/
|
||||
/*
|
||||
This code is copied from app-header-layout.
|
||||
'fullbleed' support is removed as Home Assisstant doesn't use it.
|
||||
transform: translate(0) is added.
|
||||
*/
|
||||
/*
|
||||
FIXME(polymer-modulizer): the above comments were extracted
|
||||
from HTML and may be out of place here. Review them and
|
||||
then delete this comment!
|
||||
*/
|
||||
import "@polymer/app-layout/app-header-layout/app-header-layout";
|
||||
import { html } from "@polymer/polymer/lib/utils/html-tag";
|
||||
import "@polymer/polymer/polymer-element";
|
||||
|
||||
class HaAppLayout extends customElements.get("app-header-layout") {
|
||||
static get template() {
|
||||
return html`
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
/**
|
||||
* Force app-header-layout to have its own stacking context so that its parent can
|
||||
* control the stacking of it relative to other elements (e.g. app-drawer-layout).
|
||||
* This could be done using \`isolation: isolate\`, but that's not well supported
|
||||
* across browsers.
|
||||
*/
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#wrapper ::slotted([slot="header"]) {
|
||||
@apply --layout-fixed-top;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#wrapper.initializing ::slotted([slot="header"]) {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
:host([has-scrolling-region]) {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:host([has-scrolling-region]) #wrapper ::slotted([slot="header"]) {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
:host([has-scrolling-region])
|
||||
#wrapper.initializing
|
||||
::slotted([slot="header"]) {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
:host([has-scrolling-region]) #wrapper #contentContainer {
|
||||
@apply --layout-fit;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
:host([has-scrolling-region]) #wrapper.initializing #contentContainer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#contentContainer {
|
||||
/* Create a stacking context here so that all children appear below the header. */
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
/* Using 'transform' will cause 'position: fixed' elements to behave like
|
||||
'position: absolute' relative to this element. */
|
||||
transform: translate(0);
|
||||
margin-left: env(safe-area-inset-left);
|
||||
margin-right: env(safe-area-inset-right);
|
||||
padding-top: env(safe-area-inset-top);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
@media print {
|
||||
:host([has-scrolling-region]) #wrapper #contentContainer {
|
||||
overflow-y: visible;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="wrapper" class="initializing">
|
||||
<slot id="headerSlot" name="header"></slot>
|
||||
|
||||
<div id="contentContainer"><slot></slot></div>
|
||||
<slot id="fab" name="fab"></slot>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
customElements.define("ha-app-layout", HaAppLayout);
|
@ -12,7 +12,6 @@ import { formatDateTime } from "../../common/datetime/format_date_time";
|
||||
import "../../components/ha-card";
|
||||
import "../../components/ha-menu-button";
|
||||
import "../../components/ha-tabs";
|
||||
import "../../layouts/ha-app-layout";
|
||||
import "@polymer/paper-item/paper-item";
|
||||
import "@polymer/paper-item/paper-item-body";
|
||||
import "@polymer/paper-tabs/paper-tab";
|
||||
|
32
yarn.lock
32
yarn.lock
@ -3418,19 +3418,6 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/app-layout@npm:3.1.0":
|
||||
version: 3.1.0
|
||||
resolution: "@polymer/app-layout@npm:3.1.0"
|
||||
dependencies:
|
||||
"@polymer/iron-flex-layout": ^3.0.0-pre.26
|
||||
"@polymer/iron-media-query": ^3.0.0-pre.26
|
||||
"@polymer/iron-resizable-behavior": ^3.0.0-pre.26
|
||||
"@polymer/iron-scroll-target-behavior": ^3.0.0-pre.26
|
||||
"@polymer/polymer": ^3.0.0
|
||||
checksum: 0da7158de7a44db6f25482ef28a75a4a9372706b0d6a0d08f7b45eb4f75d60dd2e769275bf926f986588bc8273545b55f90a68429c6081cb5cb3f16b1e1f9746
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/font-roboto@npm:^3.0.1":
|
||||
version: 3.0.2
|
||||
resolution: "@polymer/font-roboto@npm:3.0.2"
|
||||
@ -3548,15 +3535,6 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/iron-media-query@npm:^3.0.0-pre.26":
|
||||
version: 3.0.1
|
||||
resolution: "@polymer/iron-media-query@npm:3.0.1"
|
||||
dependencies:
|
||||
"@polymer/polymer": ^3.0.0
|
||||
checksum: 15d7c77608925adea02bf12af1f1eb7dd70abc3349bdff88906a3f0fa5bdfe41171bda1b346f9b7ccfd6de9550ac2a34278a74182ce1407097d3972c23984c5e
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/iron-menu-behavior@npm:^3.0.0-pre.26":
|
||||
version: 3.0.2
|
||||
resolution: "@polymer/iron-menu-behavior@npm:3.0.2"
|
||||
@ -3608,15 +3586,6 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/iron-scroll-target-behavior@npm:^3.0.0-pre.26":
|
||||
version: 3.0.1
|
||||
resolution: "@polymer/iron-scroll-target-behavior@npm:3.0.1"
|
||||
dependencies:
|
||||
"@polymer/polymer": ^3.0.0
|
||||
checksum: abf2864aee6049b336aa303110a65cd51cda75247b89edc4f21a6b5290062eb19cd8d2d125198354497df53368bbd305b30d9d31475fd327833cd549d83eb7b9
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/iron-selector@npm:^3.0.0-pre.26":
|
||||
version: 3.0.1
|
||||
resolution: "@polymer/iron-selector@npm:3.0.1"
|
||||
@ -9679,7 +9648,6 @@ __metadata:
|
||||
"@octokit/plugin-retry": 6.0.0
|
||||
"@octokit/rest": 20.0.1
|
||||
"@open-wc/dev-server-hmr": 0.1.4
|
||||
"@polymer/app-layout": 3.1.0
|
||||
"@polymer/iron-flex-layout": 3.0.1
|
||||
"@polymer/iron-input": 3.0.1
|
||||
"@polymer/iron-resizable-behavior": 3.0.1
|
||||
|
Loading…
Reference in New Issue
Block a user