Optimize the about screen for smaller devices

This commit is contained in:
SondreB 2022-12-27 00:04:27 +01:00
parent e2d64ac0ff
commit 7b3fd446c8
No known key found for this signature in database
GPG Key ID: D6CC44C75005FDBF
2 changed files with 16 additions and 4 deletions

View File

@ -14,3 +14,15 @@
.help { .help {
padding-left: 10em; padding-left: 10em;
} }
@media only screen and (max-width: 599px) {
.help {
font-size: 0.8em;
padding-left: 8em;
}
.logo {
max-width: 64px;
margin-left: -6em;
}
}

View File

@ -1,7 +1,7 @@
<div class="page help"> <div class="page help">
<img class="logo" src="assets/icons/icon-256x256.png" /> <img class="logo" src="assets/icons/icon-256x256.png" />
<h1 class="marginless">About</h1> <h1 class="marginless heading">About</h1>
<p>Blockcore Notes instructions will come here later on.</p> <p>Blockcore Notes instructions will come here later on.</p>
@ -21,7 +21,7 @@
<img class="logo" src="assets/nostr.svg" /> <img class="logo" src="assets/nostr.svg" />
<h1 class="marginless">Nostr</h1> <h1 class="marginless heading">Nostr</h1>
<h3>Nostr Directory</h3> <h3>Nostr Directory</h3>