Fix dropdown menu overflow

This commit is contained in:
Chocobozzz 2020-05-20 11:58:03 +02:00
parent 3bf07dd8c2
commit e0433a5f8f
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 8 additions and 6 deletions

View File

@ -12,10 +12,10 @@
<my-feed [syndicationItems]="syndicationItems"></my-feed>
<div ngbDropdown class="d-inline-block ml-4">
<button class="btn btn-sm btn-outline-secondary" id="dropdownSortComments" ngbDropdownToggle i18n>
<button class="btn btn-sm btn-outline-secondary" id="dropdown-sort-comments" ngbDropdownToggle i18n>
SORT BY
</button>
<div ngbDropdownMenu aria-labelledby="dropdownSortComments">
<div ngbDropdownMenu aria-labelledby="dropdown-sort-comments">
<button (click)="handleSortChange('-createdAt')" ngbDropdownItem i18n>Most recent first (default)</button>
<button (click)="handleSortChange('-totalReplies')" ngbDropdownItem i18n>Most replies first</button>
</div>

View File

@ -33,7 +33,7 @@
}
}
#dropdownSortComments {
#dropdown-sort-comments {
font-weight: 600;
text-transform: uppercase;
border: none;

View File

@ -37,6 +37,8 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/';
}
.dropdown-menu {
z-index: z(dropdown) + 1 !important;
border-radius: 3px;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
font-size: 15px;