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

View file

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

View file

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