Fix Alchemy badge on small screens

This commit is contained in:
Aadi Desai 2023-11-13 14:36:19 +00:00
parent 0f332d36b0
commit a20c2422da
Signed by: supleed2
SSH key fingerprint: SHA256:CkbNRs0yVzXEiUp2zd0PSxsfRUMFF9bLlKXtE1xEbKM
3 changed files with 14 additions and 4 deletions

View file

@ -37,8 +37,8 @@
<picture>
<source srcset="https://static.alchemyapi.io/images/marketing/badgeLight.png"
media="(prefers-color-scheme: light)" />
<img onclick=logBadgeClick() id="badge-button" style="width:240px;height:53px"
src="https://static.alchemyapi.io/images/marketing/badge.png" alt="Alchemy Supercharged" />
<img onclick=logBadgeClick() id="badge-button" src="https://static.alchemyapi.io/images/marketing/badge.png"
alt="Alchemy Supercharged" />
</picture>
</a>
</body>

View file

@ -121,8 +121,8 @@
<picture>
<source srcset="https://static.alchemyapi.io/images/marketing/badgeLight.png"
media="(prefers-color-scheme: light)" />
<img onclick=logBadgeClick() id="badge-button" style="width:240px;height:53px"
src="https://static.alchemyapi.io/images/marketing/badge.png" alt="Alchemy Supercharged" />
<img onclick=logBadgeClick() id="badge-button" src="https://static.alchemyapi.io/images/marketing/badge.png"
alt="Alchemy Supercharged" />
</picture>
</a>
</body>

View file

@ -294,6 +294,16 @@ body::-webkit-scrollbar {
margin: 0px 10%;
}
a>picture {
display: flex;
width: 100%;
justify-content: center;
}
#badge-button {
width: calc(min(240px, 80%));
}
@media screen and (width < 450px) {
.scroll-button {
display: none;