diff --git a/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts b/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts index cd01ba0190c68b4f9fec34f3e94496e6d86f73aa..1740d7ba39080e17caa742c931fa9267bffaf0a0 100644 --- a/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts +++ b/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts @@ -57,27 +57,27 @@ type TextInputVariants = VariantProps<typeof textInputVariants>; <label *ngIf="showLabel" [for]="id" class="text-md mb-2 block font-medium text-text"> {{ inputLabel }}<ng-container *ngIf="required"><i aria-hidden="true">*</i></ng-container> </label> - <div class="mt-2"> - <div *ngIf="withPrefix" class="pointer-events-none absolute bottom-2 left-2 flex size-6 items-center justify-center"> - <ng-content select="[prefix]" /> - </div> - <input - type="text" - [id]="id" - [formControl]="fieldControl" - [ngClass]="[textInputVariants({ variant }), withPrefix ? 'pl-10' : '', withSuffix ? 'pr-10' : '']" - [placeholder]="placeholder" - [autocomplete]="autocomplete" - [attr.aria-required]="required" - [attr.aria-invalid]="variant === 'error'" - [attr.data-test-id]="_dataTestId + '-text-input'" - (click)="clickEmitter.emit()" - #inputElement - /> - <div *ngIf="withSuffix" class="absolute bottom-2 right-2 flex size-6 items-center justify-center"> - <ng-content select="[suffix]" /> - </div> + + <div *ngIf="withPrefix" class="pointer-events-none absolute bottom-2 left-2 flex size-6 items-center justify-center"> + <ng-content select="[prefix]" /> + </div> + <input + type="text" + [id]="id" + [formControl]="fieldControl" + [ngClass]="[textInputVariants({ variant }), withPrefix ? 'pl-10' : '', withSuffix ? 'pr-10' : '']" + [placeholder]="placeholder" + [autocomplete]="autocomplete" + [attr.aria-required]="required" + [attr.aria-invalid]="variant === 'error'" + [attr.data-test-id]="_dataTestId + '-text-input'" + (click)="clickEmitter.emit()" + #inputElement + /> + <div *ngIf="withSuffix" class="absolute bottom-2 right-2 flex size-6 items-center justify-center"> + <ng-content select="[suffix]" /> </div> + <ng-content select="[error]"></ng-content> </div> `, diff --git a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts index 11df4ff802c0ac4daf110a3686441b6325da4a62..e1322cfcdef6610df2a458541bcd3436fc12d7d2 100644 --- a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts +++ b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts @@ -33,18 +33,14 @@ export enum ForwardingDirection { selector: 'ods-forwarding-item', standalone: true, imports: [ForwardVorgangIconComponent], - template: ` <div class="block h-full rounded-lg border border-grayborder"> - <div class="flex flex-col items-start justify-between gap-2 p-3 md:flex-row md:items-center md:gap-0"> - <div class="flex flex-1 gap-3"> + template: ` <div class="h-full rounded-lg border border-grayborder"> + <div class="flex flex-col gap-3 p-3 align-top sm:flex-row"> + <div class="flex gap-3"> <ods-forward-vorgang-icon class="fill-text" /> - <p class="text-gray-500">{{ direction }}:</p> - <div class="mt-[-8px] w-full"> - <ng-content /> - </div> - </div> - <div class="text-end empty:hidden"> - <ng-content select="[end-content]" /> + <div class="font-medium text-gray-500">{{ direction }}:</div> </div> + <div class="grow"><ng-content /></div> + <div class="flex items-center"><ng-content select="[end-content]" /></div> </div> </div>`, }) diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html index 9dbcc5ecbfc467910d23679f061cc842883217fc..b61988d33c478ecfbcfd727f83440f8d236232af 100644 --- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html +++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html @@ -1,6 +1,6 @@ -<div class="w-[860px] flex flex-col max-w-full max-h-full rounded-lg bg-background-50 p-8 "> - <div class="flex items-center justify-between mb-4"> - <h1 class="text-xl font-semibold text-primary">Vorgang weiterleiten</h1> +<div class="flex max-h-full w-[860px] max-w-full flex-col rounded-lg bg-background-50 p-6 shadow-md"> + <div class="mb-4 flex items-center justify-between"> + <h1 class="text-lg font-medium text-primary">Vorgang weiterleiten</h1> <ods-cancel-dialog-button showAsIconButton="true" /> </div>