giers10/virtual_interdimensional_spirit_summoner
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Refactor media queries for spirit-info in index.html

Browse Source
This commit is contained in:
Victor Giers
2025-05-28 19:55:58 +02:00
parent 1995cbd7f4
commit 684ce37814
1 changed files with 17 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
node/server/public/index.html
View File

@@ -112,15 +112,29 @@ canvas {
} }
} }
/* "Mobile Portrait" (Hochformat und schmal) */ /* Hochformat (Mobile) */
@media (max-width: 619px), (orientation: portrait) { @media (max-width: 619px) and (orientation: portrait) and (pointer: coarse) {
#spirit-info {
width: 90vw;
max-width: 98vw;
min-width: 0;
max-height: 82dvh;
padding: 8vw 4vw 4vw 4vw;
}
}
/* Hochformat (Desktop) */
@media (max-width: 619px) and (orientation: landscape), (max-width: 619px) and (pointer: fine) {
#spirit-info { #spirit-info {
width: 90vw; width: 90vw;
max-width: 400px; max-width: 400px;
min-width: 0; min-width: 0;
max-height: 700px; /* dynamic viewport height */ max-height: 700px;
padding: 8vw 4vw 4vw 4vw; padding: 8vw 4vw 4vw 4vw;
} }
/* Hochformat (Mobile / Desktop) */
@media (max-width: 619px), (orientation: portrait) {
.spirit-info-flex { .spirit-info-flex {
flex-direction: column; flex-direction: column;
gap: 16px; gap: 16px;