| /* |
| * Copyright (C) 2011 Google Inc. All rights reserved. |
| * |
| * Redistribution and use in source and binary forms, with or without |
| * modification, are permitted provided that the following conditions |
| * are met: |
| * 1. Redistributions of source code must retain the above copyright |
| * notice, this list of conditions and the following disclaimer. |
| * 2. Redistributions in binary form must reproduce the above copyright |
| * notice, this list of conditions and the following disclaimer in the |
| * documentation and/or other materials provided with the distribution. |
| * |
| * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' |
| * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, |
| * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR |
| * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS |
| * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR |
| * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
| * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
| * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN |
| * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) |
| * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF |
| * THE POSSIBILITY OF SUCH DAMAGE. |
| */ |
| |
| .non-action-button, .results-view ul.actions, .ui-dialog ul.actions { |
| float: right; |
| margin: 0; |
| padding: 5px 0px; |
| list-style: none; |
| display: inline-block; |
| } |
| |
| .non-action-button { |
| padding: 5px; |
| } |
| |
| .results-view ul.actions.rebaseline-action { |
| float: none; |
| position: absolute; |
| right: 4px; |
| top: 7px; |
| padding: 0; |
| } |
| |
| .results-view ul.actions li, .ui-dialog ul.actions li { |
| display: inline-block; |
| } |
| |
| .results-view h3 ul.actions { |
| padding: 2px 0px; |
| } |
| |
| .results-view h3 ul.actions { |
| visibility: hidden; |
| } |
| |
| .results-view h3.ui-state-active ul.actions { |
| visibility: visible; |
| } |
| |
| .ui-tabs .ui-tabs-panel.results-detail { |
| padding: 0px; |
| } |
| |
| .results-grid table { |
| table-layout: fixed; |
| width: 100%; |
| border-collapse: collapse; |
| } |
| |
| .results-grid table td, .results-view table th { |
| overflow: hidden; |
| vertical-align: top; |
| } |
| |
| .results-grid table th { |
| padding: 3px; |
| border-top: 1px solid #DDD; |
| border-bottom: 1px solid #DDD; |
| } |
| |
| .results-grid .text-result { |
| border: none; |
| width: 100%; |
| height: 400px; /* FIXME: How do we get a reasonable height here? */ |
| } |
| |
| .results-grid .image-result { |
| width: 100%; |
| height: auto; |
| } |
| |
| .results-view .top-panel { |
| max-height: 20%; |
| overflow: auto; |
| position: relative; |
| border: 1px solid #EEE; |
| } |
| |
| .results-view .resize-handle { |
| height: 5px; |
| text-align: center; |
| -webkit-user-select: none; |
| line-height: 5px; |
| cursor: ns-resize; |
| font-size: 5px; |
| font-weight: bold; |
| padding: 1px; |
| } |
| |
| .results-view .resize-handle:before { |
| content: '|||'; |
| } |
| |
| .results-view .link-title, |
| .results-view .active .non-link-title { |
| display: none; |
| } |
| |
| .results-view .non-link-title, |
| .results-view .active .link-title { |
| display: inline-block; |
| } |
| |
| .results-view h3 { |
| font-size: 14px; |
| font-weight: normal; |
| border-top: 1px solid #DDD; |
| margin: 0; |
| cursor: pointer; |
| } |
| |
| .results-view h3:not(.active):hover { |
| background-color: #EEE; |
| } |
| |
| .results-view .active { |
| background-color: #CCC; |
| } |
| |
| /* CSS percentages in standards-mode are dumb. You need to have a percentage or fixed height |
| all the way up the tree in order to have percentages resolve. */ |
| html, body, #onebar, .results-view, .test-selector { |
| height: 100%; |
| } |
| |
| #results { |
| /* FIXME: We really should use flexbox so we don't have to do this. But that requires restructuring the DOM a bit. */ |
| height: -webkit-calc(100% - 39px); |
| box-sizing: border-box; |
| /* Position relative so that nested percentages size to this element. */ |
| position: relative; |
| } |
| |
| /*** status console ***/ |
| .status { |
| position: fixed; |
| bottom: 0; |
| left: 0; |
| right: 0; |
| height: 100px; |
| background-color: white; |
| border-top: 1px solid gray; |
| -webkit-box-shadow: 0px -2px 10px gray; |
| overflow: auto; |
| white-space: nowrap; |
| padding: 4px; |
| } |
| |
| .status .actions, .status .process-text { |
| position: fixed; |
| bottom: 0; |
| right: 20px; |
| margin: 4px; |
| } |
| |
| .processing .actions { |
| display: none; |
| } |
| |
| .processing .process-text { |
| display: block; |
| } |
| |
| .process-text { |
| display: none; |
| } |
| |
| .status-content { |
| border-bottom: 1px dashed; |
| margin-bottom: 1em; |
| } |
| |
| .status-content:last-child { |
| border-bottom: 0; |
| margin-bottom: 0; |
| } |
| |
| .flakiness-iframe, .flakiness-iframe-placeholder { |
| border: none; |
| height: 0; |
| width: 100%; |
| } |