Make layout fully responsive using matchMedia('(max-width: 799px)')

This commit is contained in:
the-djmaze 2023-02-23 13:54:32 +01:00
parent 1dbd9bda0c
commit e1833ae032
64 changed files with 239 additions and 434 deletions

View file

@ -4,7 +4,7 @@ html.list-loading body {
cursor: progress;
}
@media screen and (min-width: 1000px) {
@media screen and (min-width: @maxMobileWidth + 1px) {
#rl-app {
background-image: var(--main-bg-image);
background-size: var(--main-bg-size);
@ -73,13 +73,14 @@ dialog:not(.animate) {
/**
* https://github.com/the-djmaze/snappymail/issues/686
@media screen and (max-width: 999px) {
*/
.rl-mobile dialog {
margin: 0 auto;
/* max-height: calc(100vh - 86px);*/
/* max-height: 100dvh;*/
width: 100%;
@media screen and (max-width: @maxMobileWidth) {
dialog {
margin: 0 auto;
/* max-height: calc(100vh - 86px);*/
/* max-height: 100dvh;*/
width: 100%;
}
}
dialog > header {