X-Git-Url: https://git.saurik.com/cydia.git/blobdiff_plain/1eb0c5545ce83b3f796e8a066c08d8a6c5055c0c..d8d9a65cd4a5c345be8b749a1277861a49790158:/Cydia.app/menes/style.css diff --git a/Cydia.app/menes/style.css b/Cydia.app/menes/style.css index ffae7216..61a53df3 100644 --- a/Cydia.app/menes/style.css +++ b/Cydia.app/menes/style.css @@ -1,3 +1,40 @@ +/* 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: "."; @@ -9,56 +46,70 @@ } .clearfix { - display: inline-block; -} - -html[xmlns] .clearfix { display: block; } - -* html .clearfix { - height: 1%; -} /* }}} */ * { + border: 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; } body { + width: 320px; font-family: Helvetica; - margin: 0; - padding: 0; -webkit-text-size-adjust: none; -webkit-user-select: none; } -#page { - position: relative; -} - -.dialog { - position: absolute; - width: 100%; +body.white { + background-color: #ffffff; } -hr { - margin-top: 10px; +body.pinstripe { + background: #c7ced5 url(cydia://uikit-image/UIPinstripe.png); } -.dialog > .panel { - background: #c8c8c8 url(pinstripes.png); - padding: 1px 0 1px 0; +dialog { + display: block; + position: absolute; + width: 100%; } -p { - margin: 0px; - padding: 0px; +dialog > panel { + display: block; } a { - text-decoration: none; + color: blue; text-underline-style: dotted; } @@ -66,15 +117,31 @@ strong { font-weight: bold } +pre, tt { + font-family: monospace; +} + +pre { + letter-spacing: -2px; +} + +em { + font-style: italic; +} + +.default { + color: #aaaabb; +} + /* #toolbar {{{ */ -.dialog > .toolbar { +dialog > toolbar { background: url(toolbar.png) #6d84a2 repeat-x; border-bottom: 1px solid #2d3642; height: 45px; padding: 10px; } -.dialog > .toolbar > h1 { +dialog > toolbar > h1 { color: #ffffff; font-size: 20px; font-weight: bold; @@ -86,8 +153,8 @@ strong { } /* }}} */ /* (back|forward)-button {{{ */ -.dialog > .toolbar > a.back-button, -.dialog > .toolbar > a.forward-button { +dialog > toolbar > a.back-button, +dialog > toolbar > a.forward-button { color: #ffffff; font-size: 12px; font-weight: bold; @@ -100,31 +167,81 @@ strong { white-space: nowrap; } -.dialog > .toolbar > a.back-button { +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 { +dialog > toolbar > a.forward-button { -webkit-border-image: url(toolButton.png) 0 5 0 5; border-width: 0 5px; float: right; } /* }}} */ -/* fieldset {{{ */ -.dialog > .panel > fieldset { - background: #ffffff; + +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; + -webkit-border-radius: 9px; + //border: 1px solid #999999; + display: block; + font-size: 16px; + margin: 9px 10px; + padding: 0 10px; +} + +panel > fieldset > div > hr, +panel > block > hr { + border-top: 1px dashed #999999; +} + +panel > fieldset { + background-color: #ffffff; border: 1px solid #999999; - -webkit-border-radius: 10px; + -webkit-border-radius: 9px; font-size: 16px; margin: 9px; - padding: 0; } -.dialog > .panel > label { +panel > input[type="submit"] { + /*-webkit-border-image: url(whiteButton.png) 0 12 0 12; + -webkit-border-radius: 0; + border-width: 0px 12px;*/ + border: none; + color: #000000; display: block; - margin: 13px 0 -4px 27px; + 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; @@ -132,84 +249,556 @@ strong { text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0; } -.dialog > .panel > fieldset > a, -.dialog > .panel > fieldset > div { - border-top: 1px solid #999999; - min-height: 19px; - padding: 11px 17px; +panel > fieldset > a, +panel > fieldset > div, +panel > fieldset > textarea { + border-bottom: 1px solid #999999; +} + +panel > fieldset > a.left:nth-last-child(2), +panel > fieldset > a:last-child, +panel > fieldset > div:last-child, +panel > fieldset > textarea:last-child { + border-bottom: 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; } -.dialog > .panel > fieldset > a:first-child, -.dialog > .panel > fieldset > div:first-child { - border-top: none; +panel > fieldset > a[type="ad"]:first-child > div:first-of-type, +panel > fieldset > a[type="comment"]:first-child > div:first-of-type, +panel > fieldset > a[type="profile"]:first-child > div:first-of-type, +panel > fieldset > a[type="thumb"]:first-child > div:first-of-type { + -webkit-border-top-left-radius: 9px; } -.dialog > .panel > fieldset > a img.icon, -.dialog > .panel > fieldset > div img.icon { +panel > fieldset > a[type="ad"]:last-child > div:first-of-type, +panel > fieldset > a[type="comment"]:last-child > div:first-of-type, +panel > fieldset > a[type="profile"]:last-child > div:first-of-type, +panel > fieldset > a[type="thumb"]:last-child > div:first-of-type { + -webkit-border-bottom-left-radius: 9px; +} + +fieldset > a[type="ad"] > div:first-of-type { + border: 1px solid #999999; +} + +list > fieldset > a[type="comment"] > div:first-of-type, +list > fieldset > a[type="profile"] > div:first-of-type, +list > fieldset > a[type="thumb"] > div:first-of-type { + border: 1px solid #e0e0e0; +} + +panel > fieldset > a[type="comment"] > div:first-of-type { + border: 1px solid #999999; + border-bottom-style: dashed; +} + +panel > fieldset > a[type="profile"] > div:first-of-type, +panel > fieldset:not(.header) > a[type="thumb"] > div:first-of-type { + 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-of-type { + 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-of-type { + -webkit-background-size: 44px; + height: 44px; + width: 44px; +} + +fieldset > a[type="header"] > div:first-of-type { + height: 64px; + width: 64px; +} + +fieldset > a[type="profile"] > div:first-of-type { + -webkit-background-size: 50px; + height: 50px; + width: 50px; +} + +fieldset > a[type="thumb"] > div:first-of-type { + height: 64px; + width: 64px; +} + +fieldset > a[type="comment"] > div:first-of-type, +fieldset > a[type="header"] > div:first-of-type, +fieldset > a[type="profile"] > div:first-of-type, +fieldset > a[type="thumb"] > div:first-of-type { + 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; - margin: -13px 5px -10px -10px; + /* XXX: small differences due to font bugs */ + margin: -7px 6px -9px -8px; max-height: 30px; min-width: 30px; - vertical-align: middle; width: 30px; } -.dialog > .panel > fieldset > div > p { - margin-top: .5em; +panel > block > p, +fieldset > div > p, +panel > block > ul, +fieldset > div > ul { + margin: 11px 0; +} + +panel > block > ul, +fieldset > div > ul { + margin-left: 13px; +} + +panel > block > p, +fieldset > div > p { text-align: center; } -.dialog > .panel > fieldset > div > p:first-child { +fieldset > div > p:first-child, +fieldset > div > ul:first-child { margin-top: 0; } -.dialog > .panel > fieldset > a { - background: 275px 11px no-repeat url(listArrow.png); +fieldset > div > p:last-child, +fieldset > div > ul:last-child { + margin-bottom: 0; +} + +fieldset > a { color: inherit; display: block; } -.dialog > .panel > fieldset > div > select { - font-size: 16px; - margin: -4px -10px -5px 86px; - width: 190px; +fieldset > textarea, +fieldset > div > input, +fieldset > div > select { + background: none; + -webkit-box-shadow: none; + -webkit-appearance: none; } -.dialog > .panel > fieldset > div > input { - background: none; - border: none; +/* Chevrons {{{ */ + +fieldset > a[href]:not([type="ad"]), +fieldset > div > select { + background-repeat: no-repeat; + background-image: url(chevron.png); + background-position-y: center; +} + +/* Horizontal */ + +list > fieldset > a[href] { + background-position-x: 295px; +} + +panel > fieldset > a[href] { + background-position-x: 275px; +} + +panel > fieldset > a[href].half { + background-position-x: 125px; +} + +list > fieldset > a:not([href]) > select, +list > fieldset > div > select { + background-position-x: 183px; +} + +panel > fieldset > a:not([href]) > select, +panel > fieldset > div > select { + background-position-x: 163px; +} + +/* }}} */ + +fieldset > textarea, +fieldset > div > input, +fieldset > div > select, +fieldset > a > div > label:nth-of-type(2), +fieldset > div > div > label:nth-of-type(2) { color: #193250; +} + +fieldset > textarea, +fieldset > div > input, +fieldset > div > select { font-size: 16px; - height: 45px; - margin: -12px -18px; - padding: 12px 10px 0 111px; - width: 302px; } -.dialog > .panel > fieldset > div > input[type="submit"] { - border-width: 0 12px; - color: #000000; +fieldset > div > input { + padding-left: 7px; + padding-right: 14px; +} + +fieldset > div > select, +fieldset > div > input { + border: none; + float: right; + height: 40px; + margin: -11px -13px -11px -14px; +} + +panel > fieldset > div > select, +panel > fieldset > div > input { + width: 187px; +} + +list > fieldset > div > select, +list > fieldset > div > input { + 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-of-type(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-of-type(2) > label:nth-of-type(1).unknown { + color: #aaaabb; +} + +fieldset > a[type="profile"] > div:nth-of-type(2) > label:only-of-type { + left: 4px; + position: relative; + top: 3px; +} + +fieldset > a[type="thumb"] > div:nth-of-type(2) > label:only-of-type { + position: relative; + top: 10px; +} + +fieldset > a[type="profile"] > div:nth-of-type(2) > label:nth-of-type(2) { display: block; - font-size: 20px; + font-size: 13px; + margin-top: 2px; +} + +fieldset > a[type="thumb"] > div:nth-of-type(2) > label:nth-of-type(2) { + display: block; + margin-top: 2px; +} + +fieldset > a[type="profile"] > div:nth-of-type(2) { + width: 207px; +} + +fieldset > a[type="thumb"] > div:nth-of-type(2) { + width: 193px; +} + +fieldset > a[type="profile"] > div:nth-of-type(2) { + margin: -5px 0; +} + +fieldset > a[type="profile"] > div:nth-of-type(2), +fieldset > a[type="thumb"] > div:nth-of-type(2) { + vertical-align: top; +} + +fieldset > a > label:first-of-type, +fieldset > a > div > label:first-of-type, +fieldset > div > label:first-of-type, +fieldset > div > div > label:first-of-type { font-weight: bold; - padding: 10px; - text-align: center; - -webkit-border-image: url(whiteButton.png) 0 12 0 12; } -.dialog > .panel > fieldset > a > label, -.dialog > .panel > fieldset > div > label { +/* XXX: this doesn't handle icon offsets */ +list > fieldset > a:not([type]) > div > label:nth-of-type(2), +list > fieldset > div > div > label:nth-of-type(2) { + margin-left: 94px; +} + +panel > fieldset > a:not([type]) > div > label:nth-of-type(2), +panel > fieldset > div > div > label:nth-of-type(2) { + 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-of-type(2) { + position: relative; + vertical-align: top; +} + +fieldset > a[type="ad"] > div > label:nth-of-type(1) { + color: #2d2d50; + font-size: 13px; font-weight: bold; + line-height: 15px; +} + +fieldset > a[type="ad"] > div > label:nth-of-type(2) { position: absolute; + top: 17px; + left: 156px; + font-size: 9.5px; + font-weight: normal; } -.dialog > .panel > fieldset > a > label + div { - margin-right: 16px; +panel > fieldset > a.right { + border-left: 1px solid #999999; } -.dialog > .panel > fieldset > a > label + div, -.dialog > .panel > fieldset > div > label + div { - color: #335588; - text-align: right; +panel > fieldset > a.half { + display: inline-block; + width: 150px; +} + +fieldset.half > a { + background: none; + background-position-x: 120px; +} + +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 { + -webkit-border-top-right-radius: 9px; +} + +fieldset > a[type="thumb"]:last-child > back { + -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; + -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; +} + +panel.centered > label { + margin-left: 0px; + margin-right: 0px; + text-align: center; +} + +panel > iframe { + margin: -9px 0; +} + +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 0 -11px 0; +} + +panel > fieldset.header > a > div > label { + color: #4d4d70; + text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0; +}