URL Picker Example

<div class="pincette-url-picker">
  <div class="pincette-navigation">
    <div>
      <span class="pincette-top-action">Top</span>
      <span class="pincette-back-action" />
      <span class="pincette-forward-action" />
      <span class="pincette-loading" />
    </div>
    <div>
      <div class="pincette-path">
        <span class="template">
          <span class="name">$[name]</span>
          <span class="separator" />
        </span>
      </div>
    </div>
  </div>

  <div class="pincette-results">
    <div>
      <div class="pincette-folders">
         <div class="template">
           <div>$[name]</div>
           <div><span class="icon" /></div>
        </div>
      </div>
    </div>
    <div>
      <div class="pincette-documents">
        <div class="template">
          <div class="title">$[dc_title:-$name]</div>
          <div class="details-block">
            <span class="pincette-show-details-action">Details</span>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="pincette-details pincette-tooltip">
    <div>
      <div>
        <div class="label">Title</div>
        <div class="value">$[dc_title]</div>
      </div>
      <div>
        <div class="label">Name</div>
        <div class="value">$[name]</div>
      </div>
      <div>
        <div class="label">Author</div>
        <div class="value">$[dc_creator]</div>
      </div>
      <div>
        <div class="label">Keywords</div>
        <div class="value">$[re_keyword]</div>
      </div>
      <div>
        <div class="label">Abstract</div>
        <div class="value">$[dcterms_abstract]</div>
      </div>
    </div>
  </div>
</div>