Лучшая практика NextJs/где установить страницу в полноэкранном режиме
При создании приложения NextJS значение __next div будет соответствовать количеству содержащихся в нем элементов.
Если я хочу добавить button внизу страницы, страница должна быть «полноэкранной», например. height: 100vh
Итак, мой вопрос: где мне применить этот полноэкранный стиль? Внутри _app.js, _document.js или где-то еще?
Я также использую Material UI, если это что-то изменит.
Ответы 1
Я бы лично добавил его в глобальный файл CSS, который вы затем импортируете в свой _app.js, как описано здесь: https://nextjs.org/docs/basic-features/built-in-css-support
Кроме того, я бы нацелил его на body документа, на самом деле этот вопрос не имеет ничего общего с Next.js, а скорее является общей проблемой.
CSS я бы посоветовал вам попробовать, обратите внимание, что 100vh не работает должным образом на iOS, объяснение здесь: https://www.bram.us/2020/05/06/100vh-in-safari-on-ios /
body {
min-height: 100vh;
min-height: -webkit-fill-available;
}
ОМГ, я думала, что это я просто схожу с ума! Я создал файл _global_scss и поместил в него тело.