p-calendar styling is incorrect when it is disabled with an icon

[PeterHewat]

I'm submitting a ...

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Stackblitz Example
https://stackblitz.com/edit/primeng-issue-mdc-theme-calendar-with-icon?file=src/app/app.component.html

Current behavior
The style of a disabled p-calendar with icon is incorrect
=> Wrong bg-color + hover over it changes style.
This doesn't occur if the calendar icon isn't displayed.

Expected behavior
The style of a disabled p-calendar should be correct, irrelevant of if it has an icon or not.

Minimal reproduction of the problem with instructions
See Stackblitz Example
Prerequisite: Use class p-input-filled & themes/mdc-light-indigo/theme.css.

• Angular version: 11.2.6

• PrimeNG version: 11.3.1

• Browser: all

• Language: all

[PeterHewat]

I have found the solution. p-disabled is missing. A workaround is to add the p-disabled class to styleClass like this:

  <div class="p-float-label">
    <p-calendar
      inputId="myDate"
      [(ngModel)]="date"
      [showIcon]="true"
      [disabled]="true" 
      styleClass="p-disabled"
    ></p-calendar>
    <label for="myDate">Date with icon disabled</label>
  </div>

I'll see if I can provide a PR.

[PeterHewat]

This fix reveils another bug: Adding p-disabled applies opacity 0.38 twice and we don't want the line under the input since it is already on the parent span. Thus, we have to add this css to fix this:

::ng-deep .p-input-filled .p-disabled > .p-component:disabled {
  opacity: 1;
  background-image: none;
}

[PeterHewat]

@yigitfindikli Thanks but this is only a partial fix. There still is an issue:
https://stackblitz.com/edit/primeng-issue-mdc-theme-calendar-with-icon-primeng-11-3-0?file=src%2Fapp%2Fapp.component.html
https://stackblitz.com/edit/primeng-issue-mdc-theme-calendar-with-icon-primeng-11-4-0?file=src%2Fapp%2Fapp.component.html
Indeed, when you hover over the p-calendar that has an icon, it shouldn't change style. I still need to apply the hack...