Update app.py

app.py

@@ -1,6 +1,22 @@
 import streamlit as st
 import calendar
 
+# Define images for each month (seasonal backgrounds)
+month_images = {
+    1: "https://example.com/january.jpg",  # Winter for January
+    2: "https://example.com/february.jpg",  # Winter for February
+    3: "https://example.com/march.jpg",  # Spring for March
+    4: "https://example.com/april.jpg",  # Spring for April
+    5: "https://example.com/may.jpg",  # Spring for May
+    6: "https://example.com/june.jpg",  # Summer for June
+    7: "https://example.com/july.jpg",  # Summer for July
+    8: "https://example.com/august.jpg",  # Summer for August
+    9: "https://example.com/september.jpg",  # Fall for September
+    10: "https://example.com/october.jpg",  # Fall for October
+    11: "https://example.com/november.jpg",  # Fall for November
+    12: "https://example.com/december.jpg",  # Winter for December
+}
+
 # Function to display the full calendar for a specific month and year
 def display_full_calendar(year, month):
     # Display the month and year
@@ -12,13 +28,50 @@ def display_full_calendar(year, month):
     # Days of the week headers
     days_of_week = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
     
-    # Create a formatted HTML table with colors
-    table_html = "<table style='border-collapse: collapse; width: 80%; margin: 20px auto;'>"
+    # Set the background image for the month
+    bg_image_url = month_images.get(month, "")
+    st.markdown(
+        f"""
+        <style>
+            .calendar {{
+                background-image: url('{bg_image_url}');
+                background-size: cover;
+                background-position: center;
+                padding: 20px;
+            }}
+            table {{
+                border-collapse: collapse;
+                width: 100%;
+            }}
+            th, td {{
+                text-align: center;
+                padding: 5px;
+                border: 1px solid #ccc;
+                font-size: 14px;
+                height: 30px;
+            }}
+            th {{
+                background-color: rgba(255, 255, 255, 0.8);
+            }}
+            td {{
+                background-color: rgba(255, 255, 255, 0.6);
+            }}
+            td.weekend {{
+                background-color: rgba(255, 233, 59, 0.8);  /* Yellow for weekends */
+            }}
+            td.empty {{
+                background-color: rgba(255, 255, 255, 0.2); /* Light for empty cells */
+            }}
+        </style>
+        """, unsafe_allow_html=True)
+    
+    # Create the table
+    table_html = "<div class='calendar'><table>"
     
-    # Add the days of the week as the header row with background color
-    table_html += "<tr style='background-color: #f0f0f0;'>"
+    # Add the days of the week as the header row
+    table_html += "<tr>"
     for day in days_of_week:
-        table_html += f"<th style='border: 1px solid #ccc; padding: 5px; text-align: center; background-color: #e0e0e0;'>{day}</th>"
+        table_html += f"<th>{day}</th>"
     table_html += "</tr>"
     
     # Add the weeks to the table
@@ -26,16 +79,16 @@ def display_full_calendar(year, month):
         table_html += "<tr>"
         for i, day in enumerate(week):
             if day == 0:
-                table_html += "<td style='border: 1px solid #ccc; height: 30px;'></td>"  # Empty cell for days not in the month
+                table_html += "<td class='empty'></td>"  # Empty cell for days not in the month
             else:
                 # Color weekends (Saturday and Sunday)
                 if i == 5 or i == 6:
-                    table_html += f"<td style='border: 1px solid #ccc; height: 30px; text-align: center; background-color: #ffeb3b;'>{day}</td>"
+                    table_html += f"<td class='weekend'>{day}</td>"
                 else:
-                    table_html += f"<td style='border: 1px solid #ccc; height: 30px; text-align: center; background-color: #ffffff;'>{day}</td>"
+                    table_html += f"<td>{day}</td>"
         table_html += "</tr>"
     
-    table_html += "</table>"
+    table_html += "</table></div>"
     
     # Display the formatted calendar as HTML
     st.markdown(table_html, unsafe_allow_html=True)