Conditionally adapting wording on home page to device size

This commit is contained in:
Lucas Hinderberger 2020-09-16 20:25:56 +02:00
parent abadf318fc
commit c8736dfeb6
2 changed files with 7 additions and 1 deletions

View file

@ -66,7 +66,12 @@ footer { background: #f5f5f5; text-align: center; font-size: 8pt; padding: 15px;
.container { max-width: 1300px; margin: auto; height: 100%; }
.flex-spacer { flex: 99; }
.narrow-only { display: none; }
@media screen and (max-width: 1400px) {
.wide-only { display: none; }
.narrow-only { display: initial; }
#header-logo { margin-left: 0; }
#sidebar { display: block; position: absolute; left: 0; top: 0; height: 100%; transform: translateX(-400px); }
#sidebar .sidebar-close-button { display: block; }

View file

@ -3,6 +3,7 @@ permalink: /
---
Welcome to the Codeberg Documentation pages!
Please choose a section from the menu on the left.
<span class="wide-only">Please choose a section from the main menu on the left.</span>
<span class="narrow-only">Please choose a section from the main menu, which you can access by clicking/touching the three stripes at the top right.</span>
If you're new to Codeberg, consider reading the [Getting Started Guide](/getting-started).