Cydia.app/menes/style.css

   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
  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 {
  49     display: block;
  50 }
  51 /* }}} */
  52
  53 * {
  54     border: 0;
  55     -webkit-border-radius: 0;
  56     box-sizing: border-box;
  57     -moz-box-sizing: border-box;
  58     -ms-box-sizing: border-box;
  59     -webkit-box-sizing: border-box;
  60     font-family: inherit;
  61     font-size: 100%;
  62     font-style: inherit;
  63     font-weight: inherit;
  64     margin: 0;
  65     outline: 0;
  66     padding: 0;
  67     text-decoration: none;
  68     vertical-align: baseline;
  69 }
  70
  71 a {
  72     color: inherit;
  73 }
  74
  75 sup {
  76     font-size: smaller;
  77     margin-top: -6px;
  78     position: relative;
  79     top: -6px;
  80 }
  81
  82 select {
  83     border: 1px solid #999999;
  84 }
  85
  86 body {
  87     width: 320px;
  88     font-family: Helvetica;
  89     -webkit-text-size-adjust: none;
  90     -webkit-user-select: none;
  91 }
  92
  93 body.white {
  94     background-color: #ffffff;
  95 }
  96
  97 body.pinstripe {
  98     background: #c7ced5 url(cydia://uikit-image/UIPinstripe.png);
  99 }
 100
 101 dialog {
 102     display: block;
 103     position: absolute;
 104     width: 100%;
 105 }
 106
 107 dialog > panel {
 108     display: block;
 109 }
 110
 111 a {
 112     color: blue;
 113     text-underline-style: dotted;
 114 }
 115
 116 strong {
 117     font-weight: bold
 118 }
 119
 120 pre, tt {
 121     font-family: monospace;
 122 }
 123
 124 pre {
 125     letter-spacing: -2px;
 126 }
 127
 128 em {
 129     font-style: italic;
 130 }
 131
 132 .default {
 133     color: #aaaabb;
 134 }
 135
 136 /* #toolbar {{{ */
 137 dialog > toolbar {
 138     background: url(toolbar.png) #6d84a2 repeat-x;
 139     border-bottom: 1px solid #2d3642;
 140     height: 45px;
 141     padding: 10px;
 142 }
 143
 144 dialog > toolbar > h1 {
 145     color: #ffffff;
 146     font-size: 20px;
 147     font-weight: bold;
 148     height: 100%;
 149     margin: 1px auto 0 auto;
 150     text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0;
 151     text-align: center;
 152     white-space: nowrap;
 153 }
 154 /* }}} */
 155 /* (back|forward)-button {{{ */
 156 dialog > toolbar > a.back-button,
 157 dialog > toolbar > a.forward-button {
 158     color: #ffffff;
 159     font-size: 12px;
 160     font-weight: bold;
 161     height: 30px;
 162     line-height: 30px;
 163     margin-top: -28px;
 164     padding: 0 3px;
 165     text-decoration: none;
 166     text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
 167     white-space: nowrap;
 168 }
 169
 170 dialog > toolbar > a.back-button {
 171     -webkit-border-image: url(backButton.png) 0 8 0 14;
 172     border-width: 0 8px 0 14px;
 173     float: left;
 174 }
 175
 176 dialog > toolbar > a.forward-button {
 177     -webkit-border-image: url(toolButton.png) 0 5 0 5;
 178     border-width: 0 5px;
 179     float: right;
 180 }
 181 /* }}} */
 182
 183 panel > block {
 184     /*background-color: #ccd1d5;*/
 185     /*background-color: white;*/
 186     /*background-color: #c7ced5;*/
 187     background-color: transparent;
 188     //background-color: #ffffff;
 189     border-bottom: 1px solid #999999;
 190     border-top: 1px solid #999999;
 191     border-left: 1px dotted #999999;
 192     border-right: 1px dotted #999999;
 193     -webkit-border-radius: 9px;
 194     //border: 1px solid #999999;
 195     display: block;
 196     font-size: 16px;
 197     margin: 9px 10px;
 198     padding: 0 10px;
 199 }
 200
 201 panel > fieldset > div > hr,
 202 panel > block > hr {
 203     border-top: 1px dashed #999999;
 204 }
 205
 206 panel > fieldset {
 207     background-color: #ffffff;
 208     border: 1px solid #999999;
 209     -webkit-border-radius: 9px;
 210     font-size: 16px;
 211     margin: 9px;
 212 }
 213
 214 panel > input[type="submit"] {
 215     /*-webkit-border-image: url(whiteButton.png) 0 12 0 12;
 216     -webkit-border-radius: 0;
 217     border-width: 0px 12px;*/
 218     border: none;
 219     color: #000000;
 220     display: block;
 221     font-size: 20px;
 222     font-weight: bold;
 223     margin: 9px;
 224     height: 44px;
 225     padding: 10px;
 226     text-align: center;
 227     width: 302px;
 228 }
 229
 230 list > label {
 231     background: #a7b3bc url(cydia://uikit-image/UISectionListHeaderBackground.png);
 232     background-repeat: repeat-x no-repeat-y;
 233     margin-bottom: 0px;
 234     padding: 4px 15px 1px 15px;
 235     display: block;
 236     color: white;
 237     font-size: inherit;
 238     font-weight: bold;
 239     text-shadow: rgba(0, 0, 0, 0.5) 0px 1px 0;
 240 }
 241
 242 panel > label {
 243     display: block;
 244     margin: 13px 0 -4px 24px;
 245     line-height: 24px;
 246     font-size: inherit;
 247     font-weight: bold;
 248     color: #4d4d70;
 249     text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0;
 250 }
 251
 252 panel > fieldset > a,
 253 panel > fieldset > div,
 254 panel > fieldset > textarea {
 255     border-bottom: 1px solid #999999;
 256 }
 257
 258 panel > fieldset > a.left:nth-last-child(2),
 259 panel > fieldset > a:last-child,
 260 panel > fieldset > div:last-child,
 261 panel > fieldset > textarea:last-child {
 262     border-bottom: 0;
 263 }
 264
 265 list > fieldset > a,
 266 list > fieldset > div,
 267 list > fieldset > textarea {
 268     border-bottom: 1px solid #e0e0e0;
 269 }
 270
 271 fieldset > a:not([type="ad"]),
 272 fieldset > div,
 273 fieldset > textarea {
 274     /* XXX: small differences due to font bugs */
 275     padding: 12px 14px 10px 14px;
 276 }
 277
 278 /*fieldset > a:not([type="ad"]):last-child,
 279 fieldset > div:last-child {
 280     padding-bottom: 10px;
 281 }*/
 282
 283 fieldset > a[type="ad"] {
 284     /* XXX: small differences due to font bugs */
 285     padding: 4px 4px 2px 5px;
 286 }
 287
 288 panel > fieldset > a[type="ad"]:first-child > div:first-of-type,
 289 panel > fieldset > a[type="comment"]:first-child > div:first-of-type,
 290 panel > fieldset > a[type="profile"]:first-child > div:first-of-type,
 291 panel > fieldset > a[type="thumb"]:first-child > div:first-of-type {
 292     -webkit-border-top-left-radius: 9px;
 293 }
 294
 295 panel > fieldset > a[type="ad"]:last-child > div:first-of-type,
 296 panel > fieldset > a[type="comment"]:last-child > div:first-of-type,
 297 panel > fieldset > a[type="profile"]:last-child > div:first-of-type,
 298 panel > fieldset > a[type="thumb"]:last-child > div:first-of-type {
 299     -webkit-border-bottom-left-radius: 9px;
 300 }
 301
 302 fieldset > a[type="ad"] > div:first-of-type {
 303     border: 1px solid #999999;
 304 }
 305
 306 list > fieldset > a[type="comment"] > div:first-of-type,
 307 list > fieldset > a[type="profile"] > div:first-of-type,
 308 list > fieldset > a[type="thumb"] > div:first-of-type {
 309     border: 1px solid #e0e0e0;
 310 }
 311
 312 panel > fieldset > a[type="comment"] > div:first-of-type {
 313     border: 1px solid #999999;
 314     border-bottom-style: dashed;
 315 }
 316
 317 panel > fieldset > a[type="profile"] > div:first-of-type,
 318 panel > fieldset:not(.header) > a[type="thumb"] > div:first-of-type {
 319     border: 1px solid #999999;
 320 }
 321
 322 div[tile] {
 323     float: right;
 324     height: 30px;
 325     width: 30px;
 326 }
 327
 328 div[tile="app"]   { background-image: url(http://cache.saurik.com/cydia/tile/app.png);   }
 329 div[tile="call"]  { background-image: url(http://cache.saurik.com/cydia/tile/call.png);  }
 330 div[tile="map"]   { background-image: url(http://cache.saurik.com/cydia/tile/map.png);   }
 331 div[tile="media"] { background-image: url(http://cache.saurik.com/cydia/tile/media.png); }
 332 div[tile="music"] { background-image: url(http://cache.saurik.com/cydia/tile/video.png); }
 333 div[tile="site"]  { background-image: url(http://cache.saurik.com/cydia/tile/site.png);  }
 334
 335 fieldset > a[type="ad"] > div:first-of-type {
 336     background-repeat: no-repeat;
 337     background-position: center center;
 338     border-right: none;
 339     display: inline-block;
 340     height: 40px;
 341     line-height: 38px;
 342     /* XXX: small differences due to font bugs */
 343     /* XXX: 1px difference due to border stupidity */
 344     margin: -5px 5px -3px -6px;
 345     width: 40px;
 346 }
 347
 348 panel > fieldset > a[type="comment"] {
 349     border-bottom-style: dashed;
 350 }
 351
 352 fieldset > a[type="comment"] > div:first-of-type {
 353     -webkit-background-size: 44px;
 354     height: 44px;
 355     width: 44px;
 356 }
 357
 358 fieldset > a[type="header"] > div:first-of-type {
 359     height: 64px;
 360     width: 64px;
 361 }
 362
 363 fieldset > a[type="profile"] > div:first-of-type {
 364     -webkit-background-size: 50px;
 365     height: 50px;
 366     width: 50px;
 367 }
 368
 369 fieldset > a[type="thumb"] > div:first-of-type  {
 370     height: 64px;
 371     width: 64px;
 372 }
 373
 374 fieldset > a[type="comment"] > div:first-of-type,
 375 fieldset > a[type="header"] > div:first-of-type,
 376 fieldset > a[type="profile"] > div:first-of-type,
 377 fieldset > a[type="thumb"] > div:first-of-type {
 378     background-repeat: no-repeat;
 379     background-position: center center;
 380     display: inline-block;
 381     /* XXX: small differences due to font bugs */
 382     /* XXX: 1px difference due to border stupidity */
 383     margin: -13px 7px -11px -15px;
 384 }
 385
 386 fieldset > a > img.icon,
 387 fieldset > div > img.icon {
 388     height: auto;
 389     /* XXX: small differences due to font bugs */
 390     margin: -7px 6px -9px -8px;
 391     max-height: 30px;
 392     min-width: 30px;
 393     width: 30px;
 394 }
 395
 396 panel > block > p,
 397 fieldset > div > p,
 398 panel > block > ul,
 399 fieldset > div > ul {
 400     margin: 11px 0;
 401 }
 402
 403 panel > block > ul,
 404 fieldset > div > ul {
 405     margin-left: 13px;
 406 }
 407
 408 panel > block > p,
 409 fieldset > div > p {
 410     text-align: center;
 411 }
 412
 413 fieldset > div > p:first-child,
 414 fieldset > div > ul:first-child {
 415     margin-top: 0;
 416 }
 417
 418 fieldset > div > p:last-child,
 419 fieldset > div > ul:last-child {
 420     margin-bottom: 0;
 421 }
 422
 423 fieldset > a {
 424     color: inherit;
 425     display: block;
 426 }
 427
 428 fieldset > textarea,
 429 fieldset > div > input,
 430 fieldset > div > select {
 431     background: none;
 432     -webkit-box-shadow: none;
 433     -webkit-appearance: none;
 434 }
 435
 436 /* Chevrons {{{ */
 437
 438 fieldset > a[href]:not([type="ad"]),
 439 fieldset > div > select {
 440     background-repeat: no-repeat;
 441     background-image: url(chevron.png);
 442     background-position-y: center;
 443 }
 444
 445 /* Horizontal */
 446
 447 list > fieldset > a[href] {
 448     background-position-x: 295px;
 449 }
 450
 451 panel > fieldset > a[href] {
 452     background-position-x: 275px;
 453 }
 454
 455 panel > fieldset > a[href].half {
 456     background-position-x: 125px;
 457 }
 458
 459 list > fieldset > a:not([href]) > select,
 460 list > fieldset > div > select {
 461     background-position-x: 183px;
 462 }
 463
 464 panel > fieldset > a:not([href]) > select,
 465 panel > fieldset > div > select {
 466     background-position-x: 163px;
 467 }
 468
 469 /* }}} */
 470
 471 fieldset > textarea,
 472 fieldset > div > input,
 473 fieldset > div > select,
 474 fieldset > a > div > label:nth-of-type(2),
 475 fieldset > div > div > label:nth-of-type(2) {
 476     color: #193250;
 477 }
 478
 479 fieldset > textarea,
 480 fieldset > div > input,
 481 fieldset > div > select {
 482     font-size: 16px;
 483 }
 484
 485 fieldset > div > input {
 486     padding-left: 7px;
 487     padding-right: 14px;
 488 }
 489
 490 fieldset > div > select,
 491 fieldset > div > input {
 492     border: none;
 493     float: right;
 494     height: 40px;
 495     margin: -11px -13px -11px -14px;
 496 }
 497
 498 panel > fieldset > div > select,
 499 panel > fieldset > div > input {
 500     width: 187px;
 501 }
 502
 503 list > fieldset > div > select,
 504 list > fieldset > div > input {
 505     width: 207px;
 506 }
 507
 508 fieldset > textarea {
 509     padding: 10px;
 510     width: 320px;
 511 }
 512
 513 fieldset > div > div,
 514 fieldset > a > div {
 515     display: inline-block;
 516 }
 517
 518 fieldset > div > div {
 519     width: 273px;
 520 }
 521
 522 fieldset > a[type="ad"] > div:nth-of-type(2) {
 523     width: 218px;
 524 }
 525
 526 fieldset > a:not([type]) > div {
 527     width: 250px;
 528 }
 529
 530 fieldset > a:not([href]) > img.icon + div,
 531 fieldset > div > img.icon + div {
 532     width: 244px;
 533 }
 534
 535 fieldset > a[href] > img.icon + div {
 536     width: 221px;
 537 }
 538
 539 fieldset > a[type="profile"] > div:nth-of-type(2) > label:nth-of-type(1).unknown {
 540     color: #aaaabb;
 541 }
 542
 543 fieldset > a[type="profile"] > div:nth-of-type(2) > label:only-of-type {
 544     left: 4px;
 545     position: relative;
 546     top: 3px;
 547 }
 548
 549 fieldset > a[type="thumb"] > div:nth-of-type(2) > label:only-of-type {
 550     position: relative;
 551     top: 10px;
 552 }
 553
 554 fieldset > a[type="profile"] > div:nth-of-type(2) > label:nth-of-type(2) {
 555     display: block;
 556     font-size: 13px;
 557     margin-top: 2px;
 558 }
 559
 560 fieldset > a[type="thumb"] > div:nth-of-type(2) > label:nth-of-type(2) {
 561     display: block;
 562     margin-top: 2px;
 563 }
 564
 565 fieldset > a[type="profile"] > div:nth-of-type(2) {
 566     width: 207px;
 567 }
 568
 569 fieldset > a[type="thumb"] > div:nth-of-type(2) {
 570     width: 193px;
 571 }
 572
 573 fieldset > a[type="profile"] > div:nth-of-type(2) {
 574     margin: -5px 0;
 575 }
 576
 577 fieldset > a[type="profile"] > div:nth-of-type(2),
 578 fieldset > a[type="thumb"] > div:nth-of-type(2) {
 579     vertical-align: top;
 580 }
 581
 582 fieldset > a > label:first-of-type,
 583 fieldset > a > div > label:first-of-type,
 584 fieldset > div > label:first-of-type,
 585 fieldset > div > div > label:first-of-type {
 586     font-weight: bold;
 587 }
 588
 589 /* XXX: this doesn't handle icon offsets */
 590 list > fieldset > a:not([type]) > div > label:nth-of-type(2),
 591 list > fieldset > div > div > label:nth-of-type(2) {
 592     margin-left: 94px;
 593 }
 594
 595 panel > fieldset > a:not([type]) > div > label:nth-of-type(2),
 596 panel > fieldset > div > div > label:nth-of-type(2) {
 597     float: right;
 598     text-align: right;
 599 }
 600
 601 panel > img {
 602     display: block;
 603     margin: 9px auto 4px auto;
 604     height: auto;
 605     width: 300px;
 606 }
 607
 608 fieldset > a[type="ad"] {
 609 }
 610
 611 fieldset > a[type="ad"] > div:nth-of-type(2) {
 612     position: relative;
 613     vertical-align: top;
 614 }
 615
 616 fieldset > a[type="ad"] > div > label:nth-of-type(1) {
 617     color: #2d2d50;
 618     font-size: 13px;
 619     font-weight: bold;
 620     line-height: 15px;
 621 }
 622
 623 fieldset > a[type="ad"] > div > label:nth-of-type(2) {
 624     position: absolute;
 625     top: 17px;
 626     left: 156px;
 627     font-size: 9.5px;
 628     font-weight: normal;
 629 }
 630
 631 panel > fieldset > a.right {
 632     border-left: 1px solid #999999;
 633 }
 634
 635 panel > fieldset > a.half {
 636     display: inline-block;
 637     width: 150px;
 638 }
 639
 640 fieldset.half > a {
 641     background: none;
 642     background-position-x: 120px;
 643 }
 644
 645 fieldset.half > a > img.icon + div {
 646     width: 65px;
 647 }
 648
 649 fieldset.right {
 650     float: right;
 651     margin-left: 10px;
 652 }
 653
 654 block + fieldset.right,
 655 fieldset + fieldset.right {
 656     margin-top: 0;
 657 }
 658
 659 fieldset.half {
 660     width: 146px;
 661 }
 662
 663 panel > fieldset.dashed > a,
 664 panel > fieldset.dashed > div,
 665 panel > fieldset.dashed > textarea,
 666 list > fieldset.dashed > a,
 667 list > fieldset.dashed > div,
 668 list > fieldset.dashed > textarea {
 669     border-style: dashed;
 670 }
 671
 672 fieldset > a[type="thumb"]:first-child > back {
 673     -webkit-border-top-right-radius: 9px;
 674 }
 675
 676 fieldset > a[type="thumb"]:last-child > back {
 677     -webkit-border-bottom-right-radius: 9px;
 678 }
 679
 680 fieldset > a[type="thumb"] > back {
 681     background-repeat: no-repeat;
 682     border: 1px solid #999999;
 683     display: block;
 684     height: 64px;
 685     left: 62px;
 686     position: absolute;
 687     opacity: 0.2;
 688     top: -1px;
 689     width: 237px;
 690 }
 691
 692 .mm {
 693     border: 1px solid #999999;
 694     -webkit-border-radius: 9px;
 695 }
 696
 697 a.mm {
 698     display: block;
 699     margin: 9px;
 700 }
 701
 702 div.mm img {
 703     height: auto;
 704     width: 300px;
 705 }
 706
 707 fieldset > a.small {
 708     font-size: 12px;
 709     padding-top: 9px;
 710 }
 711
 712 fieldset > a.small label {
 713     display: inline-block;
 714     position: relative;
 715     top: 1px;
 716 }
 717
 718 fieldset > a.small > img.icon {
 719     max-height: 22px;
 720     min-width: 22px;
 721     width: 22px;
 722 }
 723
 724 fieldset > a.small.half > img.icon + div {
 725     width: 79px;
 726 }
 727
 728 panel.centered > label {
 729     margin-left: 0px;
 730     margin-right: 0px;
 731     text-align: center;
 732 }
 733
 734 panel > iframe {
 735     margin: -9px 0;
 736 }
 737
 738 panel > iframe + iframe {
 739     margin-top: 0;
 740 }
 741
 742 /* Rating Stars {{{ */
 743 .ratings {
 744     margin: -2px 0;
 745     text-align: center;
 746 }
 747
 748 .rated {
 749     display: inline-block;
 750 }
 751
 752 .rated.left {
 753     margin-right: 9px;
 754 }
 755
 756 .rated label {
 757     font-weight: bold;
 758     margin-right: 3px;
 759     position: relative;
 760     top: -3px;
 761 }
 762
 763 .rating {
 764     display: inline-block;
 765     width: 80px;
 766 }
 767
 768 .rating .back,
 769 .rating .fore,
 770 .rating .star {
 771     background: url(http://cache.saurik.com/crystal/16x16/actions/knewstuff.png);
 772     height: 16px;
 773 }
 774
 775 .rating .back,
 776 .rating .fore {
 777     width: 80px;
 778 }
 779
 780 .rating .star {
 781     display: inline-block;
 782     width: 16px;
 783 }
 784
 785 .rating .back {
 786     opacity: 0.2;
 787 }
 788
 789 .rating .fore {
 790     /*border-right: 1px solid #999999;*/
 791     position: absolute;
 792 }
 793 /* }}} */
 794
 795 panel > fieldset.header {
 796     background-color: transparent;
 797     border: none;
 798     margin: -5px 0 -11px 0;
 799 }
 800
 801 panel > fieldset.header > a > div > label {
 802     color: #4d4d70;
 803     text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0;
 804 }