third_party/WebKit/Source/devtools/front_end/components_lazy/filmStripView.css

   1 /*
   2  * Copyright (c) 2015 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 .film-strip-view {
   8     overflow-x: auto;
   9     overflow-y: hidden;
  10     align-content: flex-start;
  11     min-height: 81px;
  12 }
  13
  14 .film-strip-view.time-based .frame .time {
  15     display: none;
  16 }
  17
  18 .film-strip-view .label {
  19     margin: auto;
  20     font-size: 18px;
  21     color: #999;
  22 }
  23
  24 .film-strip-view .frame {
  25     display: flex;
  26     flex-direction: column;
  27     align-items: center;
  28     padding: 4px;
  29     flex: none;
  30     cursor: pointer;
  31 }
  32
  33 .film-strip-view .frame-limit-reached {
  34     font-size: 24px;
  35     color: #888;
  36     justify-content: center;
  37     display: inline-flex;
  38     flex-direction: column;
  39     flex: none;
  40 }
  41
  42 .film-strip-view .frame .thumbnail {
  43     min-width: 24px;
  44     display: flex;
  45     flex-direction: row;
  46     align-items: center;
  47     pointer-events: none;
  48     margin: 4px 0 2px;
  49     border: 2px solid transparent;
  50 }
  51
  52 .film-strip-view .frame:hover .thumbnail {
  53     border-color: #FBCA46;
  54 }
  55
  56 .film-strip-view .frame .thumbnail img {
  57     height: auto;
  58     width: auto;
  59     max-width: 80px;
  60     max-height: 50px;
  61     pointer-events: none;
  62     box-shadow: 0 0 3px #bbb;
  63     flex: 0 0 auto;
  64 }
  65
  66 .film-strip-view .frame:hover .thumbnail img {
  67     box-shadow: none;
  68 }
  69
  70 .film-strip-view .frame .time {
  71     font-size: 10px;
  72     margin-top: 2px;
  73 }