]>
Commit | Line | Data |
---|---|---|
e04c7a62 JF |
1 | /* iPhone.css - iPhone Interface Cascading Style Sheet |
2 | * Copyright (C) 2007-2008 Jay Freeman (saurik) | |
3 | */ | |
4 | ||
5 | /* | |
6 | * Redistribution and use in source and binary | |
7 | * forms, with or without modification, are permitted | |
8 | * provided that the following conditions are met: | |
9 | * | |
10 | * 1. Redistributions of source code must retain the | |
11 | * above copyright notice, this list of conditions | |
12 | * and the following disclaimer. | |
13 | * 2. Redistributions in binary form must reproduce the | |
14 | * above copyright notice, this list of conditions | |
15 | * and the following disclaimer in the documentation | |
16 | * and/or other materials provided with the | |
17 | * distribution. | |
18 | * 3. The name of the author may not be used to endorse | |
19 | * or promote products derived from this software | |
20 | * without specific prior written permission. | |
21 | * | |
22 | * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' | |
23 | * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, | |
24 | * BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF | |
25 | * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | |
26 | * ARE DISCLAIMED. IN NO EVENT SHALL THE AUTHOR BE | |
27 | * LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, | |
28 | * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT | |
29 | * NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR | |
30 | * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | |
31 | * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF | |
32 | * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR | |
33 | * TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN | |
34 | * ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF | |
35 | * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. | |
36 | */ | |
37 | ||
6f1a15d9 JF |
38 | /* .clearfix {{{ */ |
39 | .clearfix:after { | |
40 | content: "."; | |
41 | display: block; | |
42 | clear: both; | |
43 | visibility: hidden; | |
44 | line-height: 0; | |
45 | height: 0; | |
46 | } | |
47 | ||
48 | .clearfix { | |
6f1a15d9 JF |
49 | display: block; |
50 | } | |
6f1a15d9 JF |
51 | /* }}} */ |
52 | ||
53 | * { | |
680eb135 JF |
54 | border: 0; |
55 | -webkit-border-radius: 0; | |
6f1a15d9 JF |
56 | box-sizing: border-box; |
57 | -moz-box-sizing: border-box; | |
680eb135 JF |
58 | font-family: inherit; |
59 | font-size: 100%; | |
60 | font-style: inherit; | |
61 | font-weight: inherit; | |
62 | margin: 0; | |
63 | outline: 0; | |
64 | padding: 0; | |
65 | vertical-align: baseline; | |
66 | } | |
67 | ||
fd7853a6 JF |
68 | sup { |
69 | font-size: smaller; | |
70 | margin-top: -6px; | |
71 | position: relative; | |
72 | top: -6px; | |
73 | } | |
74 | ||
680eb135 JF |
75 | select { |
76 | border: 1px solid #999999; | |
6f1a15d9 JF |
77 | } |
78 | ||
79 | body { | |
80 | font-family: Helvetica; | |
6f1a15d9 JF |
81 | -webkit-text-size-adjust: none; |
82 | -webkit-user-select: none; | |
83 | } | |
84 | ||
680eb135 JF |
85 | body.pinstripe { |
86 | background: #c7ced5 url(pinstripes.png); | |
6f1a15d9 JF |
87 | } |
88 | ||
680eb135 JF |
89 | dialog { |
90 | display: block; | |
6f1a15d9 JF |
91 | position: absolute; |
92 | width: 100%; | |
93 | } | |
94 | ||
680eb135 JF |
95 | dialog > panel { |
96 | display: block; | |
97 | padding: 1px 0; | |
6f1a15d9 JF |
98 | } |
99 | ||
100 | a { | |
680eb135 | 101 | color: inherit; |
6f1a15d9 JF |
102 | text-decoration: none; |
103 | text-underline-style: dotted; | |
104 | } | |
105 | ||
680eb135 JF |
106 | a { |
107 | color: blue; | |
108 | } | |
109 | ||
6f1a15d9 JF |
110 | strong { |
111 | font-weight: bold | |
112 | } | |
113 | ||
680eb135 JF |
114 | pre, tt { |
115 | font-family: monospace; | |
116 | } | |
117 | ||
affeffc7 JF |
118 | pre { |
119 | letter-spacing: -2px; | |
120 | } | |
121 | ||
fd7853a6 JF |
122 | .default { |
123 | color: #aaaabb; | |
124 | } | |
125 | ||
6f1a15d9 | 126 | /* #toolbar {{{ */ |
680eb135 | 127 | dialog > toolbar { |
6f1a15d9 JF |
128 | background: url(toolbar.png) #6d84a2 repeat-x; |
129 | border-bottom: 1px solid #2d3642; | |
130 | height: 45px; | |
131 | padding: 10px; | |
132 | } | |
133 | ||
680eb135 | 134 | dialog > toolbar > h1 { |
6f1a15d9 JF |
135 | color: #ffffff; |
136 | font-size: 20px; | |
137 | font-weight: bold; | |
138 | height: 100%; | |
139 | margin: 1px auto 0 auto; | |
140 | text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0; | |
141 | text-align: center; | |
142 | white-space: nowrap; | |
143 | } | |
144 | /* }}} */ | |
145 | /* (back|forward)-button {{{ */ | |
680eb135 JF |
146 | dialog > toolbar > a.back-button, |
147 | dialog > toolbar > a.forward-button { | |
6f1a15d9 JF |
148 | color: #ffffff; |
149 | font-size: 12px; | |
150 | font-weight: bold; | |
151 | height: 30px; | |
152 | line-height: 30px; | |
153 | margin-top: -28px; | |
154 | padding: 0 3px; | |
155 | text-decoration: none; | |
156 | text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0; | |
157 | white-space: nowrap; | |
158 | } | |
159 | ||
680eb135 | 160 | dialog > toolbar > a.back-button { |
6f1a15d9 JF |
161 | -webkit-border-image: url(backButton.png) 0 8 0 14; |
162 | border-width: 0 8px 0 14px; | |
163 | float: left; | |
164 | } | |
165 | ||
680eb135 | 166 | dialog > toolbar > a.forward-button { |
6f1a15d9 JF |
167 | -webkit-border-image: url(toolButton.png) 0 5 0 5; |
168 | border-width: 0 5px; | |
169 | float: right; | |
170 | } | |
171 | /* }}} */ | |
172 | /* fieldset {{{ */ | |
680eb135 | 173 | dialog > panel > block { |
9487f027 JF |
174 | background-color: #c7ced5; |
175 | border-bottom: 1px solid #999999; | |
176 | border-top: 1px solid #999999; | |
177 | display: block; | |
178 | font-size: 16px; | |
179 | margin: 9px 10px; | |
180 | padding: 0 10px; | |
181 | } | |
182 | ||
680eb135 | 183 | dialog > panel > block > hr { |
9487f027 JF |
184 | border-width: 1px 0 0 0; |
185 | } | |
186 | ||
680eb135 | 187 | dialog > panel > fieldset { |
9487f027 | 188 | background-color: #ffffff; |
6f1a15d9 JF |
189 | border: 1px solid #999999; |
190 | -webkit-border-radius: 10px; | |
191 | font-size: 16px; | |
192 | margin: 9px; | |
6f1a15d9 JF |
193 | } |
194 | ||
fd7853a6 JF |
195 | dialog > panel > input[type="submit"] { |
196 | /*-webkit-border-image: url(whiteButton.png) 0 12 0 12; | |
197 | -webkit-border-radius: 0; | |
198 | border-width: 0px 12px;*/ | |
199 | border: none; | |
200 | color: #000000; | |
201 | display: block; | |
202 | font-size: 20px; | |
203 | font-weight: bold; | |
204 | margin: 9px; | |
205 | height: 44px; | |
206 | padding: 10px; | |
207 | text-align: center; | |
208 | width: 302px; | |
209 | } | |
210 | ||
680eb135 | 211 | dialog > panel > label { |
6f1a15d9 JF |
212 | display: block; |
213 | margin: 13px 0 -4px 27px; | |
214 | line-height: 24px; | |
215 | font-size: inherit; | |
216 | font-weight: bold; | |
217 | color: #4d4d70; | |
218 | text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0; | |
219 | } | |
220 | ||
680eb135 JF |
221 | fieldset > a, |
222 | fieldset > div, | |
223 | fieldset > textarea { | |
6f1a15d9 JF |
224 | border-top: 1px solid #999999; |
225 | min-height: 19px; | |
affeffc7 | 226 | padding: 12px 17px 11px 17px; |
6f1a15d9 JF |
227 | } |
228 | ||
680eb135 JF |
229 | fieldset > a:first-child, |
230 | fieldset > div:first-child { | |
6f1a15d9 JF |
231 | border-top: none; |
232 | } | |
233 | ||
680eb135 JF |
234 | fieldset > a img.icon, |
235 | fieldset > div img.icon { | |
6f1a15d9 JF |
236 | height: auto; |
237 | margin: -13px 5px -10px -10px; | |
238 | max-height: 30px; | |
239 | min-width: 30px; | |
6f1a15d9 JF |
240 | width: 30px; |
241 | } | |
242 | ||
680eb135 JF |
243 | panel > block > p, |
244 | fieldset > div > p { | |
7d2ac47f | 245 | margin: 11px 0; |
6f1a15d9 JF |
246 | text-align: center; |
247 | } | |
248 | ||
680eb135 | 249 | fieldset > div > ul { |
affeffc7 JF |
250 | margin-left: -20px; |
251 | } | |
252 | ||
680eb135 JF |
253 | fieldset > div > p:first-child, |
254 | fieldset > div > ul:first-child { | |
6f1a15d9 JF |
255 | margin-top: 0; |
256 | } | |
257 | ||
680eb135 JF |
258 | fieldset > div > p:last-child, |
259 | fieldset > div > ul:last-child { | |
7d2ac47f JF |
260 | margin-bottom: 0; |
261 | } | |
262 | ||
680eb135 | 263 | fieldset > a { |
6f1a15d9 JF |
264 | color: inherit; |
265 | display: block; | |
266 | } | |
267 | ||
fd7853a6 JF |
268 | fieldset > textarea, |
269 | fieldset > div > input, | |
270 | fieldset > div > select { | |
680eb135 | 271 | background: none; |
fd7853a6 JF |
272 | -webkit-box-shadow: none; |
273 | -webkit-appearance: none; | |
680eb135 JF |
274 | } |
275 | ||
fd7853a6 JF |
276 | fieldset > a, |
277 | fieldset > div > select { | |
278 | background: no-repeat url(chevron.png); | |
279 | background-position-y: 13px; | |
6f1a15d9 JF |
280 | } |
281 | ||
fd7853a6 JF |
282 | dialog > fieldset > a { |
283 | background-position-x: 295px; | |
284 | } | |
285 | ||
286 | dialog > panel > fieldset > a { | |
287 | background-position-x: 275px; | |
288 | } | |
289 | ||
290 | dialog > fieldset > div > select { | |
291 | background-position-x: 192px; | |
292 | } | |
293 | ||
294 | dialog > panel > fieldset > div > select { | |
295 | background-position-x: 172px; | |
680eb135 JF |
296 | } |
297 | ||
298 | fieldset > textarea, | |
299 | fieldset > div > input, | |
300 | fieldset > div > select, | |
301 | fieldset > a > label + div, | |
302 | fieldset > div > label + div { | |
6f1a15d9 | 303 | color: #193250; |
680eb135 JF |
304 | } |
305 | ||
306 | fieldset > textarea, | |
307 | fieldset > div > input, | |
308 | fieldset > div > select { | |
6f1a15d9 | 309 | font-size: 16px; |
680eb135 JF |
310 | } |
311 | ||
fd7853a6 | 312 | fieldset > div > select, |
680eb135 JF |
313 | fieldset > div > input { |
314 | border: none; | |
fd7853a6 JF |
315 | height: 44px; |
316 | margin: -13px -17px -13px 86px; | |
680eb135 JF |
317 | } |
318 | ||
fd7853a6 | 319 | dialog > panel > fieldset > div > select, |
680eb135 | 320 | dialog > panel > fieldset > div > input { |
fd7853a6 | 321 | width: 187px; |
6f1a15d9 JF |
322 | } |
323 | ||
fd7853a6 | 324 | dialog > fieldset > div > select, |
680eb135 | 325 | dialog > fieldset > div > input { |
fd7853a6 | 326 | width: 207px; |
680eb135 JF |
327 | } |
328 | ||
fd7853a6 JF |
329 | fieldset > div > input { |
330 | padding: 13px 7px; | |
331 | } | |
332 | ||
333 | fieldset > textarea { | |
6f1a15d9 | 334 | padding: 10px; |
fd7853a6 | 335 | width: 320px; |
6f1a15d9 JF |
336 | } |
337 | ||
680eb135 JF |
338 | fieldset > a > label, |
339 | fieldset > div > label { | |
6f1a15d9 | 340 | font-weight: bold; |
affeffc7 | 341 | padding: 1px 0 0 0; |
6f1a15d9 JF |
342 | position: absolute; |
343 | } | |
344 | ||
680eb135 | 345 | fieldset > a > label + div { |
6f1a15d9 JF |
346 | margin-right: 16px; |
347 | } | |
348 | ||
680eb135 JF |
349 | dialog > fieldset > a > label + div, |
350 | dialog > fieldset > div > label + div { | |
351 | margin-left: 94px; | |
352 | } | |
353 | ||
354 | dialog > panel > fieldset > a > label + div, | |
355 | dialog > panel > fieldset > div > label + div { | |
affeffc7 | 356 | float: right; |
6f1a15d9 JF |
357 | text-align: right; |
358 | } | |
affeffc7 | 359 | |
680eb135 | 360 | dialog > panel > img { |
affeffc7 JF |
361 | display: block; |
362 | margin: 9px auto 4px auto; | |
363 | height: auto; | |
364 | width: 300px; | |
365 | } | |
6f1a15d9 | 366 | /* }}} */ |