| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>School Time Table</title> |
| |
| <style> |
| |
| body { |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; |
| margin: 0; |
| padding: 30px; |
| background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); |
| } |
| h1 { |
| color: #3a4a6d; |
| text-align: center; |
| margin-bottom: 30px; |
| font-size: 2.2rem; |
| text-shadow: 1px 1px 2px rgba(0,0,0,0.1); |
| } |
| table { |
| width: 100%; |
| border-collapse: separate; |
| border-spacing: 0; |
| margin-bottom: 30px; |
| box-shadow: 0 4px 12px rgba(0,0,0,0.1); |
| border-radius: 12px; |
| overflow: hidden; |
| } |
| th, td { |
| padding: 14px; |
| text-align: center; |
| border-bottom: 1px solid rgba(255,255,255,0.1); |
| } |
| th { |
| background-color: #3a4a6d; |
| color: white; |
| font-weight: 600; |
| letter-spacing: 0.5px; |
| position: sticky; |
| top: 0; |
| } |
| td { |
| background-color: rgba(255,255,255,0.9); |
| } |
| tr:hover td { |
| background-color: rgba(235, 241, 255, 0.9); |
| } |
| .day-column { |
| background-color: #4a5b8b; |
| color: white; |
| font-weight: bold; |
| } |
| .break-row { |
| background-color: #5cb85c !important; |
| color: white; |
| font-weight: bold; |
| } |
| .time-cell { |
| font-weight: 600; |
| color: #3a4a6d; |
| background-color: rgba(58, 74, 109, 0.1) !important; |
| } |
| .note-box { |
| background: white; |
| padding: 15px; |
| border-radius: 8px; |
| max-width: 600px; |
| margin: 0 auto; |
| box-shadow: 0 2px 8px rgba(0,0,0,0.05); |
| text-align: center; |
| font-size: 0.95rem; |
| } |
| .subject-cell { |
| position: relative; |
| transition: all 0.2s ease; |
| } |
| .subject-cell:hover { |
| transform: translateY(-2px); |
| } |
| </style> |
| </head> |
| <body> |
| <h1>Weekly Class Schedule</h1> |
| <table> |
| <thead> |
| <tr> |
| <th>Time</th> |
| <th>Monday</th> |
| <th>Tuesday</th> |
| <th>Wednesday</th> |
| <th>Thursday</th> |
| <th>Friday</th> |
| <th>Saturday</th> |
| </tr> |
| </thead> |
| <tbody> |
| |
| <tr> |
| <td class="time-cell">8:00 - 8:45</td> |
| <td class="subject-cell">Math</td> |
| <td class="subject-cell">English</td> |
| <td class="subject-cell">Science</td> |
| <td class="subject-cell">Hindi</td> |
| <td class="subject-cell">Math</td> |
| <td class="subject-cell">Sports</td> |
| </tr> |
| <tr> |
| <td>8:45 - 9:30</td> |
| <td>English</td> |
| <td>Math</td> |
| <td>Social Studies</td> |
| <td>Science</td> |
| <td>English</td> |
| <td>Sports</td> |
| </tr> |
| |
| <tr> |
| <td>9:30 - 10:15</td> |
| <td>Science</td> |
| <td>Hindi</td> |
| <td>Math</td> |
| <td>English</td> |
| <td>Science</td> |
| <td>Arts</td> |
| </tr> |
| |
| <tr class="break-row"> |
| <td class="time-cell">10:15 - 10:30</td> |
| <td colspan="6">☕ Short Break</td> |
| </tr> |
| |
| <tr> |
| <td>10:30 - 11:15</td> |
| <td>Social Studies</td> |
| <td>Science</td> |
| <td>Hindi</td> |
| <td>Math</td> |
| <td>Computer</td> |
| <td>Library</td> |
| </tr> |
| |
| <tr> |
| <td>11:15 - 12:00</td> |
| <td>Hindi</td> |
| <td>Computer</td> |
| <td>English</td> |
| <td>Social Studies</td> |
| <td>Hindi</td> |
| <td>Music</td> |
| </tr> |
| |
| |
| <tr class="break-row"> |
| <td>12:00 - 12:30</td> |
| <td colspan="6">Lunch Break</td> |
| </tr> |
| |
| |
| <tr> |
| <td>12:30 - 1:15</td> |
| <td>Computer</td> |
| <td>Social Studies</td> |
| <td>Computer</td> |
| <td>Hindi</td> |
| <td>Social Studies</td> |
| <td>Drama</td> |
| </tr> |
| |
| <tr> |
| <td>1:15 - 2:00</td> |
| <td>PT/Activity</td> |
| <td>PT/Activity</td> |
| <td>PT/Activity</td> |
| <td>PT/Activity</td> |
| <td>PT/Activity</td> |
| <td>Clubs</td> |
| </tr> |
| </table> |
| <div class="note-box"> |
| <p><strong>📌 Note:</strong> Saturday is half day with special activities. All timings are subject to change.</p> |
| </div> |
| </body> |
| </html> |
|
|
