Datepicker displays extra date input control on iPhone and when using device emulation in Chrome

[randywessels]

Describe the bug On an iPhone or when emulating any device in Chrome from the device toolbar when you click the button for the date picker pop-up, a small control that looks like a combobox with a date on it appears. On a Galaxy S10, this goes away when you select a date. But if you click cancel, it does not go away. On the iPhone and emulator, you have to click that new control to cause the date selection to appear. And once you do select a date, the control goes away on the emulator, but stays on the real iPhone.

To Reproduce Steps to reproduce the behavior:

1. Go to 'https://www.matblazor.com/DatePicker'
2. Open the browser development tools and toggle the devicetoolbar - doesn t matter which option you choose.
3. Scroll down to the Datepicker control and click the button to cause the pop-up
4. You will see a new control superimposed on top of the datepicker with the current date.

Blazorfiddle link https://blazorfiddle.com/temp/de98bec4-3069-4734-8a5f-07e8bdf99f62

Expected behavior The expected behavior is for it to function the same on any mobile device as it does on a browser. The extra control should be hidden and if that is not possible, it should be hidden once a date selection is made (or canceled). The phone or tablets input for dates should happen without having to click on the extra control.

Screenshots If applicable, add screenshots or .GIF captures to help explain your problem

Additional context Add any other context about the problem here.

[mkontula]

I can second this behavior. Extra control while clicking outside datepicker and/or cancelling the dialog does not look good or professional. Using Chrome on Windows & S10 on real device.