1/* Copyright (c) 2013 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/* Base class rules, internal to value-bar */ 7 8.value-bar { 9 -webkit-flex-wrap: nowrap; 10 color: gray; 11 display: -webkit-flex; 12 position: absolute; 13 z-index: 100; 14} 15 16.value-bar .value-control { 17 -webkit-user-select: none; 18 background-color: whitesmoke; 19 border: 1px solid gray; 20 cursor: pointer; 21 font-family: sans-serif; 22 font-size: 12px; 23} 24 25.value-bar .lowest-value-control { 26 position: relative; 27 z-index: 100; 28} 29 30.value-bar .highest-value-control { 31 position: relative; 32 z-index: 100; 33} 34 35.value-bar .value-range-control { 36 background-color: lightgray; 37 position: relative; 38} 39 40.value-bar .value-slider { 41 background-color: gray; 42 position: absolute; 43 z-index: 99; 44} 45 46.value-bar[orient='vertical'] .lowest-value-control { 47 border-bottom: none; 48} 49 50.value-bar[orient='vertical'] .value-slider { 51 cursor: row-resize; 52 width: 18px; 53} 54 55.value-bar[orient='vertical'] .value-slider-top { 56 border-bottom: 1px solid black; 57 height: 5px; 58} 59 60 .value-bar[orient='vertical'] .value-slider-bottom { 61 border-top: 1px solid black; 62 height: 5px; 63} 64 65.value-bar[orient='vertical'] .value-range-control { 66 height: 100px; 67} 68 69.value-bar[orient='vertical'] .highest-value-control { 70 border-top: none; 71} 72 73.value-bar[orient='vertical'] .value-display { 74 left: 25px; 75} 76 77.value-bar[orient='horizontal'] .lowest-value-control { 78 border-right: none; 79} 80 81.value-bar[orient='horizontal'] .value-slider { 82 cursor: col-resize; 83 height: 18px; 84 white-space: nowrap; 85} 86 87.value-bar[orient='horizontal'] .value-slider-top { 88 border-right: 1px solid black; 89 display: inline-block; 90 height: 18px; 91 width: 5px; 92} 93 94.value-bar[orient='horizontal'] .value-slider-bottom { 95 border-left: 1px solid black; 96 display: inline-block; 97 height: 18px; 98 width: 5px; 99} 100 101 102.value-bar[orient='horizontal'] .value-range-control { 103 width: 100px; 104} 105 106.value-bar[orient='horizontal'] .highest-value-control { 107 border-left: none; 108} 109 110.value-bar[orient='horizontal'] .value-display { 111 left: 25px; 112} 113