Четкость Полноэкранный модальный режим

Модальные окна Clarity предназначены для предупреждения пользователя, диалоговых окон подтверждения и рабочих процессов, ориентированных на выполнение задач. Как правило, это задачи, которые требуют сосредоточения и внимания со стороны пользователя, но мы не хотим полностью вырывать их из контекста, который находится за модальным оверлеем. Они не были предназначены для использования в полноэкранном режиме.

Я бы не предлагал использовать полноэкранное модальное окно, в котором контекст полностью скрыт от ваших пользователей.

Тем не менее, модальные окна Clarity можно переопределить с помощью CSS. Вот пример, который начинает изменять стили Clarity, чтобы сделать полноэкранный модальный. Имейте в виду, что модальные окна Clarity не были предназначены для полноэкранного режима и что некоторые элементы модального окна также могут нуждаться в настройке, чтобы они работали в соответствии с вашим вариантом использования.

https://stackblitz.com/edit/clarity-dark-theme-v11-so-full-modal-css

fyi - чтобы переопределить css компонента Angular, вам понадобится ::ng-deep для переопределения определенных классов, которые необходимо настроить. например:

::ng-deep .modal-content-wrapper {
   height: 100%;
   width: 100%;
}