diff --git a/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.html b/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.html index 89be676ce2..60370f8020 100644 --- a/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.html +++ b/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.html @@ -15,7 +15,8 @@ limitations under the License. --> - + + {{ autocompleteHint | translate }} {{ 'queue.queue-required' | translate }} diff --git a/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.scss b/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.scss index 45a4ab9808..ccd90f0806 100644 --- a/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.scss +++ b/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.scss @@ -19,6 +19,7 @@ .mat-option-text { display: inline; } + .queue-option-description { display: block; overflow: hidden; @@ -27,3 +28,27 @@ } } } + +:host ::ng-deep { + .mat-form-field { + .mat-form-field-wrapper { + padding-bottom: 0px; + + .mat-form-field-underline { + position: initial !important; + display: block; + margin-top: -1px; + } + + .mat-form-field-subscript-wrapper, + .mat-form-field-ripple { + position: initial !important; + display: table; + } + + .mat-form-field-subscript-wrapper { + min-height: calc(1em + 1px); + } + } + } +} diff --git a/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.ts b/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.ts index 4b445b5175..13efa2a546 100644 --- a/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.ts +++ b/ui-ngx/src/app/shared/components/queue/queue-autocomplete.component.ts @@ -54,6 +54,9 @@ export class QueueAutocompleteComponent implements ControlValueAccessor, OnInit @Input() requiredText: string; + @Input() + autocompleteHint: string; + private requiredValue: boolean; get required(): boolean { return this.requiredValue;