Some styles require updates
Following styles improves displaying foundry on mobile devices. Tested on Pixel 6XL and Samsung Galaxy Note S 6 Lite, Foundry V11
/* fixes action bar appears randomly */
body.mobile-improvements {
position: fixed;
}
/* fix send message button mispositioned */
.mobile-improvements #chat-form {
flex-direction: row;
}
/* 'Jump to bottom' button width is smaller than sidebar in mobile mode */
.mobile-improvements .jump-to-bottom {
width: 100%;
}
/* fix filters might take 2 rows */
.mobile-improvements .dnd5e.sheet .filter-list {
max-width: 100%;
}
/* DND5e NPC sheet fixes. Just a copy of the similar styles for player characters */
.mobile-improvements .dnd5e.sheet.actor.npc ul.skills-list {
flex: 1;
}
@media screen and (max-width: 450px) {
.mobile-improvements .dnd5e.sheet.actor.npc .sheet-header img.profile {
max-width: 90px;
height: 90px;
}
.mobile-improvements .dnd5e.sheet.actor.npc .sheet-header img.profile {
position: absolute;
top: 0px;
}
.mobile-improvements .dnd5e.sheet.actor.npc .sheet-header h1 {
margin-left: 94px;
}
.mobile-improvements .dnd5e.sheet.actor.npc .sheet-header .summary {
margin-left: 94px;
flex: 0 0 calc(100% - 94px);
}
}
@media screen and (max-width: 800px) {
.mobile-improvements .dnd5e.sheet.actor.npc .sheet-header img.profile {
flex: 0 0 20vw;
max-width: 20vw;
height: 20vw;
}
}