diff --git a/browser/configure.zcml b/browser/configure.zcml
index 6f9c0ff..ca2746c 100644
--- a/browser/configure.zcml
+++ b/browser/configure.zcml
@@ -13,7 +13,10 @@
         />
 
   <!-- a tableless layout skin -->
-
   <include package=".liquid" />
 
+  <!-- a layout skin that may be used for sites employing the loops
+       package, but not depending on loops -->
+  <include package=".loops" />
+
 </configure>
diff --git a/browser/liquid/view_macros.pt b/browser/liquid/view_macros.pt
index 58b1a35..e452af3 100644
--- a/browser/liquid/view_macros.pt
+++ b/browser/liquid/view_macros.pt
@@ -16,13 +16,13 @@
     <tal:css repeat="macro controller/macros/css">
       <metal:css use-macro="macro" />
     </tal:css>
-    <metal:block define-slot="ecmascript_slot" />
+    <metal:block define-slot="css_slot" />
 
     <metal:block metal:define-slot="headers">
       <tal:js repeat="macro controller/macros/js">
         <metal:css use-macro="macro" />
       </tal:js>
-      <!--<span metal:use-macro="context/@@standard_macros/navigation_tree_js" />-->
+      <ignore_metal:js use-macro="context/@@standard_macros/navigation_tree_js" />
     </metal:block>
     <metal:block define-slot="ecmascript_slot" />
 
@@ -44,7 +44,7 @@
 
     <div id="menu">
       <metal:menu define-slot="navigators">
-        <span metal:use-macro="context/@@standard_macros/navigation_tree_box" />
+        <ignore_metal:navtree use-macro="context/@@standard_macros/navigation_tree_box" />
         <div class="box" id="commonTasks"
              tal:define="view context/@@commonTasks|nothing"
              tal:condition="view/strip|nothing">
