Skip to content

Commit 2e28fa3

Browse files
committed
Add more customisation points
Rough pattern followed is to wrap sections in a {% block foo %}, but include a {% block foo_extra %} at the end of that section as well, allowing for multiple ways of customising – full overrides or easy additions. Note: {{block.super}} will achieve similar, but isn't as nice an API.
1 parent af0a016 commit 2e28fa3

File tree

2 files changed

+93
-81
lines changed

2 files changed

+93
-81
lines changed

response/templates/response/base.html

Lines changed: 27 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -5,33 +5,34 @@
55
<html lang="en">
66

77
<head>
8-
<title>
9-
{% block title %}
10-
Response
8+
{% block head %}
9+
<title>
10+
{% block title %}
11+
Response
12+
{% endblock %}
13+
</title>
14+
15+
{% block favicon %}
16+
<link rel="shortcut icon" href="{% static 'images/favicon.png' %}">
1117
{% endblock %}
12-
</title>
1318

14-
{% block favicon %}
15-
<link rel="shortcut icon" href="{% static 'images/favicon.png' %}">
16-
{% endblock %}
19+
{% block meta %}
20+
<meta charset="utf-8">
21+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
22+
<meta name="description" content="Response">
23+
<meta name="author" content="Monzo">
24+
<meta name="mobile-web-app-capable" content="yes">
25+
<meta name="apple-mobile-web-app-capable" content="yes">
26+
{% endblock %}
1727

18-
{% block meta %}
19-
<meta charset="utf-8">
20-
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
21-
<meta name="description" content="Response">
22-
<meta name="author" content="Monzo">
23-
<meta name="mobile-web-app-capable" content="yes">
24-
<meta name="apple-mobile-web-app-capable" content="yes">
25-
{% endblock %}
28+
{% block static %}
29+
<link rel="manifest" href="{% static 'manifest.json' %}">
30+
<link href="{% static 'bootstrap/css/bootstrap.css' %}" rel="stylesheet">
31+
<link href="{% static 'common.css' %}" rel="stylesheet">
32+
{% endblock %}
2633

27-
{% block static %}
28-
<link rel="manifest" href="{% static 'manifest.json' %}">
29-
<link href="{% static 'bootstrap/css/bootstrap.css' %}" rel="stylesheet">
30-
<link href="{% static 'common.css' %}" rel="stylesheet">
34+
{% block head_extra %}{% endblock %}
3135
{% endblock %}
32-
33-
{% block head %}{% endblock %}
34-
3536
</head>
3637

3738
<body>
@@ -87,8 +88,10 @@
8788
</div>
8889

8990
<!-- Bootstrap core JavaScript -->
90-
<script src="{% static 'bootstrap/js/bootstrap.bundle.min.js' %}"></script>
91-
{% block javascript %}{% endblock %}
91+
{% block javascript %}
92+
<script src="{% static 'bootstrap/js/bootstrap.bundle.min.js' %}"></script>
93+
{% block javascript_extra %}{% endblock %}
94+
{% endblock %}
9295

9396
</body>
9497

response/templates/response/incident_doc.html

Lines changed: 66 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
Inc #{{ incident.pk }} – {{ block.super }}
99
{% endblock %}
1010

11-
{% block head %}
11+
{% block head_extra %}
1212
<link rel="stylesheet" href="{% static 'incident_doc.css' %}">
1313
{% endblock %}
1414

@@ -39,70 +39,79 @@ <h1 id="title">
3939
<div class="bg-white p-4">
4040

4141
{% comment %} ----- Summary ----- {% endcomment %}
42-
<h2>Summary</h2>
43-
<p>
44-
{% if incident.summary %}
45-
{{ incident.summary|unslackify|markdown_filter|safe }}
46-
{% endif %}
47-
</p>
42+
{% block incident_summary %}
43+
<h2>Summary</h2>
44+
<p>
45+
{% if incident.summary %}
46+
{{ incident.summary|unslackify|markdown_filter|safe }}
47+
{% endif %}
48+
</p>
49+
{% endblock %}
50+
51+
{% block incident_data %}
52+
<ul class="summary-data">
53+
{% if incident.impact %}
54+
<li>
55+
<span>Impact:</span>{{ incident.impact|unslackify|markdown_filter|safe }}
56+
</li>
57+
{% endif %}
58+
59+
<li><span>Reporter:</span>{{ incident.reporter.display_name }}</li>
60+
61+
{% if incident.lead %}
62+
<li><span>Lead:</span>{{ incident.lead.display_name }}</li>
63+
{% endif %}
4864

