1 /* iPhone.css - iPhone Interface Cascading Style Sheet
2 * Copyright (C) 2007-2008 Jay Freeman (saurik)
6 * Redistribution and use in source and binary
7 * forms, with or without modification, are permitted
8 * provided that the following conditions are met:
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
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.
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.
55 -moz-border-radius: 0;
56 -webkit-border-radius: 0;
57 box-sizing: border-box
;
58 -moz-box-sizing: border-box
;
59 -ms-box-sizing: border-box
;
60 -webkit-box-sizing: border-box
;
61 /*font-family: inherit;*/
68 text-decoration: none
;
69 vertical-align: baseline
;
84 border: 1px solid
#999999;
93 font-family: Helvetica
, Arial
;
94 -webkit-text-size-adjust: none
;
95 -webkit-user-select: none
;
101 background-color: #ffffff;
105 background: #c7ced5 url
(cydia://uikit-image
/UIPinstripe
.png
);
106 background-size: 7px 1px;
121 text-underline-style: dotted
;
129 font-family: monospace
;
133 letter-spacing: -2px;
150 background: url
(toolbar.png) #6d84a2 repeat-x
;
151 border-bottom: 1px solid
#2d3642;
156 dialog
> toolbar
> h1
{
161 margin: 1px auto
0 auto
;
162 text-shadow: rgba
(0, 0, 0, 0.4) 0px -1px 0;
167 /* (back|forward)-button {{{ */
168 dialog
> toolbar
> a
.back-button
,
169 dialog
> toolbar
> a
.forward-button
{
177 text-decoration: none
;
178 text-shadow: rgba
(0, 0, 0, 0.6) 0px -1px 0;
182 dialog
> toolbar
> a
.back-button
{
183 -webkit-border-image: url
(backButton.png) 0 8 0 14;
184 border-width: 0 8px 0 14px;
188 dialog
> toolbar
> a
.forward-button
{
189 -webkit-border-image: url
(toolButton.png) 0 5 0 5;
196 /*background-color: #ccd1d5;*/
197 /*background-color: white;*/
198 /*background-color: #c7ced5;*/
199 background-color: transparent
;
200 //background-color: #ffffff;
201 border-bottom: 1px solid
#999999;
202 border-top: 1px solid
#999999;
203 border-left: 1px dotted
#999999;
204 border-right: 1px dotted
#999999;
205 -moz-border-radius: 9px;
206 -webkit-border-radius: 9px;
207 //border: 1px solid
#999999;
214 panel
> fieldset
> div
> hr
,
216 border-top: 1px dashed
#999999;
220 background-color: #ffffff;
221 border: 1px solid
#999999;
222 -moz-border-radius: 9px;
223 -webkit-border-radius: 9px;
228 panel
> input
[type
="submit"] {
229 /*-webkit-border-image: url(whiteButton.png) 0 12 0 12;
230 -moz-border-radius: 0;
231 -webkit-border-radius: 0;
232 border-width: 0px 12px;*/
246 background: #a7b3bc url
(cydia://uikit-image
/UISectionListHeaderBackground
.png
);
247 background-repeat: repeat-x no-repeat-y
;
249 padding: 4px 15px 1px 15px;
254 text-shadow: rgba
(0, 0, 0, 0.5) 0px 1px 0;
259 margin: 13px 0 -4px 24px;
264 text-shadow: rgba
(255, 255, 255, 0.75) 1px 1px 0;
267 panel
> fieldset
> a
,
268 panel
> fieldset
> div
,
269 panel
> fieldset
> textarea
{
270 border-top: 1px solid
#999999;
273 /* XXX: should be a.left:nth-last-child(2) */
274 panel
> fieldset
> a
.left
,
275 panel
> fieldset
> a
.middle
,
276 panel
> fieldset
> a:first-child
,
277 panel
> fieldset
> div:first-child
,
278 panel
> fieldset
> textarea:first-child
{
283 list
> fieldset
> div
,
284 list
> fieldset
> textarea
{
285 border-bottom: 1px solid
#e0e0e0;
288 fieldset
> a:not
([type
="ad"]),
290 fieldset
> textarea
{
291 /* XXX: small differences due to font bugs */
292 padding: 12px 14px 10px 14px;
295 /*fieldset > a:not([type="ad"]):last-child,
296 fieldset > div:last-child {
297 padding-bottom: 10px;
300 fieldset
> a
[type
="ad"] {
301 /* XXX: small differences due to font bugs */
302 padding: 4px 4px 2px 5px;
305 panel
> fieldset
> a
[type
="ad"]:first-child
> div:first-child
,
306 panel
> fieldset
> a
[type
="comment"]:first-child
> div:first-child
,
307 panel
> fieldset
> a
[type
="profile"]:first-child
> div:first-child
,
308 panel
> fieldset
> a
[type
="thumb"]:first-child
> div:first-child
{
309 -moz-border-radius-topleft: 9px;
310 -webkit-border-top-left-radius: 9px;
313 panel
> fieldset
> a
[type
="ad"]:last-child
> div:first-child
,
314 panel
> fieldset
> a
[type
="comment"]:last-child
> div:first-child
,
315 panel
> fieldset
> a
[type
="profile"]:last-child
> div:first-child
,
316 panel
> fieldset
> a
[type
="thumb"]:last-child
> div:first-child
{
317 -moz-border-radius-bottomleft: 9px;
318 -webkit-border-bottom-left-radius: 9px;
321 fieldset
> a
[type
="ad"] > div:first-child
{
322 border: 1px solid
#999999;
325 list
> fieldset
> a
[type
="comment"] > div:first-child
,
326 list
> fieldset
> a
[type
="profile"] > div:first-child
,
327 list
> fieldset
> a
[type
="thumb"] > div:first-child
{
328 border: 1px solid
#e0e0e0;
331 panel
> fieldset
> a
[type
="comment"] > div:first-child
{
332 border: 1px solid
#999999;
333 border-bottom-style: dashed
;
336 panel
> fieldset
> a
[type
="profile"] > div:first-child
,
337 panel
> fieldset:not
(.header
) > a
[type
="thumb"] > div:first-child
{
338 border: 1px solid
#999999;
347 div
[tile
="app"] { background-image: url
(http://cache
.saurik
.com
/cydia
/tile
/app
.png
); }
348 div
[tile
="call"] { background-image: url
(http://cache
.saurik
.com
/cydia
/tile
/call
.png
); }
349 div
[tile
="map"] { background-image: url
(http://cache
.saurik
.com
/cydia
/tile
/map
.png
); }
350 div
[tile
="media"] { background-image: url
(http://cache
.saurik
.com
/cydia
/tile
/media
.png
); }
351 div
[tile
="music"] { background-image: url
(http://cache
.saurik
.com
/cydia
/tile
/video
.png
); }
352 div
[tile
="site"] { background-image: url
(http://cache
.saurik
.com
/cydia
/tile
/site
.png
); }
354 fieldset
> a
[type
="ad"] > div:first-child
{
355 background-repeat: no-repeat
;
356 background-position: center center
;
358 display: inline-block
;
361 /* XXX: small differences due to font bugs */
362 /* XXX: 1px difference due to border stupidity */
363 margin: -5px 5px -3px -6px;
367 panel
> fieldset
> a
[type
="comment"] {
368 border-bottom-style: dashed
;
371 fieldset
> a
[type
="comment"] > div:first-child
{
372 -webkit-background-size: 44px;
377 fieldset
> a
[type
="header"] > div:first-child
{
382 fieldset
> a
[type
="profile"] > div:first-child
{
383 -webkit-background-size: 50px;
388 fieldset
> a
[type
="thumb"] > div:first-child
{
393 fieldset
> a
[type
="comment"] > div:first-child
,
394 fieldset
> a
[type
="header"] > div:first-child
,
395 fieldset
> a
[type
="profile"] > div:first-child
,
396 fieldset
> a
[type
="thumb"] > div:first-child
{
397 background-repeat: no-repeat
;
398 background-position: center center
;
399 display: inline-block
;
400 /* XXX: small differences due to font bugs */
401 /* XXX: 1px difference due to border stupidity */
402 margin: -13px 7px -11px -15px;
405 fieldset
> a
> img
.icon
,
406 fieldset
> div
> img
.icon
{
408 /* XXX: small differences due to font bugs */
409 margin: -7px 6px -9px -8px;
415 fieldset
> a
.sixth
> img
.icon
{
423 fieldset
> div
> ul
{
428 fieldset
> div
> ul
{
437 fieldset
> div
> p:first-child
,
438 fieldset
> div
> ul:first-child
{
442 fieldset
> div
> p:last-child
,
443 fieldset
> div
> ul:last-child
{
453 fieldset
> div
> input:not
([type
="checkbox"]),
454 fieldset
> div
> select
,
455 fieldset
> div
> div
> select
{
457 -webkit-box-shadow: none
;
458 -webkit-appearance: none
;
463 fieldset
> a
[href
]:not
([type
="ad"]),
464 fieldset
> div
> select
,
465 fieldset
> div
> div
> select
{
466 background-repeat: no-repeat
;
467 background-image: url
(chevron.png);
472 list
> fieldset
> a
[href
] {
473 background-position: 295px center
;
476 panel
> fieldset
> a
[href
] {
477 background-position: 275px center
;
480 panel
> fieldset
> a
[href
].half
{
481 background-position: 125px center
;
484 panel
> fieldset
> a
[href
].third
{
485 background-position: 75px center
;
488 panel
> fieldset
> a
[href
].sixth
{
492 list
> fieldset
> a:not
([href
]) > select
,
493 list
> fieldset
> div
> select
,
494 list
> fieldset
> div
> div
> select
{
495 background-position: 183px center
;
498 panel
> fieldset
> a:not
([href
]) > select
,
499 panel
> fieldset
> div
> select
,
500 panel
> fieldset
> div
> div
> select
{
501 background-position: 163px center
;
507 fieldset
> div
> input
,
508 fieldset
> div
> select
,
509 fieldset
> div
> div
> select
,
510 fieldset
> a
> div
> label
+ label
,
511 fieldset
> div
> div
> label
+ label
{
516 fieldset
> div
> input
,
517 fieldset
> div
> select
,
518 fieldset
> div
> div
> select
{
522 fieldset
> div
> input
{
527 fieldset
> div
> input
[type
="checkbox"] {
528 border: 1px solid
#999999;
529 -moz-border-radius: 7px;
530 -webkit-border-radius: 7px;
537 fieldset
> div
> select
,
538 fieldset
> div
> div
> select
,
539 fieldset
> div
> input:not
([type
="checkbox"]) {
543 margin: -11px -13px -11px -14px;
546 panel
> fieldset
> div
> select
,
547 panel
> fieldset
> div
> div
> select
,
548 panel
> fieldset
> div
> input:not
([type
="checkbox"]) {
552 list
> fieldset
> div
> select
,
553 list
> fieldset
> div
> div
> select
,
554 list
> fieldset
> div
> input:not
([type
="checkbox"]) {
558 fieldset
> textarea
{
563 fieldset
> div
> div
,
565 display: inline-block
;
568 fieldset
> div
> div
{
572 fieldset
> a
[type
="ad"] > div:nth-child
(2) {
576 fieldset
> a:not
([type
]) > div
{
580 fieldset
> a:not
([href
]) > img
.icon
+ div
,
581 fieldset
> div
> img
.icon
+ div
{
585 fieldset
> a
[href
] > img
.icon
+ div
{
589 fieldset
> a
[type
="profile"] > div:nth-child
(2) > label:nth-child
(1).unknown
{
593 fieldset
> a
[type
="profile"] > div:nth-child
(2) > label:only-child
{
599 fieldset
> a
[type
="thumb"] > div:nth-child
(2) > label:only-child
{
604 fieldset
> a
[type
="profile"] > div:nth-child
(2) > label
+ label
{
610 fieldset
> a
[type
="thumb"] > div:nth-child
(2) > label
+ label
{
615 fieldset
> a
[type
="profile"] > div:nth-child
(2) {
619 fieldset
> a
[type
="thumb"] > div:nth-child
(2) {
623 fieldset
> a
[type
="profile"] > div:nth-child
(2) {
627 fieldset
> a
[type
="profile"] > div:nth-child
(2),
628 fieldset
> a
[type
="thumb"] > div:nth-child
(2) {
632 fieldset
> a
> label:first-child
,
633 fieldset
> a
> div
> label:first-child
,
634 fieldset
> div
> label:first-child
,
635 fieldset
> div
> div
> label:first-child
{
639 /* XXX: this doesn't handle icon offsets */
640 list
> fieldset
> a:not
([type
]) > div
> label
+ label
,
641 list
> fieldset
> div
> div
> label
+ label
{
645 panel
> fieldset
> a:not
([type
]) > div
> label
+ label
,
646 panel
> fieldset
> div
> div
> label
+ label
{
653 margin: 9px auto
4px auto
;
658 fieldset
> a
[type
="ad"] {
661 fieldset
> a
[type
="ad"] > div:nth-child
(2) {
666 fieldset
> a
[type
="ad"] > div
> label:first-child
{
673 fieldset
> a
[type
="ad"] > div
> label
+ label
{
681 panel
> fieldset
> a
.middle
,
682 panel
> fieldset
> a
.right
{
683 border-left: 1px solid
#999999;
686 panel
> fieldset
> a
.half
{
687 display: inline-block
;
691 panel
> fieldset
> a
.third
{
692 display: inline-block
;
696 panel
> fieldset
> a
.sixth
{
697 display: inline-block
;
703 background-position: 120px center
;
706 fieldset
.half
> a
> img
.icon
+ div
{
715 block
+ fieldset
.right
,
716 fieldset
+ fieldset
.right
{
724 panel
> fieldset
.dashed
> a
,
725 panel
> fieldset
.dashed
> div
,
726 panel
> fieldset
.dashed
> textarea
,
727 list
> fieldset
.dashed
> a
,
728 list
> fieldset
.dashed
> div
,
729 list
> fieldset
.dashed
> textarea
{
730 border-style: dashed
;
733 fieldset
> a
[type
="thumb"]:first-child
> back
{
734 -moz-border-radius-topright: 9px;
735 -webkit-border-top-right-radius: 9px;
738 fieldset
> a
[type
="thumb"]:last-child
> back
{
739 -moz-border-radius-bottomright: 9px;
740 -webkit-border-bottom-right-radius: 9px;
743 fieldset
> a
[type
="thumb"] > back
{
744 background-repeat: no-repeat
;
745 border: 1px solid
#999999;
756 border: 1px solid
#999999;
757 -moz-border-radius: 9px;
758 -webkit-border-radius: 9px;
776 fieldset
> a
.small label
{
777 display: inline-block
;
782 fieldset
> a
.small
> img
.icon
{
788 fieldset
> a
.small
.half
> img
.icon
+ div
{
792 fieldset
> a
.small
.third
> img
.icon
+ div
{
796 fieldset
> a
.small
.sixth
> img
.icon
+ div
{
800 panel
.centered
> label
{
810 panel
> iframe:first-child
,
811 panel
> iframe
+ iframe
{
815 /* Rating Stars {{{ */
822 display: inline-block
;
837 display: inline-block
;
844 background: url
(http://cache
.saurik
.com
/crystal
/16x16/actions
/knewstuff
.png
);
854 display: inline-block
;
863 /*border-right: 1px solid #999999;*/
868 panel
> fieldset
.header
{
869 background-color: transparent
;
871 margin: -5px 9px -11px 9px;
874 panel
> fieldset
.header
> a
> div
> label
{
876 text-shadow: rgba
(255, 255, 255, 0.75) 1px 1px 0;