Add Wario sprite to footer with Game Boy green tint
Sprite image needs to be saved as /public/wario-sprite.png 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
+18
-1
@@ -601,7 +601,20 @@
|
|||||||
gap: calc(var(--spacing-unit) * 1.5);
|
gap: calc(var(--spacing-unit) * 1.5);
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.footer-mascot {
|
||||||
|
margin-top: calc(var(--spacing-unit) * 4);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wario-sprite {
|
||||||
|
width: 80px;
|
||||||
|
height: auto;
|
||||||
|
/* Game Boy green tint using sepia + hue-rotate */
|
||||||
|
filter: sepia(100%) hue-rotate(50deg) saturate(200%) brightness(0.9);
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
.player-section {
|
.player-section {
|
||||||
margin: 30px 0;
|
margin: 30px 0;
|
||||||
display: none;
|
display: none;
|
||||||
@@ -1129,6 +1142,10 @@
|
|||||||
<button id="newSearchBtn" class="faq-link" type="button">New search</button>
|
<button id="newSearchBtn" class="faq-link" type="button">New search</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="footer-mascot">
|
||||||
|
<img src="/wario-sprite.png" alt="Wario" class="wario-sprite" />
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="faqModalBackdrop" class="modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="faqTitle">
|
<div id="faqModalBackdrop" class="modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="faqTitle">
|
||||||
<div class="modal" role="document">
|
<div class="modal" role="document">
|
||||||
<header>
|
<header>
|
||||||
|
|||||||
Reference in New Issue
Block a user