Fix logo on small screen sizes (#191)

This commit is contained in:
Gusted 2022-01-01 00:29:10 +00:00 committed by GitHub
parent a6a4072f0c
commit 96f54da6d1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 1 deletions

View File

@ -3,7 +3,8 @@
<a class="navbar-brand" href="/">
<picture>
<!--<source srcset="/assets/img/layout/privacy-guides-logo-dark.svg" media="(prefers-color-scheme: dark)">-->
<img src="/assets/img/layout/privacy-guides-logo-light.svg" alt="Privacy Guides Logo" width="300" height="39">
<source srcset="/assets/img/layout/privacy-guides-logo-notext-colorbg.svg" media="(max-width: 400px)">
<img class="navbar-logo" src="/assets/img/layout/privacy-guides-logo-light.svg" alt="Privacy Guides Logo" height="39">
</picture>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">

View File

@ -90,4 +90,13 @@ h1, h2, h3:not(.h5), h4 {
box-decoration-break: clone;
}
.navbar-logo {
@media (max-width: 400px) {
width: 50px;
}
@media (min-width: 401px) {
width: 300px;
}
}
@import "custom";