diff --git a/browser/loops/__init__.py b/browser/loops/__init__.py
new file mode 100644
index 0000000..cfdbeb8
--- /dev/null
+++ b/browser/loops/__init__.py
@@ -0,0 +1,9 @@
+"""
+$Id$
+"""
+
+from zope.publisher.interfaces.browser import IBrowserRequest
+
+class liquid(IBrowserRequest):
+    """The `liquid` layer."""
+
diff --git a/browser/loops/configure.zcml b/browser/loops/configure.zcml
new file mode 100644
index 0000000..da5f603
--- /dev/null
+++ b/browser/loops/configure.zcml
@@ -0,0 +1,18 @@
+<!-- $Id$ -->
+
+<configure
+   xmlns:zope="http://namespaces.zope.org/zope"
+   xmlns="http://namespaces.zope.org/browser"
+   i18n_domain="zope"
+   >
+
+  <layer name="loops" />
+
+  <skin name="Loops"
+        layers="loops rotterdam default" />
+    
+  <resource name="zope3_tablelayout.css" file="loops_layout.css" layer="loops" />
+  <resource name="favicon.png" file="loops_favicon.png" layer="loops" />
+  <resource name="zope3logo.gif" file="loops_logo.png" layer="loops" />
+
+</configure>
diff --git a/browser/loops/loops_favicon.png b/browser/loops/loops_favicon.png
new file mode 100644
index 0000000..1fc7485
Binary files /dev/null and b/browser/loops/loops_favicon.png differ
diff --git a/browser/loops/loops_layout.css b/browser/loops/loops_layout.css
new file mode 100644
index 0000000..a965799
--- /dev/null
+++ b/browser/loops/loops_layout.css
@@ -0,0 +1,669 @@
+/*
+** Zope3 style sheet for CSS2-capable browsers.
+** For future skin see zope.app.boston.
+*/
+
+/*
+* { border: 1px dotted red }
+*/
+
+
+/* Basic Elements */
+
+body {
+    font: 85% Helvetica, Arial, sans-serif;
+    background: White;
+    /* color: Black; */
+    color: #202020;
+    margin: 0;
+    padding: 0;
+/* These work in IE only, changes the look of the scrollbar + textareas */
+    scrollbar-base-color: White;
+    scrollbar-highlight-color: White;
+    scrollbar-track-color: #F8F8F8;
+    scrollbar-darkshadow-color: #F8F8F8;
+    /* scrollbar-3dlight-color: x369; */
+    scrollbar-3dlight-color: #344080;
+    scrollbar-shadow-color: #344080;
+    scrollbar-arrow-color: Black;
+}
+
+table {
+    border-collapse: collapse;
+    font-size: 100%;
+}
+
+a {
+    text-decoration: none;
+    color: #344080;
+    background-color: transparent;
+}
+
+a[href]:active {
+    text-decoration: underline;
+}
+
+img {
+    border: none;
+    vertical-align: middle;
+}
+
+p {
+    margin: 0.5em 0em 1em 0em;
+    line-height: 1.5em;
+}
+
+p a:visited {
+    color: Purple;
+    background-color: transparent;
+}
+
+p a:active {
+    color: Red;
+    background-color: transparent;
+}
+
+p img {
+    border: 0;
+    margin: 0;
+}
+
+
+hr {
+    clear: both;
+    height: 1px;
+    color: #344080;
+    background-color: transparent;
+}
+
+
+h1, h2, h3, h4, h5, h6 {
+    color: #202020;
+    clear: left;
+    font: 100% bold Verdana, Helvetica, Arial, sans-serif;
+    margin: 0;
+    padding-top: 0.5em;
+    border-bottom: 1px solid #344080;
+}
+
+h1 {
+    font-size: 160%;
+}
+
+h2 {
+    font-size: 150%;
+}
+
+h3 {
+    font-size: 140%;
+}
+
+h4 {
+    font-size: 120%;
+}
+
+h5 {
+    font-size: 100%;
+}
+
+h6 {
+    font-size: 80%;
+}
+
+ul {
+    line-height: 1.5em;
+    /* list-style-image: url("bullet.gif"); */
+    margin-left: 2em;
+    padding:0;
+}
+
+ol {
+    line-height: 1.5em;
+    margin-left: 2em;
+    padding:0;
+}
+
+dl {
+}
+
+dt {
+    font-weight: bold;
+}
+
+dd {
+    line-height: 1.5em;
+    margin-bottom: 1em;
+}
+
+
+fieldset {
+    border: 1px solid #A0A0A0;
+    /*
+    margin: 2em 0em 1em 0em;
+    padding: 1em 0em;
+    */
+    margin: 0em 0em 2em 0em;
+    padding: 0 1em 1em 1em;
+}
+
+legend {
+    background: White;
+    padding: 0.5em;
+}
+
+
+form {
+    border: none;
+    margin: 0;
+}
+
+textarea {
+    color: #202020;
+    width: 88%;
+    padding: 0.1em;
+}
+
+input {
+    font: normal 100% Verdana, Helvetica, Arial, sans-serif;
+    color: #202020;
+    vertical-align: middle;
+    margin-bottom: 1px; /* IE bug fix */
+    padding: 0.1em;
+}
+
+select {
+    font: normal 100% Verdana, Helvetica, Arial, sans-serif;
+    vertical-align: top;
+}
+
+abbr, acronym, .explain {
+    border-bottom: 1px dotted #202020;
+    color: #202020;
+    background-color: transparent;
+    cursor: help;
+}
+
+q {
+    font-family: Times, "Times New Roman", serif;
+    font-style: italic;
+    font-size: 120%;
+}
+
+blockquote {
+    font-family: Times, "Times New Roman", serif;
+    font-style: italic;
+    font-size: 120%;
+}
+
+code {
+    font-size: 120%;
+    color: #202020;
+    background-color: #CCCCCC;
+}
+
+pre {
+    font-size: 120%;
+    padding: 1em;
+    border: 1px solid #A0A0A0;
+    color: #202020;
+    background-color: #CCCCCC;
+}
+
+.netscape4 {
+    display: none;
+}
+
+/* layout table
+*/
+
+#layout {
+    width: 100%;
+    table-layout: auto;
+    font-size: 100%;
+    border-collapse: collapse;
+    padding: 0px;
+    margin: 0px;
+}
+
+#layout td {
+    vertical-align: top;
+}
+
+#layout td.global {
+    width: 100%;
+}
+
+#layout td.navigators {
+    width: 200px;
+}
+
+#layout td.workspace {
+}
+
+
+/*  Styles for xmltree
+*/
+
+#navtreecontents {  
+    padding-right: 35px;
+}
+
+#navtreecontents a {
+       cursor: pointer;
+       height: 20px;
+}
+
+#navtreecontents loading {
+       display: block;
+       padding-left: 31px;
+       height: 18px;
+}
+
+#navtreecontents expand {
+       background-repeat: no-repeat;
+       padding-left: 14px;
+       display: inline;
+       cursor: pointer;
+}
+
+#navtreecontents icon {
+       background-repeat: no-repeat;
+       padding-left: 20px;
+       display: inline;
+       cursor: auto;
+}
+
+#navtreecontents collection {
+       display: block;
+       margin-left: 10px;
+/*     border: red solid 1pt;  */
+       height: auto;
+}
+
+
+/* Structural elements 
+*/
+
+#top {
+    border-bottom: 0.1em solid #a0a0a0;
+}
+
+#top #userDetails {
+    float:right;
+    margin-top: 1.2em;
+    padding-right: 0.5em;
+}
+
+div#action {
+    height: 18px;
+    width: 100%;
+    /*background-color: #336699;*/
+    background-color: #6d80b0;
+}
+
+div#action ul {
+    line-height: 18px;
+    color: #FFF;
+    white-space: nowrap;
+    float: right;
+    margin: 0px;
+    padding: 0px 5px 0px 0px;
+}
+
+div#action li {
+    list-style-type: none;
+    display: inline;
+}
+
+div#action li a {
+    color: #FFF;
+    text-decoration: none;
+    border-left: 1px dashed white;
+    padding: 0px 5px;
+}
+
+div#action li a:link {
+    color: #FFF:
+}
+
+div#action li a:hover {
+    color: #202020;
+    background-color: white;
+}
+
+#breadcrumbs {
+    margin: 0;
+    padding: 5px 5px 5px 5px;
+}
+
+#navigation {
+    width: 200px;
+    vertical-align: top;
+    padding: 0px;
+    margin: 0px;
+}
+
+#navigators {
+    padding: 10px 20px 0px 5px;
+}
+
+/* slot boxes
+*/
+
+div.box {
+    background: #CCCCCC;
+    border-right: 1px solid #CCCCCC;
+    border-left: 1px solid #CCCCCC;
+    margin-bottom: 10px;
+    padding: 0px;
+}
+
+div.box h4 {
+    background: #CCCCCC;
+    border: 1px solid #CCCCCC;
+    border-style: solid solid none solid;
+    color: #606060;
+    padding: 0px 5px;
+    display: block;
+    height: 18px;
+}
+
+.box div.body {
+    background: white;
+    border-bottom: 1px solid #CCCCCC;
+}
+
+.box div.body div {
+    color: #777777;
+    padding: 2px 0px 5px 5px;
+    margin: 0px;
+}
+
+.box div.treebody {
+    background: white;
+    border-bottom: 1px solid #CCCCCC;
+}
+
+.box div.treebody table {
+    margin: 2px;
+}
+
+.box div.body div.tip {
+    color: #B30000;
+    padding: 2px 0px 5px 5px;
+}
+
+.box div.body div.even {
+    background: #EBEBE2;
+    padding: 4px;
+}
+
+.box div.body div.odd {
+    padding: 4px;
+}
+
+.box div.body a:hover {
+    text-decoration: underline;
+}
+
+.box .content {
+    padding: 0.5em;
+}
+
+.box h1,
+.box h2,
+.box h3,
+.box h4 {
+    margin: 0;
+}
+
+
+#content {
+}
+
+#context_information {
+    padding-top: 1em;
+    width: 15%;
+    float: left;
+    padding-left: 0.5em;
+}
+
+#workspace {
+    width: 100%;
+}
+
+#helpers {
+}
+
+#inspectors {
+}
+
+#footer {
+    border-bottom: 1px solid #202020;
+    float: left;
+    clear: both;
+}
+
+input.textType {
+    width: 88%; /* Same as textarea */
+}
+
+input.editcheck {
+    float:left;
+    position:relative;
+    top:1em;
+}
+
+div.row {
+    padding-top: 1em;
+}
+
+/*
+div.label {
+    #clear: both;
+    padding-top: 10px;
+}
+*/
+
+/* div.row div.field doesn't appear to be selecting. div.row div
+       is a workaround */
+/* This seems to work in Firefox 1.0 and IE6. */
+
+div.row div.field {
+    clear: left;
+    padding-top: 1px;
+}
+
+div.row div.label {
+    background: #6d80b0;
+    color: #fff;
+    padding: 0.1em 0.5em 0.1em 0.5em; /* Same as .itemViews */
+    border: 1px solid #6d80b0; /* Same as .itemViews */
+    margin: 0;
+    float: left;
+    clear: both;
+}
+
+div.row span.error {
+    background: red;
+    color: white;
+    padding: 0.1em 0.5em 0.1em 0.5em; /* Same as .itemViews */
+    border: 1px solid red; /* Same as .itemViews */
+    margin: 0;
+    float: left;
+    clear: both;
+}
+/*
+div.row div.error:before {
+    content: "\2190  "; /* Left pointing arrow */
+}
+*/
+
+#metadata .label {
+    font-size: 80%;
+}
+
+.itemViews {
+    background: transparent;
+    border-collapse: collapse;
+    border-bottom: 1px solid #6d80b0;
+    padding-top: 1px;
+    padding-bottom: 1px;
+    padding-left: 1em;
+    margin-top: 0.8em;
+    white-space: nowrap;
+}
+
+.itemViews a {
+    background: transparent;
+    border: 1px solid #6d80b0;
+    color: #202020;
+    font-weight: normal;
+    margin-right: 0.5em;
+    padding: 0.1em 0.5em 0.1em 0.5em;
+}
+
+.itemViews a.selected {
+    background: #6d80b0;
+    border-bottom: #6d80b0 1px solid;
+    color: White;
+    font-weight: normal;
+}
+
+
+.itemViews a:hover {
+    background-color: #6d80b0;
+    color: White;
+}
+
+#viewspace {
+    border-collapse: collapse;
+    margin: 0;
+}
+
+table.listingdescription, table.listing {
+    /* The default table for document listings. Contains name, document types, modification times etc in a file-browser-like fashion */
+    border-collapse: collapse;
+    border-left: 1px solid #CCCCCC;
+    border-bottom: 1px solid #CCCCCC;
+    margin: 1em 0em 1em 0em;
+/*    clear: both; */
+}
+
+table.listingdescription {
+    width: 100%;
+}
+
+table.listingdescription th, table.listing th {
+    background: #CCCCCC;
+    border-top: 1px solid #CCCCCC;
+    border-bottom: 1px solid #CCCCCC;
+    border-right: 1px solid #CCCCCC;
+    color: #808080;
+    font-weight: normal;
+    padding: 0em 1em 0em 1em;
+    white-space: nowrap;
+}
+
+table.listingdescription td.top, table.listing td.top {
+    border-left: 1px solid White;
+    border-top: 1px solid White ! important;
+    border-right: 1px solid White ! important;
+    text-align: right ! important;
+    padding: 0em 0em 1em 0em;
+    /* insane IE row bug workaround */
+    position: relative;
+    left: -1px;
+    top: -1px;
+}
+
+table.listingdescription tr.odd, table.listing tr.odd {
+    /*every second line should be shaded */
+    background: White;
+}
+
+table.listingdescription tr.even, table.listing tr.even {
+    background: #F8F8F8;
+}
+
+table.listing td {
+    border-right: 1px solid #CCCCCC;
+    padding: 0em 0.3em;
+    text-align: left;
+    white-space: nowrap;
+}
+
+
+table.listingdescription img, table.listing img {
+    vertical-align: middle;
+}
+
+table.listingdescription td {
+    border-right: 1px solid #CCCCCC;
+    padding: 5px;
+    text-align: left;
+}
+
+
+/*colorize the matrix table used in grant.html*/
+table.matrix td.default {
+    background: green;
+}
+
+
+table.matrix td.changed {
+    background: red;
+}
+
+
+div.spacer {
+    clear: both;
+}
+
+
+.registrationSummary {
+    margin-left: 2em;
+    margin-bottom: 1em;
+}
+.registrationSummary .usageSummary {
+    font-weight: bold;
+}
+.registrationSummary .modificationLink {
+    display: block;
+}
+
+
+div.message {
+    background: #FFCE7B;
+    border: 1px solid #FFA500;
+    color: #202020;
+    font: bold 80% Verdana, Helvetica, Arial, sans-serif;
+    margin: 2em 0em 1em 0em;
+    padding: 0.5em 1em;
+    vertical-align: middle;
+}
+
+div.message a {
+    color: #202020;
+}
+
+/* Style for page error divs.  Use this for displaying errors for a
+   page as a whole.
+ */
+div.page_error {
+    background: #FFCE7B;
+    font: bold 80% Verdana, Helvetica, Arial, sans-serif;
+    padding: 0.5em 1em;
+    vertical-align: middle;
+}
+
+div.bug {
+    background: #FFCE7B;
+    border: 1px solid #FFA500;
+    color: #202020;
+    font: bold 80% Verdana, Helvetica, Arial, sans-serif;
+    margin: 2em 1em 1em 0em;
+    padding: 0.5em 1em;
+    vertical-align: middle;
+}
+
diff --git a/browser/loops/loops_logo.png b/browser/loops/loops_logo.png
new file mode 100644
index 0000000..15123ab
Binary files /dev/null and b/browser/loops/loops_logo.png differ
diff --git a/reporter/README.txt b/reporter/README.txt
index ea5d659..ec3a18a 100644
--- a/reporter/README.txt
+++ b/reporter/README.txt
@@ -3,6 +3,8 @@ Quickstart Instructions
 
   ($Id$)
 
+TO DO...
+
   >>> from zope.app import zapi
   >>> from zope.app.testing import ztapi
   >>> from zope.interface import directlyProvides
@@ -38,3 +40,13 @@ For the browser presentation we can also use a browser view providing
 the result set with extended attributes:
 
   >>> #rsView = zapi.getMultiAdapter((context, TestRequest()), IBrowserView)
+
+The reporter package also includes facilities for sorting the rows in a
+result set and splitting a result into batches.
+
+Sorting
+-------
+
+Batching
+--------
+