Datepicker: обрезка на маленьких дисплеях - PullRequest
0 голосов
/ 19 июня 2020

Я пытаюсь показать полный календарь datepicker на маленьком экране, но нет возможности получить доступ ко всему календарю.

Нет прокрутки и нет возможности достичь всего содержимого datepicker, когда дисплей меньше, чем datepicker.

Это происходит с любым datepicker, например, с официальной страницы:

https://material.angular.io/components/datepicker/overview

Шаги для воспроизведения:

  1. Уменьшите окно навигатора до высоты не более 300 пикселей
  2. Откройте указатель даты
  3. Попытайтесь получить доступ к лунным дням ( Это невозможно)

Среда Angular: 9.0.2

CDK / Материал: 9.0.1

Браузеры: Chrome & Firefox (Последние версии)

Операционная система: Windows 10

1 Ответ

0 голосов
/ 19 июня 2020

только в ваших стилях. css (или styles.s css)

.mat-calendar {
    width: 200px!important;
    height: 260px!important;
    font-size:.9em
}
@media(min-width:257px)
{
  .mat-calendar {
    font-size:1em;
    width: 250px!important;
    height: 324px!important;
  }
}
@media(min-width:300px)
{
  .mat-calendar {
    width: 296px!important;
    height: 354px!important;
  }
}

ПРИМЕЧАНИЕ. Вы можете изменить размер медиа-запроса по своему усмотрению

...