| Index: foo/test.html
|
| diff --git a/foo/test.html b/foo/test.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..6171a026cb376450bd1be24af6185b27dfbe1780
|
| --- /dev/null
|
| +++ b/foo/test.html
|
| @@ -0,0 +1,156 @@
|
| +<html>
|
| +<head>
|
| + <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
|
| + <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
|
| + <link rel="stylesheet" type="text/css" href="../third_party/chrome-tabs/css/chrome-tabs.css">
|
| + <style>
|
| +
|
| +table {
|
| + border-collapse: collapse;
|
| +}
|
| +
|
| +table, tr, td {
|
| + border: 1px solid black;
|
| +}
|
| +
|
| +tr.error {
|
| + background-color: #aaaaaa;
|
| +}
|
| +
|
| +tr.good {
|
| + background-color: #aaffaa;
|
| +}
|
| +
|
| +tr.bad {
|
| + background-color: #ffaaaa;
|
| +}
|
| +
|
| +tr.active {
|
| + border: 3px solid blue;
|
| +}
|
| +
|
| +#image-holder {
|
| + width: 90%;
|
| + margin: 0 auto;
|
| +}
|
| +
|
| +#image-holder img {
|
| + width: 49%;
|
| +}
|
| +
|
| +#image-holder.error {
|
| + border: 5px solid #aaaaaa;
|
| +}
|
| +
|
| +#image-holder.good {
|
| + border: 5px solid green;
|
| +}
|
| +
|
| +#image-holder.bad {
|
| + border: 5px solid red;
|
| +}
|
| +
|
| +
|
| +.content {
|
| + background-color: #e0e0e0;
|
| +}
|
| +
|
| +.content-holder {
|
| + height: 100%;
|
| + background-color: #e0e0e0;
|
| + float: left;
|
| + overflow: hidden;
|
| + overflow-y: scroll;
|
| +}
|
| +
|
| +.content-holder.active {
|
| + display: block
|
| +}
|
| +
|
| +button {
|
| + height: 50px
|
| +}
|
| +
|
| +.left-caret {
|
| + float: left;
|
| + cursor: pointer;
|
| + width: 35px;
|
| + height: 35px;
|
| + position: relative;
|
| +}
|
| +
|
| +.left-caret:before {
|
| + content: '';
|
| + position: absolute;
|
| + left: 12px;
|
| + top: 25%;
|
| + border-right: 12px solid #555;
|
| + border-top: 12px solid transparent;
|
| + border-bottom: 12px solid transparent;
|
| +}
|
| +
|
| +.left-caret:hover:before {
|
| + border-right: 12px solid #777;
|
| +}
|
| +
|
| +.right-caret {
|
| + float: right;
|
| + position: relative;
|
| + cursor: pointer;
|
| + width: 35px;
|
| + height: 35px;
|
| +}
|
| +
|
| +.right-caret:before {
|
| + content: '';
|
| + position: absolute;
|
| + right: 12px;
|
| + top: 25%;
|
| + border-left: 12px solid #555;
|
| + border-top: 12px solid transparent;
|
| + border-bottom: 12px solid transparent;
|
| +}
|
| +
|
| +.right-caret:hover:before {
|
| + border-left: 12px solid #777;
|
| +}
|
| +
|
| +.button-row {
|
| + padding: 20px
|
| +}
|
| +
|
| + </style>
|
| +</head>
|
| +<div class="content">
|
| + <div class="content-holder" id="data-viewer" style="width:25%">
|
| + <table id="data-table">
|
| + </table>
|
| + </div>
|
| + <div class="content-holder" id="image-viewer" style="width:75%">
|
| + <div class="button-row">
|
| + <button id="bad" style="width:200px"><font style="color:red">bad</font></button>
|
| + <button id="good" style="width:200px"><font style="color:green">good</font></button>
|
| + <button id="error" style="width:200px"><font style="">error</font></button>
|
| + <button id="reset" style="width:200px"><font style="">reset</font></button>
|
| + <span style="float: right">
|
| + <span class="left-caret"><b></b></span>
|
| + <span id="position" style="float:left; position:relative; top:12px; width:100px">
|
| + <span class="current-position"></span>
|
| + /
|
| + <span class="total-entries"></span>
|
| + </span>
|
| + <span class="right-caret"><b></b></span>
|
| + </span>
|
| + </div>
|
| +
|
| + <h1><a id="url-holder" target="_blank"></a></h1>
|
| + <div id="image-holder">
|
| + <div>
|
| + <img id="base-img"></img>
|
| + <img id="distilled-img"></img>
|
| + </div>
|
| + </div>
|
| + </div>
|
| +</div>
|
| +<script src="test.js"></script>
|
| +</html>
|
|
|
Chromium Code Reviews
