Use bootstrap for UI, abstracted into a base template

makes web interface look a bit less terrible

also changed to extensions recognized by web-mode for Django Templates
This commit is contained in:
Adam Goldsmith 2020-12-11 14:29:18 -05:00
parent a005ab151b
commit 99ee47052c
9 changed files with 115 additions and 55 deletions

View File

@ -0,0 +1,30 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<title>{% block title %}{% endblock %}</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="/">RecMaint</a>
<div class="collapse navbar-collapse">
<div class="navbar-nav ml-auto">
<a class="nav-item nav-link" href="/admin"> Admin </a>
</div>
</div>
</nav>
<div id="content" class="m-3">
{% block content %}{% endblock %}
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>

View File

@ -0,0 +1,27 @@
{% extends "./base.djhtml" %}
{% block title %} RecMaint {% endblock %}
{% block content %}
<h1> Tools </h1>
{% if tools %}
<ul>
{% for tool in tools %}
<li><a href="{{ tool.get_absolute_url }}">{{ tool.name }}</a></li>
{% endfor %}
</ul>
{% else %}
<p>No tools are available.</p>
{% endif %}
<h1> Tasks </h1>
{% if tasks %}
<ul>
{% for task in tasks %}
<li><a href="{{ task.get_absolute_url }}">{{ task.name }}</a> - last at {{ task.last_event.date|date }}, next at {{ task.next_recurrence|date }} </li>
{% endfor %}
</ul>
{% else %}
<p>No tasks are available.</p>
{% endif %}
{% endblock %}

View File

@ -1,21 +0,0 @@
<h1> Tools </h1>
{% if tools %}
<ul>
{% for tool in tools %}
<li><a href="{{ tool.get_absolute_url }}">{{ tool.name }}</a></li>
{% endfor %}
</ul>
{% else %}
<p>No tools are available.</p>
{% endif %}
<h1> Tasks </h1>
{% if tasks %}
<ul>
{% for task in tasks %}
<li><a href="{{ task.get_absolute_url }}">{{ task.name }}</a> - last at {{ task.last_event.date|date }}, next at {{ task.next_recurrence|date }} </li>
{% endfor %}
</ul>
{% else %}
<p>No tasks are available.</p>
{% endif %}

View File

@ -0,0 +1,37 @@
{% extends "./base.djhtml" %}
{% block title %} {{ tool.name }} - {{ task.name }} | RecMaint {% endblock %}
{% block content %}
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/">Home</a></li>
<li class="breadcrumb-item"><a href="{{ tool.get_absolute_url }}">{{ tool.name }}</a></li>
<li class="breadcrumb-item active" aria-current="page">{{ task.name }}</li>
</ol>
</nav>
<p> Next scheduled time: {{ task.next_recurrence|date }} </p>
<p> Overdue: {{ task.is_overdue }} </p>
<form method="post">
{% csrf_token %}
{{ form }}
<input type="submit" value="Submit">
</form>
<table>
<tr>
<th> Date </th>
<th> User </th>
<th> Notes </th>
</tr>
{% for event in events %}
<tr>
<td> {{ event.date }} </td>
<td> {{ event.user }} </td>
<td> {{ event.notes }} </td>
</tr>
{% endfor %}
</table>
{% endblock %}

View File

@ -1,25 +0,0 @@
<h1><a href="{{ tool.get_absolute_url }}">{{ tool }}</a></h1>
<h2> {{ task.name }} </h2>
<p> Next scheduled time: {{ task.next_recurrence|date }} </p>
<p> Overdue: {{ task.is_overdue }} </p>
<form method="post">
{% csrf_token %}
{{ form }}
<input type="submit" value="Submit">
</form>
<table>
<tr>
<th> Date </th>
<th> User </th>
<th> Notes </th>
</tr>
{% for event in events %}
<tr>
<td> {{ event.date }} </td>
<td> {{ event.user }} </td>
<td> {{ event.notes }} </td>
</tr>
{% endfor %}
</table>

View File

@ -0,0 +1,18 @@
{% extends "./base.djhtml" %}
{% block title %} {{ tool }} {% endblock %}
{% block content %}
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">{{ tool }}</li>
</ol>
</nav>
<ul>
{% for task in tasks %}
<li><a href="{{ task.get_absolute_url }}">{{ task.name }}</a></li>
{% endfor %}
</ul>
{% endblock %}

View File

@ -1,6 +0,0 @@
<h1> {{ tool }} </h1>
{% for task in tasks %}
<li><a href="{{ task.get_absolute_url }}">{{ task.name }}</a></li>
{% endfor %}

View File

@ -12,7 +12,7 @@ def index(request):
'tools': Tool.objects.all(),
'tasks': Task.objects.all(),
}
return render(request, 'tasks/index.html', context)
return render(request, 'tasks/index.djhtml', context)
def toolDetail(request, asset_tag):
@ -22,7 +22,7 @@ def toolDetail(request, asset_tag):
'tool': tool,
'tasks': tasks,
}
return render(request, 'tasks/toolDetail.html', context)
return render(request, 'tasks/toolDetail.djhtml', context)
def taskDetail(request, asset_tag, task_slug):
@ -48,4 +48,4 @@ def taskDetail(request, asset_tag, task_slug):
'events': events,
'form': form,
}
return render(request, 'tasks/taskDetail.html', context)
return render(request, 'tasks/taskDetail.djhtml', context)