Update index.html

index.html

@@ -14,40 +14,48 @@
             background-color: #f5f5f5;
             color: #333;
         }
+
         header {
             background-color: #333;
             color: #fff;
             padding: 20px;
             text-align: center;
         }
+
         header h1 {
             margin: 0;
             font-size: 36px;
         }
+
         nav ul {
             list-style-type: none;
             padding: 0;
             margin: 0;
             text-align: center;
         }
+
         nav ul li {
             display: inline;
             margin-right: 20px;
         }
+
         nav ul li a {
             color: #fff;
             text-decoration: none;
             font-size: 18px;
         }
+
         main {
             padding: 20px;
             text-align: center;
         }
+
         h2 {
             font-size: 28px;
             margin-top: 40px;
             color: #333;
         }
+
         .product-category {
             display: inline-block;
             margin: 20px;
@@ -58,6 +66,7 @@
             text-align: left;
             max-width: 300px;
         }
+
         .product-category img {
             width: 100%;
             height: 200px; /* Adjust the height as needed */
@@ -65,6 +74,7 @@
             margin-bottom: 10px;
             object-fit: cover; /* Ensure images maintain aspect ratio */
         }
+
         .contact {
             margin-top: 20px;
             background-color: #333;
@@ -74,6 +84,7 @@
             box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
             text-align: left;
         }
+
         footer {
             background-color: #333;
             color: #fff;
@@ -83,22 +94,26 @@
             width: 100%;
             bottom: 0;
         }
+
         /* Style for the map container */
         #mapid {
             height: 400px;
             margin-top: 20px;
         }
+
         /* Style for the image carousel container */
         .image-carousel {
             overflow: hidden;
             width: 100%;
             margin-top: 20px;
         }
+
         /* Style for the image carousel inner container */
         .image-carousel-inner {
             display: flex;
             animation: slide 15s linear infinite; /* Change duration and timing function as needed */
         }
+
         /* Keyframe animation for the image carousel */
         @keyframes slide {
             0% {
@@ -156,12 +171,12 @@
             <p>महाराष्ट्र, भारत</p>
             <p>ईमेल: [email protected]</p> <!-- Added email -->
             <p>फोन: +९१ ९६३७९८४६४७, +९१ ९९२३८३०४२२</p>
-            <p>पत्ता: आसरडोह, तालुका-धारूर, जिल्हा-बीड, मुख्य रोड, आसरडोह।</p>
+            <p>पत्ता: असरडोह, तालुका-धारूर, जिल्हा-बीड, मुख्य रोड, आसरडोह।</p>
         </section>
         <!-- Image carousel section -->
         <div class="image-carousel">
             <div class="image-carousel-inner">
-                <img src="{{ url_for(shop1.jpg) }}" alt="Shop 1">
+                <img src="{{ url_for('static', filename='images/shop1.jpg') }}" alt="Shop 1">
                 <img src="{{ url_for('static', filename='images/shop2.jpg') }}" alt="Shop 2">
                 <img src="{{ url_for('static', filename='images/shop3.jpg') }}" alt="Shop 3">
                 <img src="{{ url_for('static', filename='images/shop4.jpg') }}" alt="Shop 4">
@@ -180,10 +195,12 @@
     <script>
         // Initialize the map
         var map = L.map('mapid').setView([18.8209914, 76.2551534], 13); // Set initial coordinates and zoom level
+
         // Add OpenStreetMap as the base layer
         L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
             attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
         }).addTo(map);
+
         // Add a custom icon for the marker
         var customIcon = L.icon({
             iconUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/images/marker-icon.png',
@@ -191,9 +208,10 @@
             iconAnchor: [12, 41], // point of the icon which will correspond to marker's location
             popupAnchor: [1, -34] // point from which the popup should open relative to the iconAnchor
         });
+
         // Add a marker for the location with a popup
         L.marker([18.8209914, 76.2551534], { icon: customIcon }).addTo(map)
             .bindPopup("भक्ती कृषी केंद्र, आसरडोह").openPopup();
     </script>
 </body>
-</html>
+</html>