UI: Fix namespace picker in small screens (#27728)

* add renderInPlace to namespace picker dropdown, fix styling

* Add changelog
This commit is contained in:
Chelsea Shaw
2024-07-09 15:23:46 -05:00
committed by GitHub
parent 5647ce2bb4
commit 261c9a8fbb
3 changed files with 6 additions and 2 deletions

3
changelog/27728.txt Normal file
View File

@@ -0,0 +1,3 @@
```release-note:bug
ui: fix namespace picker not working when in small screen where the sidebar is collapsed by default.
```

View File

@@ -6,7 +6,6 @@
.namespace-picker { .namespace-picker {
position: relative; position: relative;
color: var(--token-color-palette-neutral-300); color: var(--token-color-palette-neutral-300);
display: flex;
padding: $spacing-4 $spacing-8; padding: $spacing-4 $spacing-8;
width: 100%; width: 100%;
} }
@@ -23,12 +22,14 @@
height: 2rem; height: 2rem;
justify-content: space-between; justify-content: space-between;
margin-right: $spacing-4; margin-right: $spacing-4;
width: 100%;
} }
.namespace-picker-content { .namespace-picker-content {
width: 250px; width: 250px;
max-height: 300px; max-height: 300px;
overflow: auto; overflow: auto;
color: var(--token-color-foreground-primary);
border-radius: $radius; border-radius: $radius;
box-shadow: $box-shadow, $box-shadow-high; box-shadow: $box-shadow, $box-shadow-high;

View File

@@ -4,7 +4,7 @@
~}} ~}}
<div class="namespace-picker" ...attributes> <div class="namespace-picker" ...attributes>
<BasicDropdown @horizontalPosition="left" @verticalPosition="above" as |D|> <BasicDropdown @horizontalPosition="left" @verticalPosition="above" @renderInPlace={{true}} as |D|>
<D.Trigger <D.Trigger
@htmlTag="button" @htmlTag="button"
class="button is-transparent namespace-picker-trigger has-current-color" class="button is-transparent namespace-picker-trigger has-current-color"