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-top: 1px solid #999999;
 256 }
 257
 258 .deleted {
 259     display: none;
 260 }
 261
 262 panel > fieldset > a.right:nth-child(2),
 263 panel > fieldset > a:first-child,
 264 panel > fieldset > div:first-child,
 265 panel > fieldset > textarea:first-child {
 266     border-top: 0;
 267 }
 268
 269 list > fieldset > a,
 270 list > fieldset > div,
 271 list > fieldset > textarea {
 272     border-bottom: 1px solid #e0e0e0;
 273 }
 274
 275 fieldset > a:not([type="ad"]),
 276 fieldset > div,
 277 fieldset > textarea {
 278     /* XXX: small differences due to font bugs */
 279     padding: 12px 14px 10px 14px;
 280 }
 281
 282 /*fieldset > a:not([type="ad"]):last-child,
 283 fieldset > div:last-child {
 284     padding-bottom: 10px;
 285 }*/
 286
 287 fieldset > a[type="ad"] {
 288     /* XXX: small differences due to font bugs */
 289     padding: 4px 4px 2px 5px;
 290 }
 291
 292 panel > fieldset > a[type="ad"]:first-child > div:first-of-type,
 293 panel > fieldset > a[type="comment"]:first-child > div:first-of-type,
 294 panel > fieldset > a[type="profile"]:first-child > div:first-of-type,
 295 panel > fieldset > a[type="thumb"]:first-child > div:first-of-type {
 296     -webkit-border-top-left-radius: 9px;
 297 }
 298
 299 panel > fieldset > a[type="ad"]:last-child > div:first-of-type,
 300 panel > fieldset > a[type="comment"]:last-child > div:first-of-type,
 301 panel > fieldset > a[type="profile"]:last-child > div:first-of-type,
 302 panel > fieldset > a[type="thumb"]:last-child > div:first-of-type {
 303     -webkit-border-bottom-left-radius: 9px;
 304 }
 305
 306 fieldset > a[type="ad"] > div:first-of-type {
 307     border: 1px solid #999999;
 308 }
 309
 310 list > fieldset > a[type="comment"] > div:first-of-type,
 311 list > fieldset > a[type="profile"] > div:first-of-type,
 312 list > fieldset > a[type="thumb"] > div:first-of-type {
 313     border: 1px solid #e0e0e0;
 314 }
 315
 316 panel > fieldset > a[type="comment"] > div:first-of-type {
 317     border: 1px solid #999999;
 318     border-bottom-style: dashed;
 319 }
 320
 321 panel > fieldset > a[type="profile"] > div:first-of-type,
 322 panel > fieldset:not(.header) > a[type="thumb"] > div:first-of-type {
 323     border: 1px solid #999999;
 324 }
 325
 326 div[tile] {
 327     float: right;
 328     height: 30px;
 329     width: 30px;
 330 }
 331
 332 div[tile="app"]   { background-image: url(http://cache.saurik.com/cydia/tile/app.png);   }
 333 div[tile="call"]  { background-image: url(http://cache.saurik.com/cydia/tile/call.png);  }
 334 div[tile="map"]   { background-image: url(http://cache.saurik.com/cydia/tile/map.png);   }
 335 div[tile="media"] { background-image: url(http://cache.saurik.com/cydia/tile/media.png); }
 336 div[tile="music"] { background-image: url(http://cache.saurik.com/cydia/tile/video.png); }
 337 div[tile="site"]  { background-image: url(http://cache.saurik.com/cydia/tile/site.png);  }
 338
 339 fieldset > a[type="ad"] > div:first-of-type {
 340     background-repeat: no-repeat;
 341     background-position: center center;
 342     border-right: none;
 343     display: inline-block;
 344     height: 40px;
 345     line-height: 38px;
 346     /* XXX: small differences due to font bugs */
 347     /* XXX: 1px difference due to border stupidity */
 348     margin: -5px 5px -3px -6px;
 349     width: 40px;
 350 }
 351
 352 panel > fieldset > a[type="comment"] {
 353     border-bottom-style: dashed;
 354 }
 355
 356 fieldset > a[type="comment"] > div:first-of-type {
 357     -webkit-background-size: 44px;
 358     height: 44px;
 359     width: 44px;
 360 }
 361
 362 fieldset > a[type="header"] > div:first-of-type {
 363     height: 64px;
 364     width: 64px;
 365 }
 366
 367 fieldset > a[type="profile"] > div:first-of-type {
 368     -webkit-background-size: 50px;
 369     height: 50px;
 370     width: 50px;
 371 }
 372
 373 fieldset > a[type="thumb"] > div:first-of-type  {
 374     height: 64px;
 375     width: 64px;
 376 }
 377
 378 fieldset > a[type="comment"] > div:first-of-type,
 379 fieldset > a[type="header"] > div:first-of-type,
 380 fieldset > a[type="profile"] > div:first-of-type,
 381 fieldset > a[type="thumb"] > div:first-of-type {
 382     background-repeat: no-repeat;
 383     background-position: center center;
 384     display: inline-block;
 385     /* XXX: small differences due to font bugs */
 386     /* XXX: 1px difference due to border stupidity */
 387     margin: -13px 7px -11px -15px;
 388 }
 389
 390 fieldset > a > img.icon,
 391 fieldset > div > img.icon {
 392     height: auto;
 393     /* XXX: small differences due to font bugs */
 394     margin: -7px 6px -9px -8px;
 395     max-height: 30px;
 396     min-width: 30px;
 397     width: 30px;
 398 }
 399
 400 panel > block > p,
 401 fieldset > div > p,
 402 panel > block > ul,
 403 fieldset > div > ul {
 404     margin: 11px 0;
 405 }
 406
 407 panel > block > ul,
 408 fieldset > div > ul {
 409     margin-left: 13px;
 410 }
 411
 412 panel > block > p,
 413 fieldset > div > p {
 414     text-align: center;
 415 }
 416
 417 fieldset > div > p:first-child,
 418 fieldset > div > ul:first-child {
 419     margin-top: 0;
 420 }
 421
 422 fieldset > div > p:last-child,
 423 fieldset > div > ul:last-child {
 424     margin-bottom: 0;
 425 }
 426
 427 fieldset > a {
 428     color: inherit;
 429     display: block;
 430 }
 431
 432 fieldset > textarea,
 433 fieldset > div > input,
 434 fieldset > div > select {
 435     background: none;
 436     -webkit-box-shadow: none;
 437     -webkit-appearance: none;
 438 }
 439
 440 /* Chevrons {{{ */
 441
 442 fieldset > a[href]:not([type="ad"]),
 443 fieldset > div > select {
 444     background-repeat: no-repeat;
 445     background-image: url(chevron.png);
 446     background-position-y: center;
 447 }
 448
 449 /* Horizontal */
 450
 451 list > fieldset > a[href] {
 452     background-position-x: 295px;
 453 }
 454
 455 panel > fieldset > a[href] {
 456     background-position-x: 275px;
 457 }
 458
 459 panel > fieldset > a[href].half {
 460     background-position-x: 125px;
 461 }
 462
 463 list > fieldset > a:not([href]) > select,
 464 list > fieldset > div > select {
 465     background-position-x: 183px;
 466 }
 467
 468 panel > fieldset > a:not([href]) > select,
 469 panel > fieldset > div > select {
 470     background-position-x: 163px;
 471 }
 472
 473 /* }}} */
 474
 475 fieldset > textarea,
 476 fieldset > div > input,
 477 fieldset > div > select,
 478 fieldset > a > div > label:nth-of-type(2),
 479 fieldset > div > div > label:nth-of-type(2) {
 480     color: #193250;
 481 }
 482
 483 fieldset > textarea,
 484 fieldset > div > input,
 485 fieldset > div > select {
 486     font-size: 16px;
 487 }
 488
 489 fieldset > div > input {
 490     padding-left: 7px;
 491     padding-right: 14px;
 492 }
 493
 494 fieldset > div > select,
 495 fieldset > div > input {
 496     border: none;
 497     float: right;
 498     height: 40px;
 499     margin: -11px -13px -11px -14px;
 500 }
 501
 502 panel > fieldset > div > select,
 503 panel > fieldset > div > input {
 504     width: 187px;
 505 }
 506
 507 list > fieldset > div > select,
 508 list > fieldset > div > input {
 509     width: 207px;
 510 }
 511
 512 fieldset > textarea {
 513     padding: 10px;
 514     width: 320px;
 515 }
 516
 517 fieldset > div > div,
 518 fieldset > a > div {
 519     display: inline-block;
 520 }
 521
 522 fieldset > div > div {
 523     width: 273px;
 524 }
 525
 526 fieldset > a[type="ad"] > div:nth-of-type(2) {
 527     width: 218px;
 528 }
 529
 530 fieldset > a:not([type]) > div {
 531     width: 250px;
 532 }
 533
 534 fieldset > a:not([href]) > img.icon + div,
 535 fieldset > div > img.icon + div {
 536     width: 244px;
 537 }
 538
 539 fieldset > a[href] > img.icon + div {
 540     width: 221px;
 541 }
 542
 543 fieldset > a[type="profile"] > div:nth-of-type(2) > label:nth-of-type(1).unknown {
 544     color: #aaaabb;
 545 }
 546
 547 fieldset > a[type="profile"] > div:nth-of-type(2) > label:only-of-type {
 548     left: 4px;
 549     position: relative;
 550     top: 3px;
 551 }
 552
 553 fieldset > a[type="thumb"] > div:nth-of-type(2) > label:only-of-type {
 554     position: relative;
 555     top: 10px;
 556 }
 557
 558 fieldset > a[type="profile"] > div:nth-of-type(2) > label:nth-of-type(2) {
 559     display: block;
 560     font-size: 13px;
 561     margin-top: 2px;
 562 }
 563
 564 fieldset > a[type="thumb"] > div:nth-of-type(2) > label:nth-of-type(2) {
 565     display: block;
 566     margin-top: 2px;
 567 }
 568
 569 fieldset > a[type="profile"] > div:nth-of-type(2) {
 570     width: 207px;
 571 }
 572
 573 fieldset > a[type="thumb"] > div:nth-of-type(2) {
 574     width: 193px;
 575 }
 576
 577 fieldset > a[type="profile"] > div:nth-of-type(2) {
 578     margin: -5px 0;
 579 }
 580
 581 fieldset > a[type="profile"] > div:nth-of-type(2),
 582 fieldset > a[type="thumb"] > div:nth-of-type(2) {
 583     vertical-align: top;
 584 }
 585
 586 fieldset > a > label:first-of-type,
 587 fieldset > a > div > label:first-of-type,
 588 fieldset > div > label:first-of-type,
 589 fieldset > div > div > label:first-of-type {
 590     font-weight: bold;
 591 }
 592
 593 /* XXX: this doesn't handle icon offsets */
 594 list > fieldset > a:not([type]) > div > label:nth-of-type(2),
 595 list > fieldset > div > div > label:nth-of-type(2) {
 596     margin-left: 94px;
 597 }
 598
 599 panel > fieldset > a:not([type]) > div > label:nth-of-type(2),
 600 panel > fieldset > div > div > label:nth-of-type(2) {
 601     float: right;
 602     text-align: right;
 603 }
 604
 605 panel > img {
 606     display: block;
 607     margin: 9px auto 4px auto;
 608     height: auto;
 609     width: 300px;
 610 }
 611
 612 fieldset > a[type="ad"] {
 613 }
 614
 615 fieldset > a[type="ad"] > div:nth-of-type(2) {
 616     position: relative;
 617     vertical-align: top;
 618 }
 619
 620 fieldset > a[type="ad"] > div > label:nth-of-type(1) {
 621     color: #2d2d50;
 622     font-size: 13px;
 623     font-weight: bold;
 624     line-height: 15px;
 625 }
 626
 627 fieldset > a[type="ad"] > div > label:nth-of-type(2) {
 628     position: absolute;
 629     top: 17px;
 630     left: 156px;
 631     font-size: 9.5px;
 632     font-weight: normal;
 633 }
 634
 635 panel > fieldset > a.right {
 636     border-left: 1px solid #999999;
 637 }
 638
 639 panel > fieldset > a.half {
 640     display: inline-block;
 641     width: 150px;
 642 }
 643
 644 fieldset.half > a {
 645     background: none;
 646     background-position-x: 120px;
 647 }
 648
 649 fieldset.half > a > img.icon + div {
 650     width: 65px;
 651 }
 652
 653 fieldset.right {
 654     float: right;
 655     margin-left: 10px;
 656 }
 657
 658 block + fieldset.right,
 659 fieldset + fieldset.right {
 660     margin-top: 0;
 661 }
 662
 663 fieldset.half {
 664     width: 146px;
 665 }
 666
 667 panel > fieldset.dashed > a,
 668 panel > fieldset.dashed > div,
 669 panel > fieldset.dashed > textarea,
 670 list > fieldset.dashed > a,
 671 list > fieldset.dashed > div,
 672 list > fieldset.dashed > textarea {
 673     border-style: dashed;
 674 }
 675
 676 fieldset > a[type="thumb"]:first-child > back {
 677     -webkit-border-top-right-radius: 9px;
 678 }
 679
 680 fieldset > a[type="thumb"]:last-child > back {
 681     -webkit-border-bottom-right-radius: 9px;
 682 }
 683
 684 fieldset > a[type="thumb"] > back {
 685     background-repeat: no-repeat;
 686     border: 1px solid #999999;
 687     display: block;
 688     height: 64px;
 689     left: 62px;
 690     position: absolute;
 691     opacity: 0.2;
 692     top: -1px;
 693     width: 237px;
 694 }
 695
 696 .mm {
 697     border: 1px solid #999999;
 698     -webkit-border-radius: 9px;
 699 }
 700
 701 a.mm {
 702     display: block;
 703     margin: 9px;
 704 }
 705
 706 div.mm img {
 707     height: auto;
 708     width: 300px;
 709 }
 710
 711 fieldset > a.small {
 712     font-size: 12px;
 713     padding-top: 9px;
 714 }
 715
 716 fieldset > a.small label {
 717     display: inline-block;
 718     position: relative;
 719     top: 1px;
 720 }
 721
 722 fieldset > a.small > img.icon {
 723     max-height: 22px;
 724     min-width: 22px;
 725     width: 22px;
 726 }
 727
 728 fieldset > a.small.half > img.icon + div {
 729     width: 79px;
 730 }
 731
 732 panel.centered > label {
 733     margin-left: 0px;
 734     margin-right: 0px;
 735     text-align: center;
 736 }
 737
 738 panel > iframe {
 739     margin: -9px 0;
 740 }
 741
 742 panel > iframe + iframe {
 743     margin-top: 0;
 744 }
 745
 746 /* Rating Stars {{{ */
 747 .ratings {
 748     margin: -2px 0;
 749     text-align: center;
 750 }
 751
 752 .rated {
 753     display: inline-block;
 754 }
 755
 756 .rated.left {
 757     margin-right: 9px;
 758 }
 759
 760 .rated label {
 761     font-weight: bold;
 762     margin-right: 3px;
 763     position: relative;
 764     top: -3px;
 765 }
 766
 767 .rating {
 768     display: inline-block;
 769     width: 80px;
 770 }
 771
 772 .rating .back,
 773 .rating .fore,
 774 .rating .star {
 775     background: url(http://cache.saurik.com/crystal/16x16/actions/knewstuff.png);
 776     height: 16px;
 777 }
 778
 779 .rating .back,
 780 .rating .fore {
 781     width: 80px;
 782 }
 783
 784 .rating .star {
 785     display: inline-block;
 786     width: 16px;
 787 }
 788
 789 .rating .back {
 790     opacity: 0.2;
 791 }
 792
 793 .rating .fore {
 794     /*border-right: 1px solid #999999;*/
 795     position: absolute;
 796 }
 797 /* }}} */
 798
 799 panel > fieldset.header {
 800     background-color: transparent;
 801     border: none;
 802     margin: -5px 0 -11px 0;
 803 }
 804
 805 panel > fieldset.header > a > div > label {
 806     color: #4d4d70;
 807     text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0;
 808 }