style: adjust input color and padding

Author: SebastienDechand

src/app/common/components/input-field/input-field.component.html

@@ -1,4 +1,4 @@
 <p-floatlabel [variant]="variant">
-  <input pInputText id="input_{{ label | lowercase }}" [(ngModel)]="value" [type]="type" [disabled]="disabled" autocomplete="off" />
-  <label for="input_{{ label | lowercase }}">{{ label }}</label>
+  <input pInputText [id]="'input_' + (label | lowercase)" [(ngModel)]="value" [type]="type" [disabled]="disabled" autocomplete="off" />
+  <label [for]="'input_' + (label | lowercase)">{{ label }}</label>
 </p-floatlabel>

src/app/common/components/input-field/input-field.component.scss

@@ -1,14 +1,12 @@
 p-floatlabel {
-  width: 500px;
-
   input {
     width: 100%;
-    padding: 15px;
     font-size: 16px;
     background-color: var(--background-color-light);
     border: var(--grey-border);
     border-radius: 8px;
     transition: border-color 0.3s ease-in-out;
+    color: black;
 
     &:focus,
     &:hover,

src/app/common/components/input-field/input-field.component.ts

@@ -15,6 +15,6 @@ export class InputFieldComponent {
   @Input() label: string = '';
   @Input() type: string = 'text';
   @Input() disabled: boolean = false;
-  @Input() variant: 'in' | 'over' | 'on' = 'in';
+  @Input() variant: 'in' | 'on' = 'in';
   value: string = '';
 }