Compare commits

...

7 Commits

Author SHA1 Message Date
Wendelin
c93f33cffa Fix prettier 2026-02-18 16:08:30 +01:00
Wendelin
4fda5794ff Apply suggestion from @wendevlin 2026-02-18 16:04:39 +01:00
Aidan Timson
2bcf08f7fc Add padding to combo box 2026-02-18 14:15:21 +00:00
Aidan Timson
1c8bf8d17f Restore original functionality, keep visual indicator 2026-02-18 14:10:57 +00:00
Aidan Timson
c92f102136 Fix rounded corners 2026-02-18 11:26:18 +00:00
Aidan Timson
8ff4d1ee42 Remove locks 2026-02-18 11:12:51 +00:00
Aidan Timson
7de199d81a Add drag handle to bottom sheet 2026-02-18 11:08:09 +00:00
3 changed files with 35 additions and 1 deletions

View File

@@ -220,6 +220,7 @@ export class HaAdaptiveDialog extends LitElement {
return [
css`
ha-bottom-sheet {
--ha-bottom-sheet-border-radius: var(--ha-border-radius-2xl);
--ha-bottom-sheet-surface-background: var(
--ha-dialog-surface-background,
var(--card-background-color, var(--ha-color-surface-default))

View File

@@ -194,6 +194,9 @@ export class HaBottomSheet extends ScrollableFadeMixin(LitElement) {
without-header
@touchstart=${this._handleTouchStart}
>
<div class="handle-wrapper" aria-hidden="true">
<div class="handle"></div>
</div>
<slot name="header"></slot>
<div class="content-wrapper">
<div id="body" class="body ha-scrollbar">
@@ -369,6 +372,7 @@ export class HaBottomSheet extends ScrollableFadeMixin(LitElement) {
wa-drawer::part(body) {
max-width: var(--ha-bottom-sheet-max-width);
width: 100%;
position: relative;
border-top-left-radius: var(
--ha-bottom-sheet-border-radius,
var(--ha-dialog-border-radius, var(--ha-border-radius-2xl))
@@ -391,6 +395,35 @@ export class HaBottomSheet extends ScrollableFadeMixin(LitElement) {
display: flex;
flex-direction: column;
}
:host([prevent-scrim-close]) .handle-wrapper {
display: none;
}
.handle-wrapper {
position: absolute;
top: 0;
inset-inline-start: 0;
width: 100%;
padding-bottom: 2px;
display: flex;
justify-content: center;
align-items: center;
pointer-events: none;
z-index: 1;
}
.handle-wrapper .handle {
height: 20px;
width: 200px;
display: flex;
justify-content: center;
align-items: center;
}
.handle-wrapper .handle::after {
content: "";
border-radius: var(--ha-border-radius-md);
height: 4px;
background: var(--ha-bottom-sheet-handle-color, var(--divider-color));
width: 80px;
}
.content-wrapper {
position: relative;
flex: 1;

View File

@@ -796,7 +796,7 @@ export class HaPickerComboBox extends ScrollableFadeMixin(LitElement) {
:host {
display: flex;
flex-direction: column;
padding-top: var(--ha-space-3);
padding-top: var(--ha-space-5);
flex: 1;
}