Как удалить элементы DatePicker в HTML5 input = date, которая появляется в крайнем правом углу при наведении

Question

Проблема:

• Как удалить курсор и инкремент / декремент, которые появляются при наведении курсора на matInput type=date.

Answer 1

Демонстрация без значков увеличения / уменьшения

Код приложения: https://stackblitz.com/edit/angular-incons-hide-input-type-date?file=src/app/app.component.css

Подход:

• Я искал вещи, которые применяются к :hover matinput, но не повезло,
  Поэтому я обманулся, создав маску белого цвета, которая будет покрывать эти значки, используя :before.

  Это скрывает эти значки, и их действия не будут доступны, как при открытии диалогового окна календаря при нажатии на значок, так как значок скрыт.

Код:

Дайте класс для ввода тега
<input class="myInput" matInput type="date" placeholder="no icons on hover" value="">,
, затем добавьте следующий css

.myInput::before {
    content: 'we';
    position: absolute;
    right: 0;
    width: 40px;
    height: 40px;
    background-color: white;
    color: white;
}