From dedead021a366bb13974438c5d18147cd618398c Mon Sep 17 00:00:00 2001 From: Muskankr Date: Sun, 31 May 2026 17:46:34 +0530 Subject: [PATCH 1/4] feat: added responsive footer to Sustainable Farming Page --- sustainable-farming.html | 130 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 130 insertions(+) diff --git a/sustainable-farming.html b/sustainable-farming.html index 1d9916e2..9127cde1 100644 --- a/sustainable-farming.html +++ b/sustainable-farming.html @@ -960,6 +960,102 @@ ::-webkit-scrollbar-thumb:hover { background: var(--text-muted); } + +.site-footer { + background: linear-gradient(135deg, #2e7d32, #66bb6a); + color: #fff; + margin-top: 80px; + padding: 2rem 1.25rem; + } + + .site-footer .footer-inner { + max-width: 1200px; + margin: 0 auto; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + gap: 1.5rem; + align-items: flex-start; + } + + .footer-brand { + display: flex; + flex-direction: column; + gap: .5rem + } + + .footer-logo { + width: 48px; + height: 48px; + border-radius: 8px; + object-fit: cover; + background: #fff; + padding: 4px + } + + .site-footer h3, + .site-footer h4 { + margin: 0 0 .5rem 0 + } + + .site-footer p { + margin: 0; + opacity: .9 + } + + .site-footer ul { + list-style: none; + padding: 0; + margin: 0; + display: flex; + flex-direction: column; + gap: .4rem + } + + .site-footer a { + color: #fff; + text-decoration: none; + opacity: .9; + transition: opacity .2s + } + + .site-footer a:hover { + opacity: 1; + text-decoration: underline + } + + .footer-bottom { + max-width: 1200px; + margin: 1rem auto 0; + padding-top: 1rem; + border-top: 1px solid rgba(255, 255, 255, .25); + text-align: center; + font-size: .9rem; + opacity: .9 + } + + .social-media { + display: flex; + gap: 1rem; + margin-top: .5rem + } + + .social-media a { + display: flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + background: rgba(255, 255, 255, .1); + border-radius: 50%; + transition: all .3s ease; + font-size: 1.2rem + } + + .social-media a:hover { + background: rgba(255, 255, 255, .2); + transform: translateY(-2px) + } + @@ -1301,6 +1397,40 @@

+ + +