Use mwc-drawer (#10335

* Use mwc-drawer

* Update home-assistant-main.ts

* Implement top-app-bar

* Update home-assistant-main.ts

* update hui-root

* WIP

tabs don't work yet

* migrate most panels

* fixed

* notifications-drawer

* developer tools

* lovelace

* Update hui-root.ts

* Update hui-root.ts

* Update notification-drawer.ts

* fix dev tools

* Update ha-panel-developer-tools.ts

src/components/ha-drawer.ts

@@ -0,0 +1,22 @@
+import { DrawerBase } from "@material/mwc-drawer/mwc-drawer-base";
+import { styles } from "@material/mwc-drawer/mwc-drawer.css";
+import { css } from "lit";
+import { customElement } from "lit/decorators";
+
+@customElement("ha-drawer")
+export class HaDrawer extends DrawerBase {
+  static override styles = [
+    styles,
+    css`
+      .mdc-drawer {
+        top: 0;
+      }
+    `,
+  ];
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "ha-drawer": HaDrawer;
+  }
+}