Skip to content

Commit

Permalink
improved homepage
Browse files Browse the repository at this point in the history
  • Loading branch information
@ombhojane
ombhojane committed Feb 11, 2024
1 parent 90c804a commit b3173af
Show file tree
Hide file tree
Showing 4 changed files with 117 additions and 31 deletions.
Binary file modified __pycache__/app.cpython-311.pyc
View file
Binary file not shown.
64 changes: 50 additions & 14 deletions templates/generate.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,21 +2,57 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Agrotourism Service Generator</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<h2>Agrotourism Service Description Generator</h2>
<form method="post">
<label for="service_name">Enter the Agrotourism Service Name:</label><br>
<input type="text" id="service_name" name="service_name" required><br>
<input type="submit" value="Generate">
</form>
{% if response %}
<h3>Generated Description for "{{ service_name }}":</h3>
{% for section, text in response.items() %}
<h4>{{ section }}</h4>
<p>{{ text }}</p>
{% endfor %}
{% endif %}
<body class="bg-gray-100">
<div class="flex justify-center px-6 py-12">
<div class="w-full max-w-4xl">
<div class="bg-white shadow overflow-hidden sm:rounded-lg">
<div class="px-4 py-5 sm:px-6">
<h2 class="text-2xl leading-6 font-medium text-gray-900">
Create a Plan
</h2>
</div>
<div class="border-t border-gray-200">
<dl>
<div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt class="text-sm font-medium text-gray-500">
Enter the Agrotourism Service Name:
</dt>
<dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
<form method="post" class="flex flex-col space-y-4 md:flex-row md:items-center md:space-y-0 md:space-x-4">
<div class="flex-grow">
<input type="text" id="service_name" name="service_name" required
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md">
</div>
<div>
<button type="submit"
class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
Create Plan
</button>
</div>
</form>
</dd>
</div>
{% if response %}
<div class="px-4 py-5 sm:px-6">
<h3 class="text-lg leading-6 font-medium text-gray-900">
Generated Description for "{{ service_name }}":
</h3>
<div class="mt-4">
{% for section, text in response.items() %}
<h4 class="text-md font-bold text-gray-900">{{ section }}</h4>
<p class="mt-1 text-sm text-gray-600">{{ text }}</p>
{% endfor %}
</div>
</div>
{% endif %}
</dl>
</div>
</div>
</div>
</div>
</body>
</html>
82 changes: 66 additions & 16 deletions templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,27 +8,74 @@
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="../static/styles.css">
<style>
/* Custom styles for broader hero section and minimal footer */
.hero-section {
padding: 40px 0; /* Increase padding for a broader look */
background-color: #f0f9ff; /* Light green background */
color: #333; /* Adjust text color for better contrast */
}
.footer {
background-color: #f0f9ff; /* Footer background to match the theme */
color: #333; /* Footer text color */
padding: 20px 0;
text-align: center;
}
</style>
</head>
<body>
<div class="container mx-auto px-4">
<div class="container mx-auto px-4">
<nav class="flex justify-between items-center py-6">
<a href="#" class="text-2xl font-bold text-gray-800">Chalo Kisaan</a>
<div class="menu-toggle" onclick="toggleMenu()">
<i class="fas fa-bars fa-2x"></i>
</div>
<div class="nav-links">
<a href="/predict" class="text-gray-600 mx-2">Start Planning</a>
<a href="/generate" class="text-gray-600 mx-2">Generate</a>
<a href="#" class="text-blue-600 mx-2">Sign In</a>
</div>
<a href="#" class="text-2xl font-bold text-gray-800">Chalo Kisaan</a>
<div class="menu-toggle" onclick="toggleMenu()">
<i class="fas fa-bars fa-2x"></i>
</div>
<div class="nav-links hidden md:flex">
<a href="/predict" class="text-gray-600 mx-2">Start Planning</a>
<a href="/generate" class="text-gray-600 mx-2">Generate</a>
<a href="#" class="text-blue-600 mx-2">How it works?</a>
</div>
</nav>

<section>
<header class="text-center py-10">
<h1 class="text-5xl font-bold text-gray-800 mb-4">Discover Agrotourism With Us</h1>
<p class="text-xl text-gray-600 mb-4">Embark on a unique journey with Chalo Kisaan Agrotourism Planner. Connect with the roots of local agriculture, experience farm life, and indulge in the freshest farm-to-table meals. Our platform tailors your visit to local farms, ensuring an enriching and authentic experience.</p>
<a href="/predict" class="start-planning-btn">Start Planning</a>
</header>
<!-- Hero Banner with Value Proposition -->
<div class="hero-section text-center py-20 bg-green-50">
<h1 class="text-5xl font-bold">Generate the optimal agrotourism plan for your farm with AI</h1>
<p class="text-xl mt-4">Empower your farm's potential with cutting-edge AI technology.</p>
</div>

<!-- Section: Vibrant Images of Farms -->
<!-- Section: Before and After Image Generator Examples -->
<section class="py-10">
<h2 class="text-3xl font-bold text-gray-800 text-center mb-6">Image Generator for Farm Services</h2>
<p class="text-xl text-gray-600 text-center mb-6">See the transformation your farm can undergo with our Image Generator. Compare the original farm state with the envisioned service implemented.</p>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<!-- Before Image -->
<div class="text-center">
<p class="text-lg text-gray-800 mb-2">Original Farm</p>
<img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpr5b01cr48vdvck3k20r.png" alt="Original Farm" class="mx-auto shadow-lg rounded-lg">
</div>
<!-- After Image -->
<div class="text-center">
<p class="text-lg text-gray-800 mb-2">Farm with Service Implemented</p>
<img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpr5b01cr48vdvck3k20r.png" alt="Farm with Service Implemented" class="mx-auto shadow-lg rounded-lg">
</div>
</div>
</section>


<!-- Section: Video Explainer -->
<section class="py-10">
<h2 class="text-3xl font-bold text-gray-800 text-center mb-6">How It Works</h2>
<div class="flex justify-center">
<video controls width="70%">
<source src="path/to/your-video.mp4" type="video/mp4">
Sorry, your browser doesn't support embedded videos.
</video>
</div>
</section>

<h2 class="text-4xl font-bold text-gray-800 text-center my-10">Features</h2>


<section class="flex flex-col md:flex-row justify-between items-center py-10">
<div class="w-full md:w-1/2 mb-4 md:mb-0">
Expand Down Expand Up @@ -90,6 +137,9 @@ <h3 class="text-2xl font-semibold text-gray-800 mb-2">Comprehensive Service Buil
</div>

</section>
<footer class="footer bg-green-50">
<p class="text-gray-800">&copy; 2024 Chalo Kisaan. All rights reserved.</p>
</footer>

</div>

Expand Down
2 changes: 1 addition & 1 deletion templates/predict.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ <h1 class="text-4xl font-bold mb-6 text-green-700">Plan your next agrotourism se
<form>
<div class="form-section">
<label class="font-semibold text-lg mb-2 block">Land Size</label>
<img id="farmImage" class="mt-4 hidden" src="" alt="Farm Image" />
<img id="farmImage" class="mt-4 hidden" src="https://placehold.co/600x400" alt="Farm Image" />
<input type="number" id="landSizeInput" class="form-input" placeholder="Enter land size in hectares" aria-label="Land Size" oninput="updateFarmImage()" required>
</div>

Expand Down

0 comments on commit b3173af

Please sign in to comment.