options.html

<title>RECAP options</title>
<style>
body { font-family: helvetica, arial; font-size: 13px; width: 21em; margin: 0; }
h1 { font-size: 13px; }
.item { width: 100%; height: 18px; padding: 4px; white-space: nowrap; }
.item:hover { background: #bcf; }
.icon { display: inline-block; width: 16px; padding-right: 4px; }
a { outline: none; text-decoration: none; color: inherit; }
input { vertical-align: middle; }
</style>

<a href="http://recapthelaw.org/" target="_blank">
  <div class="item">
    <span class="icon"></span>
    About RECAP
  </div>
</a>
<label for="status_notifications"
  title="Show RECAP's status whenever you log into or out of PACER">
  <div class="item">
    <span class="icon">
      <input id="status_notifications" type="checkbox">
    </span>
    Notify when RECAP becomes active
  </div>
</label>
<label for="upload_notifications"
  title="Show a message whenever RECAP uploads a file to the public archive">
  <div class="item">
    <span class="icon">
      <input id="upload_notifications" type="checkbox">
    </span>
    Notify on file upload
  </div>
</label>
<label for="recap_link_popups"
  title="Pop up a dialog whenever you click a RECAP link to a free document">
  <div class="item">
    <span class="icon">
      <input id="recap_link_popups" type="checkbox">
    </span>
    Confirm before opening free documents
  </div>
</label>

<script src="options.js"></script>