flan/advanced-camera-card
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ensure drawer content is hidden.

Browse Source
This commit is contained in:
Dermot Duffy
2022-03-26 08:27:30 -07:00
parent b49081c5c8
commit a8770ec61a
3 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/scss/drawer-inject.scss
+3 -3
View File
@@ -20,19 +20,19 @@
} }
#d { #d {
// Adding for control, may not need this? // Need to allow drawer controls to be visible.
overflow: visible; overflow: visible;
visibility: visible; visibility: visible;
} }
:host([location='right']) #d { :host([location=right]) #d {
// Position to the right. // Position to the right.
left: unset; left: unset;
right: 0; right: 0;
transform: translateX(100%); transform: translateX(100%);
} }
:host([location='right'][open]) #d { :host([location=right][open]) #d {
transform: none; transform: none;
box-shadow: 0px 0px 25px 0px black; box-shadow: 0px 0px 25px 0px black;
} }
src/scss/drawer.scss
+4 -4
View File
@@ -13,14 +13,14 @@ div.control-surround {
padding-top: $drawer-padding-extend; padding-top: $drawer-padding-extend;
padding-bottom: $drawer-padding-extend; padding-bottom: $drawer-padding-extend;
} }
:host([location='left']) div.control-surround { :host([location=left]) div.control-surround {
@if $drawer-icon-size < 32 { @if $drawer-icon-size < 32 {
// Ensure the clickable area is at least 32px wide. // Ensure the clickable area is at least 32px wide.
padding-right: calc(32px - $drawer-icon-size); padding-right: calc(32px - $drawer-icon-size);
} }
left: 100%; left: 100%;
} }
:host([location='right']) div.control-surround { :host([location=right]) div.control-surround {
@if $drawer-icon-size < 32 { @if $drawer-icon-size < 32 {
// See note above. // See note above.
padding-left: calc(32px - $drawer-icon-size); padding-left: calc(32px - $drawer-icon-size);
@@ -48,12 +48,12 @@ ha-icon.control {
background-color: black; background-color: black;
} }
:host([location='left']) ha-icon.control { :host([location=left]) ha-icon.control {
border-top-right-radius: $drawer-icon-size; border-top-right-radius: $drawer-icon-size;
border-bottom-right-radius: $drawer-icon-size; border-bottom-right-radius: $drawer-icon-size;
} }
:host([location='right']) ha-icon.control { :host([location=right]) ha-icon.control {
border-top-left-radius: $drawer-icon-size; border-top-left-radius: $drawer-icon-size;
border-bottom-left-radius: $drawer-icon-size; border-bottom-left-radius: $drawer-icon-size;
} }
src/scss/surround.scss
+4
View File
@@ -8,6 +8,10 @@
// Set the drawer relative to this host. // Set the drawer relative to this host.
position: relative; position: relative;
// Hide any content outside the main pane (e.g. side drawers) to ensure the
// user cannot scroll across to the drawers without opening them.
overflow: hidden;
} }
::slotted:not([name]) { ::slotted:not([name]) {