src/third_party/trace-viewer/trace_viewer/tracing/timeline_view.css

   1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2  * Use of this source code is governed by a BSD-style license that can be
   3  * found in the LICENSE file.
   4  */
   5
   6 x-timeline-view {
   7   -webkit-flex-direction: column;
   8   cursor: default;
   9   display: -webkit-flex;
  10   font-family: sans-serif;
  11   padding: 0;
  12 }
  13
  14 x-timeline-view > .control > .title {
  15   font-size: 14px;
  16   height: 22px;
  17   padding-left: 2px;
  18   padding-right: 8px;
  19   padding-top: 2px;
  20 }
  21
  22 x-timeline-view > .control {
  23   -webkit-flex: 0 0 auto;
  24   background-color: #e6e6e6;
  25   background-image: -webkit-gradient(linear,
  26                                      0 0,
  27                                      0 100%,
  28                                      from(#E5E5E5),
  29                                      to(#D1D1D1));
  30   border-bottom: 1px solid #8e8e8e;
  31   display: -webkit-flex;
  32   padding-top: 1px;
  33 }
  34
  35 x-timeline-view > .control > #right-controls {
  36   margin-left: auto;
  37 }
  38
  39 x-timeline-view > .control > .controls {
  40   display: -webkit-flex;
  41 }
  42
  43 x-timeline-view > .control > span {
  44   padding-left: 5px;
  45   padding-right: 10px;
  46 }
  47
  48 x-timeline-view > .control > .controls button,
  49 x-timeline-view > .control > .controls label {
  50   font-size: 14px;
  51   height: 22px;
  52   margin: 1px 2px 1px 2px;
  53 }
  54
  55 x-timeline-view > .control > .spacer {
  56   -webkit-flex: 1 1 auto;
  57 }
  58
  59 x-timeline-view > middle-container {
  60   -webkit-flex: 1 1 auto;
  61   -webkit-flex-direction: row;
  62   border-bottom: 1px solid #8e8e8e;
  63   display: -webkit-flex;
  64   min-height: 0;
  65 }
  66
  67 x-timeline-view > middle-container > track-view-container {
  68   -webkit-flex: 1 1 auto;
  69   display: -webkit-flex;
  70   min-height: 0;
  71   min-width: 0;
  72 }
  73
  74 x-timeline-view > middle-container > track-view-container > * {
  75   -webkit-flex: 1 1 auto;
  76 }
  77
  78 x-timeline-view > middle-container > x-timeline-view-side-panel-container {
  79   -webkit-flex: 0 0 auto;
  80 }
  81
  82 x-timeline-view > x-drag-handle {
  83   -webkit-flex: 0 0 auto;
  84 }
  85
  86 x-timeline-view > tracing-analysis-view {
  87   -webkit-flex: 0 0 auto;
  88 }
  89
  90 x-timeline-view .selection {
  91   margin: 2px;
  92 }
  93
  94 x-timeline-view .selection ul {
  95   margin: 0;
  96 }
  97
  98 .button {
  99   background-color: #f8f8f8;
 100   border: 1px solid rgba(0, 0, 0, 0.5);
 101   color: rgba(0,0,0,0.8);
 102   font-size: 14px;
 103   height: 22px;
 104   margin: 1px;
 105   min-width: 23px;
 106   text-align: center;
 107 }
 108
 109 .button:hover {
 110   background-color: rgba(255, 255, 255, 1.0);
 111   border: 1px solid rgba(0, 0, 0, 0.8);
 112   box-shadow: 0 0 .05em rgba(0, 0, 0, 0.4);
 113   color: rgba(0, 0, 0, 1);
 114 }
 115
 116 .view-info-button {
 117   padding-left: 4px;
 118   padding-right: 4px;
 119   width: auto;
 120 }
 121
 122 .view-info-button:hover {
 123   border: solid 1px;
 124 }
 125
 126 .metadata-dialog-text {
 127   font-family: monospace;
 128   overflow: auto;
 129   white-space: pre;
 130 }
 131
 132 .view-help-text {
 133   -webkit-flex: 1 1 auto;
 134   -webkit-flex-direction: row;
 135   display: -webkit-flex;
 136   width: 700px;
 137 }
 138 .view-help-text .column {
 139   width: 50%;
 140 }
 141 .view-help-text h2 {
 142   font-size: 1.2em;
 143   margin: 0;
 144   margin-top: 5px;
 145   text-align: center;
 146 }
 147 .view-help-text h3 {
 148   margin: 0;
 149   margin-left: 126px;
 150   margin-top: 10px;
 151 }
 152 .view-help-text .pair {
 153   -webkit-flex: 1 1 auto;
 154   -webkit-flex-direction: row;
 155   display: -webkit-flex;
 156 }
 157 .view-help-text .command {
 158   font-family: monospace;
 159   margin-right: 5px;
 160   text-align: right;
 161   width: 150px;
 162 }
 163 .view-help-text .action {
 164   font-size: 0.9em;
 165   text-align: left;
 166   width: 200px;
 167 }
 168 .view-help-text .mouse-mode-icon {
 169   border: 1px solid #888;
 170   border-radius: 3px;
 171   box-shadow: inset 0 0 2px rgba(0,0,0,0.3);
 172   display: inline-block;
 173   height: 26px;
 174   margin-right: 1px;
 175   position: relative;
 176   top: 4px;
 177   width: 27px;
 178   zoom: 0.75;
 179 }
 180 .view-help-text .mouse-mode-icon.pan-mode {
 181   background-position: -1px -11px;
 182 }
 183 .view-help-text .mouse-mode-icon.select-mode {
 184   background-position: -1px -41px;
 185 }
 186 .view-help-text .mouse-mode-icon.zoom-mode {
 187   background-position: -1px -71px;
 188 }
 189 .view-help-text .mouse-mode-icon.timing-mode {
 190   background-position: -1px -101px;
 191 }
 192