Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> | |
| <title>KrishiKart - Farm Equipment Price Comparison</title> | |
| <style> | |
| :root { | |
| --farm-green: #2E7D32; | |
| --wheat-yellow: #F9C74F; | |
| } | |
| body { | |
| background-color: #F5F5DC; | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| } | |
| .navbar { | |
| background-color: var(--farm-green); | |
| } | |
| .logo { | |
| display: flex; | |
| align-items: center; | |
| color: white; | |
| font-size: 24px; | |
| font-weight: bold; | |
| } | |
| .logo i { | |
| font-size: 28px; | |
| margin-right: 10px; | |
| color: var(--wheat-yellow); | |
| } | |
| .search-container { | |
| background-color: rgba(255, 255, 255, 0.9); | |
| border-radius: 12px; | |
| padding: 20px; | |
| margin-top: -20px; | |
| box-shadow: 0 5px 15px rgba(0,0,0,0.1); | |
| border: 2px solid var(--farm-green); | |
| } | |
| .search-label { | |
| font-weight: bold; | |
| color: var(--farm-green); | |
| margin-bottom: 10px; | |
| font-size: 18px; | |
| } | |
| .search-tips { | |
| background-color: #EFF7EE; | |
| border-left: 4px solid var(--farm-green); | |
| padding: 10px; | |
| margin-top: 10px; | |
| font-size: 14px; | |
| } | |
| .input-group { | |
| margin-bottom: 10px; | |
| } | |
| .input-group .form-control { | |
| border: 2px solid var(--farm-green); | |
| border-radius: 6px 0 0 6px; | |
| height: 50px; | |
| font-size: 16px; | |
| } | |
| .input-group .btn { | |
| background-color: var(--farm-green); | |
| color: white; | |
| border-radius: 0 6px 6px 0; | |
| height: 50px; | |
| font-size: 16px; | |
| font-weight: bold; | |
| } | |
| .card { | |
| margin-bottom: 20px; | |
| cursor: pointer; | |
| border: none; | |
| border-radius: 12px; | |
| box-shadow: 0 5px 15px rgba(0,0,0,0.1); | |
| transition: transform 0.3s ease; | |
| height: 100%; | |
| } | |
| .card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 20px rgba(0,0,0,0.15); | |
| } | |
| .card-img-top { | |
| height: 200px; | |
| object-fit: contain; | |
| padding: 15px; | |
| background-color: white; | |
| } | |
| .site-badge { | |
| position: absolute; | |
| top: 10px; | |
| right: 10px; | |
| padding: 5px 10px; | |
| border-radius: 20px; | |
| font-size: 12px; | |
| font-weight: bold; | |
| } | |
| .amazon-badge { | |
| background-color: #FF9900; | |
| color: black; | |
| } | |
| .flipkart-badge { | |
| background-color: #2874F0; | |
| color: white; | |
| } | |
| .section-title { | |
| margin-top: 40px; | |
| margin-bottom: 20px; | |
| color: var(--farm-green); | |
| font-weight: bold; | |
| border-bottom: 2px solid var(--farm-green); | |
| padding-bottom: 10px; | |
| display: flex; | |
| align-items: center; | |
| } | |
| .section-title i { | |
| margin-right: 10px; | |
| color: var(--farm-green); | |
| } | |
| .card-body { | |
| background-color: #FFFFFF; | |
| border-radius: 0 0 12px 12px; | |
| } | |
| .card-body h5 { | |
| font-size: 1rem; | |
| font-weight: 600; | |
| color: #333; | |
| height: 60px; | |
| overflow: hidden; | |
| } | |
| .card-text { | |
| font-size: 1.3rem; | |
| color: var(--farm-green); | |
| font-weight: bold; | |
| } | |
| .card-text del { | |
| font-size: 0.9rem; | |
| color: #999; | |
| margin-left: 5px; | |
| } | |
| .buy-now-btn { | |
| background-color: var(--farm-green); | |
| color: white; | |
| border-radius: 30px; | |
| padding: 8px 15px; | |
| font-weight: bold; | |
| width: 100%; | |
| margin-top: 10px; | |
| } | |
| .buy-now-btn:hover { | |
| background-color: #1B5E20; | |
| color: white; | |
| } | |
| .footer { | |
| background-color: var(--farm-green); | |
| color: white; | |
| padding: 20px 0; | |
| margin-top: 40px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- Navbar --> | |
| <nav class="navbar navbar-expand-lg navbar-dark mb-5"> | |
| <div class="container"> | |
| <div class="logo"> | |
| <i class="fas fa-tractor"></i> KrishiKart | |
| </div> | |
| </div> | |
| </nav> | |
| <div class="container"> | |
| <!-- Search Box --> | |
| <div class="search-container"> | |
| <div class="search-label"> | |
| <i class="fas fa-search"></i> Find the best farm equipment & supplies at lowest prices | |
| </div> | |
| <form method="POST"> | |
| <div class="input-group"> | |
| <input type="text" class="form-control" name="product" placeholder="Search for seeds, tractors, tools, fertilizers..." required> | |
| <button class="btn" type="submit">Search <i class="fas fa-arrow-right"></i></button> | |
| </div> | |
| </form> | |
| <div class="search-tips"> | |
| <strong>Search Tips:</strong> Try "tractor implements", "sprinkler system", "organic fertilizer", "crop seeds", etc. | |
| </div> | |
| </div> | |
| <!-- Product Results Sections --> | |
| {% if amazon %} | |
| <h2 class="section-title"><i class="fab fa-amazon"></i> Amazon Products</h2> | |
| <div class="row"> | |
| {% for i in range(0, amazon|length, 3) %} | |
| {% for j in range(3) %} | |
| {% set idx = i + j %} | |
| {% if idx < amazon|length %} | |
| <div class="col-md-4 mb-4"> | |
| <div class="card h-100"> | |
| <span class="site-badge amazon-badge">Amazon</span> | |
| {% if amazon[idx].image %} | |
| <img src="{{ amazon[idx].image }}" class="card-img-top" alt="{{ amazon[idx].title }}"> | |
| {% endif %} | |
| <div class="card-body"> | |
| <h5 class="card-title">{{ amazon[idx].title }}</h5> | |
| <p class="card-text">{{ amazon[idx].price }} <del>₹{% set original = amazon[idx].price_val * 1.2 %}{{ original|round|int }}</del></p> | |
| <a href="{{ amazon[idx].url }}" target="_blank" class="btn buy-now-btn">View Details <i class="fas fa-external-link-alt"></i></a> | |
| </div> | |
| </div> | |
| </div> | |
| {% endif %} | |
| {% endfor %} | |
| {% endfor %} | |
| </div> | |
| {% endif %} | |
| {% if flipkart %} | |
| <h2 class="section-title"><i class="fas fa-shopping-cart"></i> Flipkart Products</h2> | |
| <div class="row"> | |
| {% for i in range(0, flipkart|length, 3) %} | |
| {% for j in range(3) %} | |
| {% set idx = i + j %} | |
| {% if idx < flipkart|length %} | |
| <div class="col-md-4 mb-4"> | |
| <div class="card h-100"> | |
| <span class="site-badge flipkart-badge">Flipkart</span> | |
| {% if flipkart[idx].image %} | |
| <img src="{{ flipkart[idx].image }}" class="card-img-top" alt="{{ flipkart[idx].title }}"> | |
| {% endif %} | |
| <div class="card-body"> | |
| <h5 class="card-title">{{ flipkart[idx].title }}</h5> | |
| <p class="card-text">{{ flipkart[idx].price }} <del>₹{% set original = flipkart[idx].price_val * 1.2 %}{{ original|round|int }}</del></p> | |
| <a href="{{ flipkart[idx].url }}" target="_blank" class="btn buy-now-btn">View Details <i class="fas fa-external-link-alt"></i></a> | |
| </div> | |
| </div> | |
| </div> | |
| {% endif %} | |
| {% endfor %} | |
| {% endfor %} | |
| </div> | |
| {% endif %} | |
| {% if not amazon and not flipkart %} | |
| <div class="text-center mt-5"> | |
| <img src="https://via.placeholder.com/300x200?text=Farm+Equipment" alt="Farm illustration" style="max-width: 300px; margin-bottom: 20px;"> | |
| <h3 style="color: var(--farm-green);">Search for farm equipment to see the best prices</h3> | |
| <p>Try searching for tractors, seeds, irrigation systems, fertilizers, or farming tools</p> | |
| </div> | |
| {% endif %} | |
| </div> | |
| <!-- Footer --> | |
| <footer class="footer mt-5"> | |
| <div class="container"> | |
| <div class="row"> | |
| <div class="col-md-4"> | |
| <h5><i class="fas fa-tractor"></i> KrishiKart</h5> | |
| <p>Helping farmers find the best deals on agriculture equipment and supplies.</p> | |
| </div> | |
| <div class="col-md-4"> | |
| <h5>Quick Links</h5> | |
| <ul class="list-unstyled"> | |
| <li><a href="#" class="text-white">About Us</a></li> | |
| <li><a href="#" class="text-white">Farm Resources</a></li> | |
| <li><a href="#" class="text-white">Contact Support</a></li> | |
| </ul> | |
| </div> | |
| <div class="col-md-4"> | |
| <h5>Contact Us</h5> | |
| <p><i class="fas fa-phone"></i> Helpline: 1800-FARM-HELP</p> | |
| <p><i class="fas fa-envelope"></i> Email: [email protected]</p> | |
| </div> | |
| </div> | |
| <div class="text-center mt-3"> | |
| <p>© 2025 KrishiKart - Farm Equipment Price Comparison</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script> | |
| </body> | |
| </html> | |