diff --git a/farm_dashboard.html b/farm_dashboard.html index a7ec8355..2bbf22bb 100644 --- a/farm_dashboard.html +++ b/farm_dashboard.html @@ -204,6 +204,104 @@ opacity: 0.9; transform: translateY(-1px); } + +.site-footer { + background: linear-gradient(135deg, #1e293b, #065f46); /* dark blue → green */ + color: #fff; + margin-top: auto; + padding: 2.5rem 1.5rem; + border-top-left-radius: 20px; + border-top-right-radius: 20px; +} + + +.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: 0.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 0.5rem 0; +} + +.site-footer p { + margin: 0; + opacity: 0.9; +} + +.site-footer ul { + list-style: none; + padding: 0; + margin: 0; + display: flex; + flex-direction: column; + gap: 0.4rem; +} + +.site-footer a { + color: #fff; + text-decoration: none; + opacity: 0.9; + transition: opacity 0.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, 0.25); + text-align: center; + font-size: 0.9rem; + opacity: 0.9; +} + +.social-media { + display: flex; + gap: 1rem; + margin-top: 0.5rem; +} + +.social-media a { + display: flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + background: rgba(255, 255, 255, 0.1); + border-radius: 50%; + transition: all 0.3s ease; + font-size: 1.2rem; +} + +.social-media a:hover { + background: rgba(255, 255, 255, 0.2); + transform: translateY(-2px); +} @@ -300,6 +398,48 @@