blob: f27b40765d96c361ed7660a0dbda3f06f6dc60f9 [file] [log] [blame]
/*
* 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%;
}