sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-28 22:42:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merged PR 1928: fix(remission-filter-label): improve filter button label display and default text

Browse Source 
fix(remission-filter-label): improve filter button label display and default text

Add default placeholder text "Abteilung auswählen" when no departments
are selected and implement dynamic label width to prevent text truncation.
The label now expands to full width when displaying placeholder text
and constrains to 8rem when showing selected values.

Ref: #5303
This commit is contained in:
Nino Righi
2025-09-01 16:24:23 +00:00
committed by Andreas Schickinger
parent 298ab1acbe
commit 297ec9100d
3 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
libs/shared/filter/src/lib/menus/input-menu/input-menu-button.component.html
View File

@@ -10,9 +10,13 @@
[attr.data-what]="input.label"
#trigger="cdkOverlayOrigin"
>
<span class="filter-input-button__filter-button-label">{{
label() ?? input.label
}}</span>
<span
class="filter-input-button__filter-button-label"
[class.filter-input-button__filter-button-label-full]="
label() && isDefaultInputState()
"
>{{ label() ?? input.label }}</span
>
<ng-icon
class="filter-input-button__filter-button-icon"
[name]="open() ? 'isaActionChevronUp' : 'isaActionChevronDown'"

6
libs/shared/filter/src/lib/menus/input-menu/input-menu-button.component.scss
View File

@@ -2,7 +2,11 @@
@apply flex flex-row gap-2 items-center justify-center px-6 h-12 bg-isa-neutral-400 rounded-[3.125rem] border border-solid border-transparent;
.filter-input-button__filter-button-label {
@apply text-isa-neutral-600 isa-text-body-2-bold overflow-hidden text-ellipsis whitespace-nowrap max-w-[9rem];
@apply text-isa-neutral-600 isa-text-body-2-bold overflow-hidden text-ellipsis whitespace-nowrap max-w-[8rem];
}
.filter-input-button__filter-button-label-full {
@apply max-w-full;
}
.filter-input-button__filter-button-icon {