Home | History | Annotate | Download | only in inspect 
      1 /*
      2  * Copyright (c) 2012 The Chromium Authors. All rights reserved.
      3  * Use of this source code is governed by a BSD-style license that can be
      4  * found in the LICENSE file.
      5  */
      6 
      7 body {
      8   color: rgb(48, 57, 66);
      9   font-family: Arial, sans-serif;
     10   font-size: 13px;
     11   margin: 0;
     12   min-width: 47em;
     13   padding: 20px 20px 65px 0;
     14 }
     15 
     16 img {
     17   float: left;
     18   height: 16px;
     19   padding-left: 2px;
     20   padding-right: 5px;
     21   width: 16px;
     22 }
     23 
     24 #container {
     25   -webkit-flex-direction: row;
     26   display: -webkit-flex;
     27 }
     28 
     29 #navigation {
     30   width: 150px;
     31 }
     32 
     33 #content {
     34   -webkit-flex: 1;
     35 }
     36 
     37 #caption {
     38   color: rgb(92, 97, 102);
     39   font-size: 150%;
     40   padding-bottom: 10px;
     41   padding-left: 20px;
     42 }
     43 
     44 .tab-header {
     45   -webkit-border-start: 6px solid transparent;
     46   padding-left: 15px;
     47 }
     48 
     49 .tab-header.selected {
     50   -webkit-border-start-color: rgb(78, 87, 100);
     51 }
     52 
     53 .tab-header > button {
     54   background-color: white;
     55   border: 0;
     56   cursor: pointer;
     57   font: inherit;
     58   line-height: 17px;
     59   margin: 6px 0;
     60   padding: 0 2px;
     61 }
     62 
     63 .tab-header:not(.selected) > button {
     64   color: #999;
     65 }
     66 
     67 #content > div:not(.selected) {
     68   display: none;
     69 }
     70 
     71 .content-header {
     72   border-bottom: 1px solid #eee;
     73   font-size: 150%;
     74   padding-bottom: 4px;
     75 }
     76 
     77 .device-header {
     78   -webkit-box-align: baseline;
     79   -webkit-box-orient: horizontal;
     80   display: -webkit-box;
     81   margin: 10px 0 0;
     82   padding: 2px 0;
     83 }
     84 
     85 .device-name {
     86   font-size: 150%;
     87 }
     88 
     89 .device-serial {
     90   color: #888;
     91   font-size: 80%;
     92   margin-left: 6px;
     93 }
     94 
     95 .device-ports {
     96   -webkit-box-orient: horizontal;
     97   display: -webkit-box;
     98   margin-left: 8px;
     99 }
    100 
    101 .port-icon {
    102   -webkit-border-radius: 6px;
    103   background-color: rgb(64, 192, 64);
    104   border: 0 solid transparent;
    105   height: 12px;
    106   margin: 2px;
    107   width: 12px;
    108 }
    109 
    110 .port-icon.error {
    111   background-color: rgb(224, 32, 32);
    112 }
    113 
    114 .port-icon.connected {
    115   -webkit-transform: scale(1.2);
    116   background-color: rgb(0, 255, 0);
    117 }
    118 
    119 .port-icon.transient {
    120   -webkit-transform: scale(1.2);
    121   background-color: orange;
    122 }
    123 
    124 .port-number {
    125   height: 16px;
    126   margin-right: 5px;
    127 }
    128 
    129 .browser-header {
    130   font-weight: bold;
    131   margin: 5px 0 0;
    132   padding: 2px 0;
    133 }
    134 
    135 .row {
    136   padding: 5px 0;
    137 }
    138 
    139 .url {
    140   color: #A0A0A0;
    141 }
    142 
    143 .list {
    144   margin-bottom: 20px;
    145   margin-top: 5px;
    146 }
    147 
    148 a {
    149   color: rgb(17, 85, 204);
    150   padding: 0 3px;
    151   text-decoration: none;
    152 }
    153 
    154 a.disabled {
    155   opacity: 0.5;
    156   pointer-events: none;
    157 }
    158 
    159 .open {
    160   margin-bottom: -4px;
    161   margin-top: 5px;
    162 }
    163 
    164 .open > input {
    165   border: 1px solid #aaa;
    166   height: 17px;
    167   line-height: 17px;
    168   margin-left: 20px;
    169   padding: 0 2px;
    170 }
    171 
    172 .open > button {
    173   line-height: 13px;
    174 }
    175 
    176 #port-forwarding-settings {
    177   position: absolute;
    178   right: 20px;
    179   top: 15px;
    180 }
    181 
    182 #port-forwarding-overlay {
    183   -webkit-box-align: center;
    184   -webkit-box-pack: center;
    185   background-color: rgba(255, 255, 255, 0.75);
    186   bottom: 0;
    187   display: -webkit-box;
    188   left: 0;
    189   position: absolute;
    190   right: 0;
    191   top: 0;
    192 }
    193 
    194 #port-forwarding-overlay:not(.open) {
    195   display: none;
    196 }
    197 
    198 #port-forwarding-config {
    199   -webkit-border-radius: 3px;
    200   background: white;
    201   box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0,0,0,0.15);
    202   color: #333;
    203   padding: 17px;
    204   position: relative;
    205 }
    206 
    207 .close-button {
    208   background-image: url('chrome://theme/IDR_CLOSE_DIALOG');
    209   height: 14px;
    210   width: 14px;
    211 }
    212 
    213 .close-button:active {
    214   background-image: url('chrome://theme/IDR_CLOSE_DIALOG_P');
    215 }
    216 
    217 .close-button:hover {
    218   background-image: url('chrome://theme/IDR_CLOSE_DIALOG_H');
    219 }
    220 
    221 #port-forwarding-config > .close-button {
    222   position: absolute;
    223   right: 7px;
    224   top: 7px;
    225 }
    226 
    227 #port-forwarding-config-title {
    228   font-size: 130%;
    229 }
    230 
    231 #port-forwarding-config-list {
    232   border: 1px solid #eee;
    233   height: 180px;
    234   margin-bottom: 10px;
    235   margin-top: 10px;
    236   overflow-x: hidden;
    237 }
    238 
    239 .port-forwarding-pair {
    240   -webkit-flex-direction: row;
    241   display: -webkit-flex;
    242 }
    243 
    244 .port-forwarding-pair:hover {
    245   background-color: #eee;
    246 }
    247 
    248 .port-forwarding-pair.selected,
    249 .port-forwarding-pair.selected:hover {
    250   background-color: #ccc;
    251 }
    252 
    253 .port-forwarding-pair input {
    254   border: 1px solid transparent;
    255   line-height: 20px;
    256   margin: 4px;
    257   padding: 0 3px;
    258 }
    259 
    260 .port-forwarding-pair.fresh:not(.selected) input {
    261   border-color: #eee;
    262 }
    263 
    264 .port-forwarding-pair input.port {
    265   width: 4em;
    266 }
    267 
    268 .port-forwarding-pair input.location {
    269   -webkit-flex: 1;
    270 }
    271 
    272 .port-forwarding-pair:not(.empty) input.invalid {
    273   background-color: rgb(255, 200, 200);
    274 }
    275 
    276 .port-forwarding-pair .close-button {
    277   margin: 8px 8px;
    278 }
    279 
    280 .port-forwarding-pair.fresh .close-button,
    281 .port-forwarding-pair:not(.selected):not(:hover) .close-button:not(:hover) {
    282   background-image: none;
    283   pointer-events: none;
    284 }
    285 
    286 .port-forwarding-pair:not(.selected) .close-button:not(:hover) {
    287   opacity: 0.5;
    288 }
    289 
    290 #port-forwarding-config-buttons > button {
    291   float: right;
    292 }
    293