1/* 2 * Copyright (C) 2013 Apple 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.filter-bar { 27 display: -webkit-flex; 28 29 height: 26px; 30 31 white-space: nowrap; 32 overflow: hidden; 33} 34 35body.mac-platform.legacy .filter-bar { 36 height: 21px; 37} 38 39.filter-bar > input[type="search"] { 40 display: -webkit-flex; 41 -webkit-flex: 1; 42 43 margin: 1px 6px; 44 padding-top: 0; 45 46 outline: none; 47 48 -webkit-appearance: none; 49 50 border: 1px solid rgba(0, 0, 0, 0.25); 51 border-radius: 3px; 52 background-color: rgba(255, 255, 255, 0.2); 53 background-clip: padding-box; 54 55 height: 22px; 56} 57 58body.mac-platform.legacy .filter-bar > input[type="search"] { 59 border: 1px solid rgba(0, 0, 0, 0.35); 60 border-radius: 10px; 61 box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 0; 62 63 height: 19px; 64 transition: background-color 200ms ease-in-out; 65} 66 67.filter-bar > input[type="search"]::-webkit-input-placeholder { 68 color: rgba(0, 0, 0, 0.35); 69} 70 71.filter-bar > input[type="search"]:focus { background-color: white; } 72 73.filter-bar > input[type="search"]::-webkit-search-decoration { 74 width: 13px; 75 height: 13px; 76 77 margin-left: 6px; 78 margin-right: 6px; 79 80 vertical-align: bottom; 81 82 background-image: url(../Images/FilterFieldGlyph.svg); 83 84 -webkit-appearance: none; 85} 86 87body.mac-platform.legacy .filter-bar > input[type="search"]::-webkit-search-decoration { 88 background-image: url(../Images/Legacy/FilterFieldGlyph.svg); 89} 90