You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

61 lines
2.5 KiB
HTML

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Osina</title>
<link rel="stylesheet" type="text/css" href='{% static "dist/output.css" %}'>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
</head>
<body class="font-poppinsLight">
<div id="hiddenContent">
<h1 class="text-secondosiblue text-2xl font-semibold text-center mb-2">Timeline</h1>
<div class="overflow-x-auto border border-gray-300 rounded-md mt-5">
<table class="min-w-full divide-y">
<thead>
<tr>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase bg-gray-100 border-r border-gray-300 whitespace-nowrap">
Date</th>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercasen bg-gray-100 whitespace-nowrap">
Total Time Worked</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
{% for date, total_hours, total_minutes, total_seconds in formatted_totals %}
<tr>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">{{ date }}</td>
<td class="px-6 py-4 text-center text-sm"> <p>
{% if total_hours == 1 %}
{{ total_hours }}hr,
{% else %}
{{ total_hours }}hrs,
{% endif %}
{% if total_minutes == 1 %}
{{ total_minutes }}min,
{% else %}
{{ total_minutes }}mins,
{% endif %}
{% if total_seconds == 1 %}
{{ total_seconds }}sec
{% else %}
{{ total_seconds }}secs
{% endif %}
</p></td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</body>
</html>