134 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			134 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <style>
 | ||
|  table.calendar > * {
 | ||
|      font-family: sans;
 | ||
|  }
 | ||
| 
 | ||
|  table.calendar {
 | ||
|      width: 100%;
 | ||
|      border-collapse: collapse;
 | ||
|      table-layout: fixed;
 | ||
|  }
 | ||
| 
 | ||
|  tr.month > td {
 | ||
|      text-align: center;
 | ||
|      font-weight: bold;
 | ||
|      border-bottom: 2px solid black;
 | ||
|      padding-bottom: .5em;
 | ||
|  }
 | ||
| 
 | ||
|  tr.month > td > a {
 | ||
|      font-weight: normal;
 | ||
|      color: black;
 | ||
|  }
 | ||
| 
 | ||
|  tr.month > td.month-name > a {
 | ||
|      font-weight: bold;
 | ||
|  }
 | ||
| 
 | ||
|  tr.days > td {
 | ||
|      text-align: center;
 | ||
|      border-bottom: 2px solid black;
 | ||
|  }
 | ||
| 
 | ||
|  tr.week > td {
 | ||
|      height: 3em;
 | ||
|  }
 | ||
| 
 | ||
|  tr.week > td > span.day-num {
 | ||
|      font-weight: bold;
 | ||
|  }
 | ||
| 
 | ||
|  tr.week > td.other-month > span.day-num {
 | ||
|      font-weight: normal;
 | ||
|      color: #909090;
 | ||
|  }
 | ||
| 
 | ||
|  tr.week > td.today {
 | ||
|      background-color: #d8d8d8;
 | ||
|  }
 | ||
| 
 | ||
|  tr.week > td > a.event {
 | ||
|      display: block;
 | ||
|      color: black;
 | ||
|      text-decoration: none;
 | ||
|      border: 1px solid green;
 | ||
|      background-color: white;
 | ||
|      border-radius: 2px;
 | ||
|      text-overflow: ellipsis;
 | ||
|      white-space: nowrap;
 | ||
|      overflow: hidden;
 | ||
|  }
 | ||
| 
 | ||
|  tr.sizer > td {
 | ||
|      width: 14.2857%;
 | ||
|      height: 0;
 | ||
|  }
 | ||
| </style>
 | ||
| <table class="calendar">
 | ||
|     <thead>
 | ||
|         <tr class="sizer">
 | ||
|             <td></td>
 | ||
|             <td></td>
 | ||
|             <td></td>
 | ||
|             <td></td>
 | ||
|             <td></td>
 | ||
|             <td></td>
 | ||
|             <td></td>
 | ||
|         </tr>
 | ||
|         <tr class="month">
 | ||
|             <td>
 | ||
|                 <a href="{{ url_for('hello', date=calendar.prev_year) }}">« {{ calendar.prev_year_year }}</a>
 | ||
|             </td>
 | ||
|             <td>
 | ||
|                 <a href="{{ url_for('hello', date=calendar.prev_month) }}">‹ {{ calendar.prev_month_name }}</a>
 | ||
|             </td>
 | ||
|             <td colspan="3" class="month-name">
 | ||
| {% if not calendar.has_today %}
 | ||
|                 <a href="{{ url_for('hello', date=now_ts) }}">
 | ||
| {% endif %}
 | ||
|                     {{ calendar.month }}
 | ||
| {% if not calendar.has_today %}
 | ||
|                 </a>
 | ||
| {% endif %}
 | ||
|             </td>
 | ||
|             <td>
 | ||
|                 <a href="{{ url_for('hello', date=calendar.next_month) }}">{{ calendar.next_month_name }} ›</a>
 | ||
|             </td>
 | ||
|             <td>
 | ||
|                 <a href="{{ url_for('hello', date=calendar.next_year) }}">{{ calendar.next_year_year }} »</a>
 | ||
|             </td>
 | ||
|         </tr>
 | ||
|         <tr class="days">
 | ||
| {% for day in calendar.day_names %}
 | ||
|             <td>
 | ||
|                 {{ day }}
 | ||
|             </td>
 | ||
| {% endfor %}
 | ||
|         </tr>
 | ||
|     </thead>
 | ||
|     <tbody>
 | ||
| {% set markers = namespace() -%}
 | ||
| {% set markers.first = true -%}
 | ||
| {% for day in calendar.days -%}
 | ||
|     {% if loop.index0 % (calendar.day_names) | length == 0 -%}
 | ||
|         {% if not markers.first %}
 | ||
|         </tr>
 | ||
|         {%- else %}
 | ||
|             {%- set markers.first = false %}
 | ||
|         {%- endif %}
 | ||
|         <tr class="week">
 | ||
|     {%- endif %}
 | ||
|             <td class="{% if day.month != calendar.timestamp.month %} other-month{% endif %}{% if day.date() == now.date() %} today{% endif %}">
 | ||
|                 <span class="day-num">{{ day.day }}</span>
 | ||
|     {% for event in calendar.day_events(day, user=current_user) %}
 | ||
|                 <a href="{{ url_for('event_details', event_id=event.id) }}" class="event">
 | ||
|                     {{ event.start_time_for_user(current_user).strftime('%H:%M') }}–{{ event.end_time_for_user(current_user).strftime('%H:%M') }}
 | ||
|                     {{ event.title }}
 | ||
|                 </a>
 | ||
|     {% endfor %}
 | ||
|             </td>
 | ||
| {% endfor %}
 | ||
|         </tr>
 | ||
|     </tbody>
 | ||
| </table>
 |