Kid Ministry's Rosters
Imports: 9

This is a semi-customizable roster that uses the columns in the list to format the report. In my case, I have the columns be Photo, Name, Birthday (without year), Primary Contact, and Medical Notes in the list. On the report, I have custom Headers since the originals were taking up too much room. I added a spot for checking that the child made it to the room and a spot for when they leave. The "Out" box also includes a spot for the volunteer to write down the Security Code so they make sure to check the parents' tags at the door.

Preview

Report Preview


<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"  }}<br>
          Class Date: ____/____/____<br>
          Service: 1st 2nd
        </div>
      </div>
      <h2>
        {{ list.name }}
        <br>
        <small>
          {{ organization.name }}
        </small>
      </h2>
      <div class="clearfix"></div>
      <table style="width: 100%">
      <thead>
        <tr>
          <th>Photo</th>
          <th>Name</th>
          <th>Birthday</th>
          <th>Primary Contact</th>
          <th>Alerts/Any Notes</th>
          <th>In</th>
          <th>Out/Code</th>
        </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=50x50%23" />
                {% elsif detail.filename %}
                    <a href="{{detail.url}}" target="_blank">{{detail.filename}}</a>
                {% else %}
                  {{ detail }}
                {% endif %}
              </td>
            {% endfor %}
              <td>[__]</td>
              <td> [__]</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    </div>
  </body>
</html>