Adapt visual paging for portrait screens
This commit is contained in:
parent
2b084d3f39
commit
57de3fb8a4
1 changed files with 16 additions and 7 deletions
|
@ -9,7 +9,7 @@
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
font-size: 6vh;
|
font-size: 6vmin;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
}
|
}
|
||||||
|
@ -30,21 +30,30 @@
|
||||||
p#announcement {
|
p#announcement {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
padding-top: 7vh;
|
padding-top: 7vmax;
|
||||||
padding-bottom: 7vh;
|
padding-bottom: 7vmax;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
font-size: 7vh;
|
font-size: 7vmin;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
width: 80vw;
|
width: 80vw;
|
||||||
}
|
}
|
||||||
p#announcement.tiny {
|
p#announcement.tiny {
|
||||||
font-size: 15vh;
|
font-size: 15vmin;
|
||||||
}
|
}
|
||||||
p#announcement.short {
|
p#announcement.short {
|
||||||
font-size: 10vh;
|
font-size: 10vmin;
|
||||||
}
|
}
|
||||||
p#announcement.long {
|
p#announcement.long {
|
||||||
font-size: 5vh;
|
font-size: 5vmin;
|
||||||
|
}
|
||||||
|
@media (orientation: portrait) {
|
||||||
|
p#announcement {
|
||||||
|
width: 95vw;
|
||||||
|
padding-bottom: 3vmax;
|
||||||
|
}
|
||||||
|
p#announcement.tiny {
|
||||||
|
font-size: 10vmin;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
Loading…
Reference in a new issue