diff --git a/src/components/common/Footer.css b/src/components/common/Footer.css index af9dc95..4de75d5 100644 --- a/src/components/common/Footer.css +++ b/src/components/common/Footer.css @@ -8,6 +8,47 @@ overflow: hidden; } +.footer-sponsorship { + max-width: 1100px; + margin: 0 auto; + padding: 2rem 3rem 1.5rem; + display: flex; + align-items: center; + justify-content: center; + gap: 1rem; + flex-wrap: wrap; + border-bottom: 1px solid rgba(255, 255, 255, 0.1); +} + +.sponsorship-text { + margin: 0; + font-size: 0.9rem; + color: #d1d5db; +} + +.sponsorship-link { + display: inline-flex; + align-items: center; + transition: transform 0.2s ease, opacity 0.2s ease; +} + +.sponsorship-link:hover { + transform: translateY(-2px); + opacity: 0.9; +} + +.sponsorship-logo { + height: 32px; + width: auto; +} + +.sponsorship-tagline { + margin: 0; + font-size: 0.85rem; + color: #ec4899; + font-weight: 500; +} + .footer-bottom { max-width: 1100px; margin: 0 auto; @@ -65,6 +106,16 @@ } @media (max-width: 768px) { + .footer-sponsorship { + padding: 1.5rem 1.5rem 1.25rem; + gap: 0.75rem; + text-align: center; + } + + .sponsorship-logo { + height: 28px; + } + .footer-bottom { flex-direction: column; gap: 1rem; diff --git a/src/components/common/Footer.jsx b/src/components/common/Footer.jsx index a30ee4d..74e1c54 100644 --- a/src/components/common/Footer.jsx +++ b/src/components/common/Footer.jsx @@ -12,6 +12,23 @@ if (typeof document !== "undefined" && !document.querySelector('style[data-foote function Footer({ className }) { return (