/* iPhone.css - iPhone Interface Cascading Style Sheet * Copyright (C) 2007-2008 Jay Freeman (saurik) */ /* * Redistribution and use in source and binary * forms, with or without modification, are permitted * provided that the following conditions are met: * * 1. Redistributions of source code must retain the * above copyright notice, this list of conditions * and the following disclaimer. * 2. Redistributions in binary form must reproduce the * above copyright notice, this list of conditions * and the following disclaimer in the documentation * and/or other materials provided with the * distribution. * 3. The name of the author may not be used to endorse * or promote products derived from this software * without specific prior written permission. * * THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, * BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE * ARE DISCLAIMED. IN NO EVENT SHALL THE AUTHOR BE * LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT * NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF * LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR * TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN * ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. */ /* .clearfix {{{ */ .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: block; } /* }}} */ * { border: 0; -moz-border-radius: 0; -webkit-border-radius: 0; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; /*font-family: inherit;*/ font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; text-decoration: none; vertical-align: baseline; } a { color: inherit; } sup { font-size: smaller; margin-top: -6px; position: relative; top: -6px; } select { border: 1px solid #999999; } panel { display: block; width: 320px; } body { font-family: Helvetica, Arial; -webkit-text-size-adjust: none; -webkit-user-select: none; margin: 0 auto; width: 320px; } body.white { background-color: #ffffff; } body.pinstripe { background: #c7ced5 url(cydia://uikit-image/UIPinstripe.png); background-size: 7px 1px; } dialog { display: block; position: absolute; width: 100%; } dialog > panel { display: block; } a { color: blue; text-underline-style: dotted; } strong { font-weight: bold } pre, tt { font-family: monospace; } pre { letter-spacing: -2px; } em { font-style: italic; } .default { color: #aaaabb; } .deleted { display: none; } /* #toolbar {{{ */ dialog > toolbar { background: url(toolbar.png) #6d84a2 repeat-x; border-bottom: 1px solid #2d3642; height: 45px; padding: 10px; } dialog > toolbar > h1 { color: #ffffff; font-size: 20px; font-weight: bold; height: 100%; margin: 1px auto 0 auto; text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0; text-align: center; white-space: nowrap; } /* }}} */ /* (back|forward)-button {{{ */ dialog > toolbar > a.back-button, dialog > toolbar > a.forward-button { color: #ffffff; font-size: 12px; font-weight: bold; height: 30px; line-height: 30px; margin-top: -28px; padding: 0 3px; text-decoration: none; text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0; white-space: nowrap; } dialog > toolbar > a.back-button { -webkit-border-image: url(backButton.png) 0 8 0 14; border-width: 0 8px 0 14px; float: left; } dialog > toolbar > a.forward-button { -webkit-border-image: url(toolButton.png) 0 5 0 5; border-width: 0 5px; float: right; } /* }}} */ panel > block { /*background-color: #ccd1d5;*/ /*background-color: white;*/ /*background-color: #c7ced5;*/ background-color: transparent; //background-color: #ffffff; border-bottom: 1px solid #999999; border-top: 1px solid #999999; border-left: 1px dotted #999999; border-right: 1px dotted #999999; -moz-border-radius: 9px; -webkit-border-radius: 9px; //border: 1px solid #999999; display: block; font-size: 16px; margin: 9px; padding: 0 10px; } panel > fieldset > div > hr, panel > block > hr { border-top: 1px dashed #999999; } panel > fieldset { background-color: #ffffff; border: 1px solid #999999; -moz-border-radius: 9px; -webkit-border-radius: 9px; font-size: 16px; margin: 9px; } panel > input[type="submit"] { /*-webkit-border-image: url(whiteButton.png) 0 12 0 12; -moz-border-radius: 0; -webkit-border-radius: 0; border-width: 0px 12px;*/ border: none; color: #000000; display: block; font-size: 20px; font-weight: bold; margin: 9px; height: 44px; padding: 10px; text-align: center; width: 302px; } list > label { background: #a7b3bc url(cydia://uikit-image/UISectionListHeaderBackground.png); background-repeat: repeat-x no-repeat-y; margin-bottom: 0px; padding: 4px 15px 1px 15px; display: block; color: white; font-size: inherit; font-weight: bold; text-shadow: rgba(0, 0, 0, 0.5) 0px 1px 0; } panel > label { display: block; margin: 13px 0 -4px 24px; line-height: 24px; font-size: inherit; font-weight: bold; color: #4d4d70; text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0; } panel > fieldset > a, panel > fieldset > div, panel > fieldset > textarea { border-top: 1px solid #999999; } /* XXX: should be a.left:nth-last-child(2) */ panel > fieldset > a.left, panel > fieldset > a.middle, panel > fieldset > a:first-child, panel > fieldset > div:first-child, panel > fieldset > textarea:first-child { border-top: 0; } list > fieldset > a, list > fieldset > div, list > fieldset > textarea { border-bottom: 1px solid #e0e0e0; } fieldset > a:not([type="ad"]), fieldset > div, fieldset > textarea { /* XXX: small differences due to font bugs */ padding: 12px 14px 10px 14px; } /*fieldset > a:not([type="ad"]):last-child, fieldset > div:last-child { padding-bottom: 10px; }*/ fieldset > a[type="ad"] { /* XXX: small differences due to font bugs */ padding: 4px 4px 2px 5px; } panel > fieldset > a[type="ad"]:first-child > div:first-child, panel > fieldset > a[type="comment"]:first-child > div:first-child, panel > fieldset > a[type="profile"]:first-child > div:first-child, panel > fieldset > a[type="thumb"]:first-child > div:first-child { -moz-border-radius-topleft: 9px; -webkit-border-top-left-radius: 9px; } panel > fieldset > a[type="ad"]:last-child > div:first-child, panel > fieldset > a[type="comment"]:last-child > div:first-child, panel > fieldset > a[type="profile"]:last-child > div:first-child, panel > fieldset > a[type="thumb"]:last-child > div:first-child { -moz-border-radius-bottomleft: 9px; -webkit-border-bottom-left-radius: 9px; } fieldset > a[type="ad"] > div:first-child { border: 1px solid #999999; } list > fieldset > a[type="comment"] > div:first-child, list > fieldset > a[type="profile"] > div:first-child, list > fieldset > a[type="thumb"] > div:first-child { border: 1px solid #e0e0e0; } panel > fieldset > a[type="comment"] > div:first-child { border: 1px solid #999999; border-bottom-style: dashed; } panel > fieldset > a[type="profile"] > div:first-child, panel > fieldset:not(.header) > a[type="thumb"] > div:first-child { border: 1px solid #999999; } div[tile] { float: right; height: 30px; width: 30px; } div[tile="app"] { background-image: url(http://cache.saurik.com/cydia/tile/app.png); } div[tile="call"] { background-image: url(http://cache.saurik.com/cydia/tile/call.png); } div[tile="map"] { background-image: url(http://cache.saurik.com/cydia/tile/map.png); } div[tile="media"] { background-image: url(http://cache.saurik.com/cydia/tile/media.png); } div[tile="music"] { background-image: url(http://cache.saurik.com/cydia/tile/video.png); } div[tile="site"] { background-image: url(http://cache.saurik.com/cydia/tile/site.png); } fieldset > a[type="ad"] > div:first-child { background-repeat: no-repeat; background-position: center center; border-right: none; display: inline-block; height: 40px; line-height: 38px; /* XXX: small differences due to font bugs */ /* XXX: 1px difference due to border stupidity */ margin: -5px 5px -3px -6px; width: 40px; } panel > fieldset > a[type="comment"] { border-bottom-style: dashed; } fieldset > a[type="comment"] > div:first-child { -webkit-background-size: 44px; height: 44px; width: 44px; } fieldset > a[type="header"] > div:first-child { height: 64px; width: 64px; } fieldset > a[type="profile"] > div:first-child { -webkit-background-size: 50px; height: 50px; width: 50px; } fieldset > a[type="thumb"] > div:first-child { height: 64px; width: 64px; } fieldset > a[type="comment"] > div:first-child, fieldset > a[type="header"] > div:first-child, fieldset > a[type="profile"] > div:first-child, fieldset > a[type="thumb"] > div:first-child { background-repeat: no-repeat; background-position: center center; display: inline-block; /* XXX: small differences due to font bugs */ /* XXX: 1px difference due to border stupidity */ margin: -13px 7px -11px -15px; } fieldset > a > img.icon, fieldset > div > img.icon { height: auto; /* XXX: small differences due to font bugs */ margin: -7px 6px -9px -8px; max-height: 30px; min-width: 30px; width: 30px; } fieldset > a.sixth > img.icon { position: relative; left: 7px; } panel > block > p, fieldset > div > p, panel > block > ul, fieldset > div > ul { margin: 10px 0; } panel > block > ul, fieldset > div > ul { margin-left: 13px; } panel > block > p, fieldset > div > p { text-align: center; } fieldset > div > p:first-child, fieldset > div > ul:first-child { margin-top: 0; } fieldset > div > p:last-child, fieldset > div > ul:last-child { margin-bottom: 0; } fieldset > a { color: inherit; display: block; } fieldset > textarea, fieldset > div > input:not([type="checkbox"]), fieldset > div > select, fieldset > div > div > select { background: none; -webkit-box-shadow: none; -webkit-appearance: none; } /* Chevrons {{{ */ fieldset > a[href]:not([type="ad"]), fieldset > div > select, fieldset > div > div > select { background-repeat: no-repeat; background-image: url(chevron.png); } @media screen and (-webkit-min-device-pixel-ratio: 2) { fieldset > a[href]:not([type="ad"]), fieldset > div > select, fieldset > div > div > select { background-image: url(chevron@2x.png); background-size: 10px 13px; } } /* Horizontal */ list > fieldset > a[href] { background-position: 295px center; } panel > fieldset > a[href] { background-position: 275px center; } panel > fieldset > a[href].half { background-position: 125px center; } panel > fieldset > a[href].third { background-position: 75px center; } panel > fieldset > a[href].sixth { background: none; } list > fieldset > a:not([href]) > select, list > fieldset > div > select, list > fieldset > div > div > select { background-position: 183px center; } panel > fieldset > a:not([href]) > select, panel > fieldset > div > select, panel > fieldset > div > div > select { background-position: 163px center; } /* }}} */ fieldset > textarea, fieldset > div > input, fieldset > div > select, fieldset > div > div > select, fieldset > a > div > label + label, fieldset > div > div > label + label { color: #193250; } fieldset > textarea, fieldset > div > input, fieldset > div > select, fieldset > div > div > select { font-size: 16px; } fieldset > div > input { padding-left: 7px; padding-right: 14px; } fieldset > div > input[type="checkbox"] { border: 1px solid #999999; -moz-border-radius: 7px; -webkit-border-radius: 7px; float: right; margin: -7px -8px; height: 30px; width: 30px; } fieldset > div > select, fieldset > div > div > select, fieldset > div > input:not([type="checkbox"]) { border: none; float: right; height: 40px; margin: -11px -13px -11px -14px; } panel > fieldset > div > select, panel > fieldset > div > div > select, panel > fieldset > div > input:not([type="checkbox"]) { width: 187px; } list > fieldset > div > select, list > fieldset > div > div > select, list > fieldset > div > input:not([type="checkbox"]) { width: 207px; } fieldset > textarea { padding: 10px; width: 320px; } fieldset > div > div, fieldset > a > div { display: inline-block; } fieldset > div > div { width: 273px; } fieldset > a[type="ad"] > div:nth-child(2) { width: 218px; } fieldset > a:not([type]) > div { width: 250px; } fieldset > a:not([href]) > img.icon + div, fieldset > div > img.icon + div { width: 244px; } fieldset > a[href] > img.icon + div { width: 221px; } fieldset > a[type="profile"] > div:nth-child(2) > label:nth-child(1).unknown { color: #aaaabb; } fieldset > a[type="profile"] > div:nth-child(2) > label:only-child { left: 4px; position: relative; top: 3px; } fieldset > a[type="thumb"] > div:nth-child(2) > label:only-child { position: relative; top: 10px; } fieldset > a[type="profile"] > div:nth-child(2) > label + label { display: block; font-size: 13px; margin-top: 2px; } fieldset > a[type="thumb"] > div:nth-child(2) > label + label { display: block; margin-top: 2px; } fieldset > a[type="profile"] > div:nth-child(2) { width: 207px; } fieldset > a[type="thumb"] > div:nth-child(2) { width: 193px; } fieldset > a[type="profile"] > div:nth-child(2) { margin: -5px 0; } fieldset > a[type="profile"] > div:nth-child(2), fieldset > a[type="thumb"] > div:nth-child(2) { vertical-align: top; } fieldset > a > label:first-child, fieldset > a > div > label:first-child, fieldset > div > label:first-child, fieldset > div > div > label:first-child { font-weight: bold; } /* XXX: this doesn't handle icon offsets */ list > fieldset > a:not([type]) > div > label + label, list > fieldset > div > div > label + label { margin-left: 94px; } panel > fieldset > a:not([type]) > div > label + label, panel > fieldset > div > div > label + label { float: right; text-align: right; } panel > img { display: block; margin: 9px auto 4px auto; height: auto; width: 300px; } fieldset > a[type="ad"] { } fieldset > a[type="ad"] > div:nth-child(2) { position: relative; vertical-align: top; } fieldset > a[type="ad"] > div > label:first-child { color: #2d2d50; font-size: 13px; font-weight: bold; line-height: 15px; } fieldset > a[type="ad"] > div > label + label { position: absolute; top: 17px; left: 156px; font-size: 9.5px; font-weight: normal; } panel > fieldset > a.middle, panel > fieldset > a.right { border-left: 1px solid #999999; } panel > fieldset > a.half { display: inline-block; width: 150px; } panel > fieldset > a.third { display: inline-block; width: 100px; } panel > fieldset > a.sixth { display: inline-block; width: 50px; } fieldset.half > a { background: none; background-position: 120px center; } fieldset.half > a > img.icon + div { width: 65px; } fieldset.right { float: right; margin-left: 10px; } block + fieldset.right, fieldset + fieldset.right { margin-top: 0; } fieldset.half { width: 146px; } panel > fieldset.dashed > a, panel > fieldset.dashed > div, panel > fieldset.dashed > textarea, list > fieldset.dashed > a, list > fieldset.dashed > div, list > fieldset.dashed > textarea { border-style: dashed; } fieldset > a[type="thumb"]:first-child > back { -moz-border-radius-topright: 9px; -webkit-border-top-right-radius: 9px; } fieldset > a[type="thumb"]:last-child > back { -moz-border-radius-bottomright: 9px; -webkit-border-bottom-right-radius: 9px; } fieldset > a[type="thumb"] > back { background-repeat: no-repeat; border: 1px solid #999999; display: block; height: 64px; left: 62px; position: absolute; opacity: 0.2; top: -1px; width: 237px; } .mm { border: 1px solid #999999; -moz-border-radius: 9px; -webkit-border-radius: 9px; } a.mm { display: block; margin: 9px; } div.mm img { height: auto; width: 300px; } fieldset > a.small { font-size: 12px; padding-top: 9px; } fieldset > a.small label { display: inline-block; position: relative; top: 1px; } fieldset > a.small > img.icon { max-height: 22px; min-width: 22px; width: 22px; } fieldset > a.small.half > img.icon + div { width: 79px; } fieldset > a.small.third > img.icon + div { width: 50px; } fieldset > a.small.sixth > img.icon + div { width: 0px; } panel.centered > label { margin-left: 0px; margin-right: 0px; text-align: center; } panel > iframe { margin: -9px 0; } panel > iframe:first-child, panel > iframe + iframe { margin-top: 0; } /* Rating Stars {{{ */ .ratings { margin: -2px 0; text-align: center; } .rated { display: inline-block; } .rated.left { margin-right: 9px; } .rated label { font-weight: bold; margin-right: 3px; position: relative; top: -3px; } .rating { display: inline-block; width: 80px; } .rating .back, .rating .fore, .rating .star { background: url(http://cache.saurik.com/crystal/16x16/actions/knewstuff.png); height: 16px; } .rating .back, .rating .fore { width: 80px; } .rating .star { display: inline-block; width: 16px; } .rating .back { opacity: 0.2; } .rating .fore { /*border-right: 1px solid #999999;*/ position: absolute; } /* }}} */ panel > fieldset.header { background-color: transparent; border: none; margin: -5px 9px -11px 9px; } panel > fieldset.header > a > div > label { color: #4d4d70; text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0; }