bizmatch-project/bizmatch/src/app/components/validated-input/validated-input.component.html

26 lines
856 B
HTML

<div>
<label [for]="name" class="block text-sm font-bold text-gray-700 mb-1 relative w-fit">
{{ label }}
@if(validationMessage){
<div
attr.data-tooltip-target="tooltip-{{ name }}"
class="absolute inline-flex items-center justify-center w-6 h-6 text-xs font-bold text-white bg-red-500 border-2 border-white rounded-full -top-2 dark:border-gray-900 hover:cursor-pointer"
>
!
</div>
<app-tooltip id="tooltip-{{ name }}" [text]="validationMessage"></app-tooltip>
}
</label>
<input
[type]="kind"
[id]="name"
[ngModel]="value"
(ngModelChange)="onInputChange($event)"
(blur)="onTouched()"
[attr.name]="name"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
[mask]="mask"
[dropSpecialCharacters]="false"
/>
</div>