Ясность Полноэкранный модальный

Question

Я использую фреймворк VMware Clarity UI, и это здорово.У него есть некоторые модальные функции, но я ищу полноэкранный модальный.Ясность поставляется с определенным размером, но не с полноэкранным.

Кто-нибудь знает, как я могу сделать режим четкости полноэкранным?

Answer 1

Модальности 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%;
}