49-
<ul class="summary-data">
50-
{% if incident.impact %}
5165
<li>
52-
<span>Impact:</span>{{ incident.impact|unslackify|markdown_filter|safe }}
66+
<span>Start Time:</span>
67+
{% if incident.start_time %}{{ incident.start_time }}{% endif %}
5368
</li>
54-
{% endif %}
55-
56-
<li><span>Reporter:</span>{{ incident.reporter.display_name }}</li>
57-
58-
{% if incident.lead %}
59-
<li><span>Lead:</span>{{ incident.lead.display_name }}</li>
60-
{% endif %}
61-
62-
<li>
63-
<span>Start Time:</span>
64-
{% if incident.start_time %}{{ incident.start_time }}{% endif %}
65-
</li>
66-
<li>
67-
<span>Report Time:</span>
68-
{% if incident.report_time %}{{ incident.report_time }}{% endif %}
69-
</li>
70-
71-
{% if incident.is_closed %}
72-
<li><span>End Time:</span>{{ incident.end_time }}</li>
73-
<li><span>Duration:</span>{{ incident.duration}}</li>
74-
{% endif %}
75-
76-
{% if user_stats %}
7769
<li>
78-
<span>Participants:</span>
79-
<ul id="participant">
80-
{% for stats in user_stats %}
81-
<li>
82-
{{ stats.user.display_name }} ({{stats.message_count}} messages)
83-
</li>
84-
{% endfor %}
85-
</ul>
70+
<span>Report Time:</span>
71+
{% if incident.report_time %}{{ incident.report_time }}{% endif %}
8672
</li>
87-
{% endif %}
88-
</ul>
73+
74+
{% if incident.is_closed %}
75+
<li><span>End Time:</span>{{ incident.end_time }}</li>
76+
<li><span>Duration:</span>{{ incident.duration}}</li>
77+
{% endif %}
78+
79+
{% if user_stats %}
80+
<li>
81+
<span>Participants:</span>
82+
<ul id="participant">
83+
{% for stats in user_stats %}
84+
<li>
85+
{{ stats.user.display_name }} ({{stats.message_count}} messages)
86+
</li>
87+
{% endfor %}
88+
</ul>
89+
</li>
90+
{% endif %}
91+
92+
{% block incident_data_extra %}
93+
{% endblock %}
94+
</ul>
95+
{% endblock %}
8996

9097
{% comment %} ----- Timeline ----- {% endcomment %}
91-
<h2>Timeline</h2>
92-
{% if events %}
93-
<div class="timeline">
94-
{% for event in events.all %}
95-
<div class="container">
96-
<div class="content">
97-
<strong>
98-
{{ event.icon|safe }}{{ event.timestamp|date:"H:i:s" }}
99-
</strong>
100-
{{ event|stringformat:'s'|unslackify|markdown_filter|safe }}
98+
{% block incident_timeline %}
99+
<h2>Timeline</h2>
100+
{% if events %}
101+
<div class="timeline">
102+
{% for event in events.all %}
103+
<div class="container">
104+
<div class="content">
105+
<strong>
106+
{{ event.icon|safe }}{{ event.timestamp|date:"H:i:s" }}
107+
</strong>
108+
{{ event|stringformat:'s'|unslackify|markdown_filter|safe }}
109+
</div>
101110
</div>
102-
</div>
103-
{% endfor %}
104-
</div>
105-
{% endif %}
111+
{% endfor %}
112+
</div>
113+
{% endif %}
114+
{% endblock %}
106115

107116
</div>
108117
</div>

0 commit comments

Comments
 (0)