view test-data/blast xml example2.html @ 59:f611cf649c90

update tests
author Jan Kanis <jan.code@jankanis.nl>
date Tue, 27 May 2014 12:50:52 +0200
parents 3bb5da68305e
children 4f0ed3b5ae46
line wrap: on
line source

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name=generator content="blast2html; see https://github.com/thehyve/blast2html/">
    
    <title>Blast output</title>
    
    <style>
      body {
      color: #333333;
      font-family: Arial,Sans-Serif;
      }

      :link {
      color: #336699;
      }

      .right {
      float: right;
      }

      /* Galaxy with html sanitization enabled strips the header of this html page. If so, show the user a warning.*/
      #strip_html_warning {
      display: none;
      }
      
      #content {
      margin: 0 2em;
      padding: 0.5em;
      border: 1px solid #888888;
      background-color: #d3dff5;
      }

      h1, h2, h3, h4, h5, h6 {
      color: #2A6979;
      font-family: arial,verdana,sans-serif;
      letter-spacing: -1px;
      margin: 1.2em 0 0.3em;
      }

      h1 {
      border-bottom: 1px solid #CCCCCC;
      font-size: 150%;
      padding-bottom: 0.1em;
      }

      h2 {
      font-size: 120%;
      font-weight: bold;
      }

      h4.darkHeader {
      color: #4D4D4D;
      letter-spacing: 0;
      font-weight: bold;
      }

      #nodata {
      font-weight: bold;
      }

      .index {
      margin-bottom: 3em;
      }
      .index div.indexentry {
      margin: 1.2em 1.6em;
      font-weight: bold;
      font-size: 100%;
      }
      
      .headerdata {
      font-size: 90%;
      }
      .headerdata .param {
      font-weight: bold;
      text-align: right;
      padding: 0 1em;
      }

      .grey {
      background-color: #eeeeee;
      border: 1px solid #cccccc;
      padding: 1em;
      }

      .white {
      background-color: white;
      border: 1px solid #cccccc;
      padding: 1.5em 2%;
      }

      .graphicrow {
      clear: left;
      width: 100%;
      }

      .graphicitem {
      float: left;
      }


      
      .graphics .grey {
      text-align: center;
      }

      .graphic {
      background-color: white;
      border: 2px solid black;
      padding: 1.5em;
      margin: auto;
      }

      .centered, .defline, div.legend, div.tablewrapper {
      margin-left: auto;
      margin-right: auto;
      }

      .defline {
      background-color: white;
      border: 1px solid black;
      margin: .5em auto;
      padding-left: .2em;
      padding-right: .2em;
      max-width: 50em;
      text-align: left;
      height: 2.8em;
      overflow: hidden;
      }

      div.legend {
      max-width: 40em;
      }
      div.legend div {
      width: 100%;
      color: white;
      font-weight: bold;
      border-spacing: 0;
      }
      div.legend div .graphicitem {
      width: 20%;
      padding: 0;
      margin: 0;
      border: none;
      }

      div.tablewrapper {
      width: 50%;
      min-width: 60em;
      }

      /* For small widths we give the graphic 100% */
      @media (max-width: 72.5em) {
      div.tablewrapper {
      width: 100%;
      min-width: 0px;
      }
      }

      .scale {
      width: 100%;
      margin: .5em 0;
      font-weight: bold;
      }
      .scale div {
      color: red;
      text-align: left;
      }
      .scale .graphicrow {
      margin: .5em 0 .5em 0;
      color: white;
      }
      .scale .graphicitem {
      position: relative;
      }
      .scale .graphicitem div {
      margin: 0 1px;
      padding: 0 2px;
      text-align: right;
      background-color: red;
      color: white;
      }
      .scale .graphicitem:first-child div {
      margin-left: 0px;
      }
      .scale .graphicitem:last-child div {
      margin-right: 0px;
      }
      .scale .graphicitem .lastlabel {
      position: absolute;
      top: 0px;
      left: 100%;
      background-color: transparent;
      color: red;
      }

      a.matchresult {
      display: block;
      margin: 0;
      padding: 0;
      }
      div.matchrow {
      margin-top: 4px;
      }
      div.matchrow, div.matchitem {
      height: 4px;
      }

      
      table.descriptiontable {
      font-size: 85%;
      border: 1px solid #97b0c8;
      border-spacing: 0;
      color: #222222;
      line-height: 1.3em;
      background-color: white;
      }
      table.descriptiontable col:first-child {
      width: 100%;
      }
      table.descriptiontable tr:hover {
      background-color: #D5DEE3;
      }
      table.descriptiontable th {
      color: #14376C;
      font-weight: normal;
      background-color: #F0F0F0;
      background: linear-gradient(#FFFFFF, #F0F0F0);
      border-bottom: 1px solid #D4DFE9;
      border-right: 1px solid #CFCFCF;
      border-left: 0px solid black;
      border-top: 0px solid black;
      }
      table.descriptiontable td {
      overflow: hidden;
      text-align: center;
      padding: .4em .8em;
      }
      table.descriptiontable td div {
      width: 1em;
      overflow: visible;
      white-space: nowrap;
      text-align: left;
      }


      
      .alignments .white {
      padding: 1.5em 1em;
      }
      
      .alignment {
      border-top: 1px solid black;
      padding-left: 1em;
      padding-right: 1em;
      }
      
      div.linkheader {
      padding-top: .2em;
      font-size: 85%;
      color: #14376C;
      }
      div.linkheader a.linkheader {
      margin-right: 1em;
      }
      div.linkheader .right a {
      text-decoration: none;
      }

      .title .hittitle {
      color: #222222;
      margin-bottom: .3em;
      }
      .title .titleinfo {
      font-size: 80%;
      margin-top: 0;
      margin-bottom: .3em;
      }
      .title .titleinfo .b {
      color: #606060;
      font-weight: bold;
      font-size: 90%;
      }

      .moretitles {
      margin: 1.2em;
      }
      .moretitles .titleinfo {
      margin: 0;
      padding: 0;
      }
      .moretitles .hittitle {
      margin: .4em 0 .2em 0;
      padding: 0;
      }
      
      a.showmoretitles {
      font-size: 75%;
      color: #336699;
      font-weight: bold;
      margin-top: 0;
      }
      a.showmoretitles:hover {
      }

      .hotspot {
      color: #606060;
      font-family: verdana, arial, sans-serif;
      margin-bottom: 2.5em;
      }

      .hotspot p.range {
      font-size: 70%;
      margin-top: 0;
      margin-top: 1em;
      margin-bottom: .2em;
      }
      .hotspot p.range span.range {
      font-weight: bold;
      }
      .hotspot p.range a.range {
      margin-left: .5em;
      }

      table.hotspotstable {
      border-top: 1px solid;
      border-bottom: 1px solid;
      text-align: left;
      border-collapse: collapse;
      }
      table.hotspotstable th, table.hotspotstable td {
      padding: .1em 1em;
      }
      table.hotspotstable th {
      font-size: 70%;
      }
      table.hotspotstable td {
      min-width: 7em;
      color: #222222;
      font-size: 80%;
      }

      pre.alignmentgraphic {
      color: #222222;
      }

      footer {
      text-align: center;
      color: #cccccc;
      font-size: 70%;
      margin-top: 1em;
      }
      footer :link {
      color: #5588cc;
      }
      
    </style>

    <script type="text/javascript">
      function toggle_visibility(id) {
          var e = document.getElementById(id);
          if(e.style.display != 'block')
              e.style.display = 'block';
          else
              e.style.display = 'none';
      }
    </script>

  </head>

  
  <body>
    
    <div id="strip_html_warning">
      <!-- This div should be hidden by the header css block. Galaxy
      strips all css, breaking this page but making this warning
      visible. This warning contains some ugly old skool tabular html
      layout that is not stripped. -->
      <table bgcolor="#FFE5C9"><tr><td><font color="red"><b>
                <font size=5><center>This html page seems to have been stripped by Galaxy.</center></font>
                Disable Galaxy's html sanitization feature to view the full page (see <font face=monospace>sanitize_all_html</font> in your galaxy's universe_wsgi.ini), or download this page instead of viewing it in Galaxy.
      </b></font></td></tr></table>
    </div>
    
    <div id=content>



      
      <section class=match id=match1>
      
        <h1>Nucleotide Sequence (16 letters)</h1>

        <section class=header>

          <table class=headerdata>
            <tr><td class=param>Query ID:</td><td>Query_1</td></tr>
            <tr><td class=param>Query definition:</td><td>No definition line</td></tr>
            <tr><td class=param>Query length:</td><td>16</td></tr>
            <tr><td class=param>Program:</td><td>BLASTN 2.2.28+</td></tr>
            <tr><td class=param>Database:</td><td>/share/BlastDB/nt</td></tr>
          </table>

        </section>

        <section>
          <h2>No Hits</h2>
          <div class=grey>
            <table class=headerdata>
              <tr><td class=param>Message:</td><td>No hits found</td></tr>
            </table>
          </div>
        </section>
      </section>

    </div>

    <footer>
      This page was generated by <a href="https://github.com/thehyve/blast2html/">blast2html</a>.
    </footer>
  </body>
</html>