1
0
Fork 0
mirror of https://github.com/ganelson/inform.git synced 2024-06-26 04:00:43 +03:00

A few CSS overrides to make the documentation useful on small screens, such as phones

This commit is contained in:
Stuart Langridge 2023-09-02 20:25:02 +01:00 committed by GitHub
parent 56be55c487
commit da31e9d5a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -148,4 +148,39 @@ nav[role="navigation"] h1 {
nav[role="navigation"] {
display: none;
}
}
}
/* A few overrides to make the documentation useful on small screens, such as phones */
@media (max-width: 700px) {
/* tighten up the margins and allow putting the nav menu at the end of the page */
body {
display: flex;
flex-direction: column;
margin: 5px 0 !important;
}
/* nav menu at the end of the page, not a floating sidebar over the top of the content */
nav[role="navigation"] {
position: static;
overflow: auto;
order: 2;
}
/* full-width main without big indent to leave space for the nav menu */
main {
width: 100%;
margin: 0;
padding-left: 5px;
padding-right: 5px;
box-sizing: border-box;
}
/* constrain to screen width on narrow screens, rather than explicitly overflowing */
main p.commentary, main p.purpose {
width: auto;
}
div.breadcrumbs {
position: static;
}
div.contentspage .chapterlist .sectionlist li {
padding-left: 1.5em;
}
}