Fix tabs styling (#9241)

This commit is contained in:
Bram Kragten 2021-05-25 12:05:20 +02:00 committed by GitHub
parent a4bdc5a05f
commit 0a478ee1da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 9 deletions

View File

@ -117,10 +117,10 @@ export class HaTab extends LitElement {
} }
:host([narrow]) { :host([narrow]) {
padding: 0 16px; min-width: 0;
} display: flex;
:host([narrow]) div { justify-content: center;
padding: 0; overflow: hidden;
} }
`; `;
} }

View File

@ -229,6 +229,10 @@ class HassTabsSubpage extends LitElement {
color: var(--sidebar-text-color); color: var(--sidebar-text-color);
text-decoration: none; text-decoration: none;
} }
:host([narrow]) .toolbar a {
width: 25%;
}
#tabbar { #tabbar {
display: flex; display: flex;
font-size: 14px; font-size: 14px;
@ -242,7 +246,7 @@ class HassTabsSubpage extends LitElement {
box-sizing: border-box; box-sizing: border-box;
background-color: var(--sidebar-background-color); background-color: var(--sidebar-background-color);
border-top: 1px solid var(--divider-color); border-top: 1px solid var(--divider-color);
justify-content: space-between; justify-content: space-around;
z-index: 2; z-index: 2;
font-size: 12px; font-size: 12px;
width: 100%; width: 100%;
@ -258,10 +262,6 @@ class HassTabsSubpage extends LitElement {
min-width: 40px; min-width: 40px;
} }
ha-tab {
display: block;
}
ha-menu-button, ha-menu-button,
ha-icon-button-arrow-prev, ha-icon-button-arrow-prev,
::slotted([slot="toolbar-icon"]) { ::slotted([slot="toolbar-icon"]) {