Custom Tab Matrix
This custom tab Matrix was commissioned by Dare to Imagine Church in Philadelphia, PA! Simply turn on custom tab fields in the list view and if they have data they will be represented by a check mark on the Custom Tab Matrix Report.
Preview
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<html lang="en">
<head>
<meta charset="utf-8">
{{ helpers.bootstrap_3 }}
<!-- This report is styled using the Bootstrap framework. http://getbootstrap.com/css/
If you'd rather provide your own styles, add them to the style section below. -->
<style>
@page {margin: .125in;} /*-- PDF margin reset --*/
tr.person > td {
padding: 0.25em; }
tr:nth-child(even) { background-color: #edf2f7 !important; }
thead {
border-bottom: 1px solid #bec9d3; }
th { padding: .5em; }
.avatar {
width: 50px;
height: 50px;
border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-webkit-border-radius: 25px 25px 25px 25px;
}
.container {
width: 100%;
padding-top: 15px;
}
</style>
</head>
<body>
<div class="container">
<div class="pull-right">
<div class="well well-sm text-right">
{{ people.size }} {{ people.size | pluralize: "person", "people" }}<br>
Report Date: {{ list.updated_at | date: "%B %e, %Y" }}
</div>
</div>
<h2>
{{ list.name }}
<br>
<small>
{{ organization.name }}
</small>
</h2>
<div class="clearfix"></div>
<table style="width: 100%">
<thead>
<tr>
{% for column in list.columns %%}
{% if column.name == "Photo" %}
<th style="text-align: left">Photo</th>
{% elsif column.name == "Name" %}
<th style="text-align: left">Name</th>
{% elsif column.name == "Primary Email" %}
<th style="text-align: left">Email</th>
{%elsif column.name == "Primary Phone Number" %}
<th style="text-align: left">Phone</th>
{% else %}
{% assign cname_array = column.name | split: " " %}
<th style="text-align: left">{{cname_array[0] | truncate: 1, "" | append: " " | append: cname_array[1] | truncate: 3, "" }}</th>
{% endif %}
{% endfor %}
</tr>
</thead>
<tbody>
{% for result in results %}
<tr class="person">
{% for column in list.columns %%}
<td>
{% assign detail = column | column_detail column, result %}
{% if column.identifier == "people.photo" %}
<img class="avatar" src="{{ detail }}?g=150x150%23" />
{% elsif detail.filename %}
<a href="{{detail.url}}" target="_blank">{{detail.filename}}</a>
{% elsif column.identifier == "people.name" %}
{{ detail }}
{% elsif column.identifier == "emails.address" %}
{{ detail }}
{% elsif column.identifier == "phone_numbers.number" %}
{{ detail }}
{% else %}
{% if detail %}
{% assign cname_array = column.name | split: " " %}
<div class="text-success">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check-circle-fill" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</svg>
</div>
{% endif %}
{% endif %}
</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
</body>
</html>