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