|
1 /* AutoSuggest CSS - Version 1.2 */ |
|
2 |
|
3 ul.as-selections { |
|
4 list-style-type: none; |
|
5 border-top: 1px solid #888; |
|
6 border-bottom: 1px solid #b6b6b6; |
|
7 border-left: 1px solid #aaa; |
|
8 border-right: 1px solid #aaa; |
|
9 padding: 4px 0 4px 4px; |
|
10 margin: 0; |
|
11 overflow: auto; |
|
12 background-color: #fff; |
|
13 box-shadow:inset 0 1px 2px #888; |
|
14 -webkit-box-shadow:inset 0 1px 2px #888; |
|
15 -moz-box-shadow:inset 0 1px 2px #888; |
|
16 } |
|
17 |
|
18 ul.as-selections.loading { |
|
19 background-color: #eee; |
|
20 } |
|
21 |
|
22 ul.as-selections li { |
|
23 float: left; |
|
24 margin: 1px 4px 1px 0; |
|
25 } |
|
26 |
|
27 ul.as-selections li.as-selection-item { |
|
28 color: #2b3840; |
|
29 font-size: 13px; |
|
30 font-family: "Lucida Grande", arial, sans-serif; |
|
31 text-shadow: 0 1px 1px #fff; |
|
32 background-color: #ddeefe; |
|
33 background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ddeefe), to(#bfe0f1)); |
|
34 border: 1px solid #acc3ec; |
|
35 border-top-color: #c0d9e9; |
|
36 padding: 2px 7px 2px 10px; |
|
37 border-radius: 12px; |
|
38 -webkit-border-radius: 12px; |
|
39 -moz-border-radius: 12px; |
|
40 box-shadow: 0 1px 1px #e4edf2; |
|
41 -webkit-box-shadow: 0 1px 1px #e4edf2; |
|
42 -moz-box-shadow: 0 1px 1px #e4edf2; |
|
43 } |
|
44 |
|
45 ul.as-selections li.as-selection-item:last-child { |
|
46 margin-left: 30px; |
|
47 } |
|
48 |
|
49 ul.as-selections li.as-selection-item a.as-close { |
|
50 float: right; |
|
51 margin: 1px 0 0 7px; |
|
52 padding: 0 2px; |
|
53 cursor: pointer; |
|
54 color: #5491be; |
|
55 font-family: "Helvetica", helvetica, arial, sans-serif; |
|
56 font-size: 14px; |
|
57 font-weight: bold; |
|
58 text-shadow: 0 1px 1px #fff; |
|
59 -webkit-transition: color .1s ease-in; |
|
60 } |
|
61 |
|
62 ul.as-selections li.as-selection-item.blur { |
|
63 color: #666666; |
|
64 background-color: #f4f4f4; |
|
65 background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f4f4f4), to(#d5d5d5)); |
|
66 border-color: #bbb; |
|
67 border-top-color: #ccc; |
|
68 box-shadow: 0 1px 1px #e9e9e9; |
|
69 -webkit-box-shadow: 0 1px 1px #e9e9e9; |
|
70 -moz-box-shadow: 0 1px 1px #e9e9e9; |
|
71 } |
|
72 |
|
73 ul.as-selections li.as-selection-item.blur a.as-close { |
|
74 color: #999; |
|
75 } |
|
76 |
|
77 ul.as-selections li:hover.as-selection-item { |
|
78 color: #2b3840; |
|
79 background-color: #bbd4f1; |
|
80 background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#bbd4f1), to(#a3c2e5)); |
|
81 border-color: #6da0e0; |
|
82 border-top-color: #8bb7ed; |
|
83 } |
|
84 |
|
85 ul.as-selections li:hover.as-selection-item a.as-close { |
|
86 color: #4d70b0; |
|
87 } |
|
88 |
|
89 ul.as-selections li.as-selection-item.selected { |
|
90 border-color: #1f30e4; |
|
91 } |
|
92 |
|
93 ul.as-selections li.as-selection-item a:hover.as-close { |
|
94 color: #1b3c65; |
|
95 } |
|
96 |
|
97 ul.as-selections li.as-selection-item a:active.as-close { |
|
98 color: #4d70b0; |
|
99 } |
|
100 |
|
101 ul.as-selections li.as-original { |
|
102 margin-left: 0; |
|
103 } |
|
104 |
|
105 ul.as-selections li.as-original input { |
|
106 border: none; |
|
107 outline: none; |
|
108 font-size: 13px; |
|
109 width: 120px; |
|
110 height: 18px; |
|
111 padding-top: 3px; |
|
112 } |
|
113 |
|
114 ul.as-list { |
|
115 position: absolute; |
|
116 list-style-type: none; |
|
117 margin: 2px 0 0 0; |
|
118 padding: 0; |
|
119 font-size: 14px; |
|
120 color: #000; |
|
121 font-family: "Lucida Grande", arial, sans-serif; |
|
122 background-color: #fff; |
|
123 background-color: rgba(255,255,255,0.95); |
|
124 z-index: 2; |
|
125 box-shadow: 0 2px 12px #222; |
|
126 -webkit-box-shadow: 0 2px 12px #222; |
|
127 -moz-box-shadow: 0 2px 12px #222; |
|
128 border-radius: 5px; |
|
129 -webkit-border-radius: 5px; |
|
130 -moz-border-radius: 5px; |
|
131 } |
|
132 |
|
133 li.as-result-item, li.as-message { |
|
134 margin: 0 0 0 0; |
|
135 padding: 5px 12px; |
|
136 background-color: transparent; |
|
137 border: 1px solid #fff; |
|
138 border-bottom: 1px solid #ddd; |
|
139 cursor: pointer; |
|
140 border-radius: 5px; |
|
141 -webkit-border-radius: 5px; |
|
142 -moz-border-radius: 5px; |
|
143 } |
|
144 |
|
145 li:first-child.as-result-item { |
|
146 margin: 0; |
|
147 } |
|
148 |
|
149 li.as-message { |
|
150 margin: 0; |
|
151 cursor: default; |
|
152 } |
|
153 |
|
154 li.as-result-item.active { |
|
155 background-color: #3668d9; |
|
156 background-image: -webkit-gradient(linear, 0% 0%, 0% 64%, from(rgb(110, 129, 245)), to(rgb(62, 82, 242))); |
|
157 border-color: #3342e8; |
|
158 color: #fff; |
|
159 text-shadow: 0 1px 2px #122042; |
|
160 } |
|
161 |
|
162 li.as-result-item em { |
|
163 font-style: normal; |
|
164 background: #444; |
|
165 padding: 0 2px; |
|
166 color: #fff; |
|
167 } |
|
168 |
|
169 li.as-result-item.active em { |
|
170 background: #253f7a; |
|
171 color: #fff; |
|
172 } |
|
173 |
|
174 /* Webkit Hacks */ |
|
175 @media screen and (-webkit-min-device-pixel-ratio:0) { |
|
176 ul.as-selections { |
|
177 border-top-width: 2px; |
|
178 } |
|
179 ul.as-selections li.as-selection-item { |
|
180 padding-top: 3px; |
|
181 padding-bottom: 3px; |
|
182 } |
|
183 ul.as-selections li.as-selection-item a.as-close { |
|
184 margin-top: -1px; |
|
185 } |
|
186 ul.as-selections li.as-original input { |
|
187 height: 19px; |
|
188 } |
|
189 } |
|
190 |
|
191 /* Opera Hacks */ |
|
192 @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { |
|
193 ul.as-list { |
|
194 border: 1px solid #888; |
|
195 } |
|
196 ul.as-selections li.as-selection-item a.as-close { |
|
197 margin-left: 4px; |
|
198 margin-top: 0; |
|
199 } |
|
200 } |
|
201 |
|
202 /* IE Hacks */ |
|
203 ul.as-list { |
|
204 border: 1px solid #888\9; |
|
205 } |
|
206 ul.as-selections li.as-selection-item a.as-close { |
|
207 margin-left: 4px\9; |
|
208 margin-top: 0\9; |
|
209 } |
|
210 |
|
211 /* Firefox 3.0 Hacks */ |
|
212 ul.as-list, x:-moz-any-link, x:default { |
|
213 border: 1px solid #888; |
|
214 } |
|
215 BODY:first-of-type ul.as-list, x:-moz-any-link, x:default { /* Target FF 3.5+ */ |
|
216 border: none; |
|
217 } |