Home | History | Annotate | Download | only in styles 
      1 /*
      2  * Copyright (C) 2011 Google Inc. All rights reserved.
      3  *
      4  * Redistribution and use in source and binary forms, with or without
      5  * modification, are permitted provided that the following conditions
      6  * are met:
      7  * 1. Redistributions of source code must retain the above copyright
      8  *    notice, this list of conditions and the following disclaimer.
      9  * 2. Redistributions in binary form must reproduce the above copyright
     10  *    notice, this list of conditions and the following disclaimer in the
     11  *    documentation and/or other materials provided with the distribution.
     12  *
     13  * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
     14  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
     15  * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
     16  * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
     17  * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
     18  * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
     19  * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
     20  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
     21  * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
     22  * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
     23  * THE POSSIBILITY OF SUCH DAMAGE.
     24  */
     25 
     26 .non-action-button, .results-view ul.actions, .ui-dialog ul.actions {
     27     float: right;
     28     margin: 0;
     29     padding: 5px 0px;
     30     list-style: none;
     31     display: inline-block;
     32 }
     33 
     34 .non-action-button {
     35     padding: 5px;
     36 }
     37 
     38 .results-view ul.actions.rebaseline-action {
     39     float: none;
     40     position: absolute;
     41     right: 4px;
     42     top: 7px;
     43     padding: 0;
     44 }
     45 
     46 .results-view ul.actions li, .ui-dialog ul.actions li {
     47     display: inline-block;
     48 }
     49 
     50 .results-view h3 ul.actions {
     51     padding: 2px 0px;
     52 }
     53 
     54 .results-view h3 ul.actions {
     55     visibility: hidden;
     56 }
     57 
     58 .results-view h3.ui-state-active ul.actions {
     59     visibility: visible;
     60 }
     61 
     62 .ui-tabs .ui-tabs-panel.results-detail {
     63     padding: 0px;
     64 }
     65 
     66 .results-grid table {
     67     table-layout: fixed;
     68     width: 100%;
     69     border-collapse: collapse;
     70 }
     71 
     72 .results-grid table td, .results-view table th {
     73     overflow: hidden;
     74     vertical-align: top;
     75 }
     76 
     77 .results-grid table th {
     78     padding: 3px;
     79     border-top: 1px solid #DDD;
     80     border-bottom: 1px solid #DDD;
     81 }
     82 
     83 .results-grid .text-result {
     84     border: none;
     85     width: 100%;
     86     height: 400px; /* FIXME: How do we get a reasonable height here? */
     87 }
     88 
     89 .results-grid .image-result {
     90     width: 100%;
     91     height: auto;
     92 }
     93 
     94 .results-view .top-panel {
     95     max-height: 20%;
     96     overflow: auto;
     97     position: relative;
     98     border: 1px solid #EEE;
     99 }
    100 
    101 .results-view .resize-handle {
    102     height: 5px;
    103     text-align: center;
    104     -webkit-user-select: none;
    105     line-height: 5px;
    106     cursor: ns-resize;
    107     font-size: 5px;
    108     font-weight: bold;
    109     padding: 1px;
    110 }
    111 
    112 .results-view .resize-handle:before {
    113     content: '|||';
    114 }
    115 
    116 .results-view .link-title,
    117 .results-view .active .non-link-title {
    118     display: none;
    119 }
    120 
    121 .results-view .non-link-title,
    122 .results-view .active .link-title {
    123     display: inline-block;
    124 }
    125 
    126 .results-view h3 {
    127     font-size: 14px;
    128     font-weight: normal;
    129     border-top: 1px solid #DDD;
    130     margin: 0;
    131     cursor: pointer;
    132 }
    133 
    134 .results-view h3:not(.active):hover {
    135     background-color: #EEE;
    136 }
    137 
    138 .results-view .active {
    139     background-color: #CCC;
    140 }
    141 
    142 /* CSS percentages in standards-mode are dumb. You need to have a percentage or fixed height
    143    all the way up the tree in order to have percentages resolve. */
    144 html, body, #onebar, .results-view, .test-selector {
    145     height: 100%;
    146 }
    147 
    148 #results, #perf {
    149     /* FIXME: We really should use flexbox so we don't have to do this. But that requires restructuring the DOM a bit. */
    150     height: -webkit-calc(100% - 39px);
    151     box-sizing: border-box;
    152     /* Position relative so that nested percentages size to this element. */
    153     position: relative;
    154 }
    155 
    156 /*** status console ***/
    157 .status {
    158     position: fixed;
    159     bottom: 0;
    160     left: 0;
    161     right: 0;
    162     height: 100px;
    163     background-color: white;
    164     border-top: 1px solid gray;
    165     -webkit-box-shadow: 0px -2px 10px gray;
    166     overflow: auto;
    167     white-space: nowrap;
    168     padding: 4px;
    169 }
    170 
    171 .status .actions, .status .process-text {
    172     position: fixed;
    173     bottom: 0;
    174     right: 20px;
    175     margin: 4px;
    176 }
    177 
    178 .processing .actions {
    179     display: none;
    180 }
    181 
    182 .processing .process-text {
    183     display: block;
    184 }
    185 
    186 .process-text {
    187     display: none;
    188 }
    189 
    190 .status-content {
    191     border-bottom: 1px dashed;
    192     margin-bottom: 1em;
    193 }
    194 
    195 .status-content:last-child {
    196     border-bottom: 0;
    197     margin-bottom: 0;
    198 }
    199 
    200 .flakiness-iframe, .flakiness-iframe-placeholder {
    201     border: none;
    202     height: 0;
    203     width: 100%;
    204 }
    205