HTML for Research Exhibit on CSAIL BD Site

research.html

<div class="insert-exhibit">
 
  <link href="http://bigdata.csail.mit.edu/datapress/node/type/research/json" rel="exhibit/data" type="application/json">
 
  <style>
 
    /*
     * These get rid of the extra bits that Exhibit takes the liberty of adding.
     * ------------------------------------------------------------------------------
     */
 
    div.exhibit-controlPanel,
    div.exhibit-bookmarkWidget-popup,
    div.exhibit-collectionView-header,
    div.exhibit-toolboxWidget-popup {
      display: none !important;
    }
 
    /*
     * This styles the user block
     * ------------------------------------------------------------------------------
     */
     .pic-cell {
       padding: 2px;
       width: 190px;
       padding-left: 15px;
       padding-right: 15px;
     }
     .info-cell {
       padding: 2px;
       width: 188px !important;
     }
     .desc-cell {
       padding: 2px;
       width: 722px !important;
       padding-left: 10px;
     }
     
     td.desc-cell p {
       max-height: 136px;
       overflow: hidden;
     }
     
     a.name {
       display: block;
     }
 
    div.hfacet-container {
      display: block;
      width: 100%;
      clear: both;
    }
 
    div.hfacet {
      margin-left: 15px;
      margin-right: 15px;
      display: bock;
    }
 
    div.hfacet div.exhibit-facet-header {
      font-size: 16px;
      float: left;
    }
 
    div.hfacet div.exhibit-text-facet {
      float: left;
      margin-left: 10px;
    }
 
    .clear {
      clear: both;
      float: none;
    }
    
    .research-block {
      border-bottom: 1px solid #ccc;
      margin: 0;
      padding: 0;
    }
    
    .research-block td {
      padding-top: 18px;
      padding-bottom: 18px;
    }
    
    .exhibit-thumbnailView-itemContainer:nth-child(2n + 1) .research-block {
      background-color: #f3f4ee;
    }
  </style>
 
  <div class="hfacet-container">
    <div class="hfacet">
      <div ex:collectionID="researchCollection" ex:facetclass="TextSearch" ex:facetlabel="Search Projects" ex:role="facet"></div>
    </div>
  </div>
 
  <table class="research-block clear" ex:role="lens" style="display:none;">
    <tr>
      <td class="pic-cell">
        <a ex:href-content="concat('http://bigdata.csail.mit.edu/node/', .nid)" title="View project profile."><img ex:alt-content=".name" ex:src-content="if(exists(.custom-photo_left),concat('http://bigdata.csail.mit.edu/sites/bigdata/files/styles/research_thumbnail/public/', .custom-photo_left),'http://bigdata.csail.mit.edu/sites/bigdata/files/default_images/Default%20Stata_0_0.jpg')" /></a>
      </td>
      <td class="info-cell">
        <h3><a class="title" ex:content=".title" ex:href-content="concat('http://bigdata.csail.mit.edu/node/',.nid)" title="View project profile."></a></h3>
        <span ex:content=".custom-user_project_reference"><a class="name" ex:subcontent="#{{.label}}" class="username" ex:content=".name" ex:href-content="concat('http://bigdata.csail.mit.edu/user/',.uid)" title="View user profile."></a></span>
        <span ex:content=".custom-additional_text_field"></span>
      </td>
      <td class="desc-cell">
        <p ex:content=".custom-abstract"></p>
      </td>
    </tr>
  </table>
 
  <div ex:role="collection" ex:itemTypes="research" id="researchCollection"></div>
 
  <div class="clear" ex:role="viewPanel">
    <div ex:label="Research Projects" ex:role="view" ex:collectionID="researchCollection" ex:viewclass="Thumbnail" ex:showAll="true"></div>
  </div>
</div>