Changeset 19421 for extensions/simple_themes/simple/theme.css
- Timestamp:
- Dec 13, 2012, 2:22:28 PM (11 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
extensions/simple_themes/simple/theme.css
r16030 r19421 131 131 border: 8px #fff solid; 132 132 margin: 0 20px; 133 max-width: 90%;134 133 } 135 134 #theImage p { … … 209 208 color: #00FF00; 210 209 font-weight: bold; 210 } 211 212 #thePicturePage #comments h3 { 213 cursor:pointer; 214 } 215 216 .commentsList .commentElement { 217 list-style:none; 218 padding:0.5em 0; 219 } 220 221 #thePicturePage #comments .description { 222 padding:0; 223 border:none; 224 } 225 226 #theCommentsPage .commentElement .description { 227 border-top:1px dotted #555; 211 228 } 212 229 … … 220 237 padding:5px; 221 238 border-top: 1px dotted #606060; 222 }223 224 #comments .description {225 border-top: 1px dotted #606060;226 display: block;227 padding: 10px 0;228 239 } 229 240 … … 244 255 width: 26px; 245 256 } 257 258 /* 259 CSS for all pages 260 */ 261 262 body { 263 font: 75% "Bitstream Vera Sans", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif; 264 margin: 0; 265 padding: 0; 266 } 267 268 img { border: 0; } 269 a { text-decoration: none; } 270 hr { border: 1px #999999 solid; } 271 272 h1, h2, h3 { 273 margin: 0; 274 padding: 0; 275 font-size: 1em; 276 } 277 h1 { font-size: 1.6em; } 278 279 #menuswitcher { 280 cursor: pointer; 281 } 282 283 /* hide javascript stuff */ 284 285 .js #menubar, .js #theComments > div { 286 display: none; 287 } 288 289 /* Layout */ 290 291 #the_page { 292 width: 85%; 293 margin: 0 auto; 294 padding: 0; 295 } 296 297 #theHeader h1 { 298 padding: 1em 0 0; 299 } 300 #theHeader p { 301 padding: 0; 302 margin: 0; 303 } 304 305 .titrePage { 306 margin: 1em 0; 307 line-height: 1.5em; 308 } 309 310 .titrePage h2 { 311 margin: 1em 0; 312 padding: 0; 313 display: inline; 314 } 315 .subcontent h2 { 316 margin: 0 0 1em; 317 } 318 319 .titrePage .button { 320 float: none; 321 } 322 323 .titrePage img { 324 float: left; 325 max-height: 16px; 326 margin: 0 5px; 327 } 328 329 .titrePage .categoryActions { 330 float: right; 331 margin: 0; 332 padding: 0; 333 list-style: none; 334 width: auto; 335 } 336 337 .categoryActions li { 338 display: inline; 339 } 340 341 #content { 342 margin: 1em 0 0; 343 padding: 1em; 344 } 345 346 /* tags */ 347 348 .tagLevel5 { font-size: 130%; } 349 .tagLevel4 { font-size: 120%; } 350 .tagLevel3 { font-size: 110%; } 351 .tagLevel2 { font-size: 100%; } 352 .tagLevel1 { font-size: 90%; } 353 354 #fullTagCloud { 355 text-align: center; 356 margin: 1em 2em; 357 } 358 359 #fullTagCloud span { 360 white-space: nowrap; 361 margin: 0 0.5em; 362 } 363 364 #fullTagCloud a { 365 padding: 2px; 366 } 367 368 .tagLetterContent { 369 width: 100%; 370 } 371 372 .tagSelection li { 373 display: inline; 374 } 375 376 /* Messages */ 377 378 .errors, .infos { 379 color: #e04040; 380 border: 1px dashed; 381 margin: 1em; 382 } 383 384 /* Forms */ 385 386 form { 387 margin: 0; 388 } 389 390 #content form li, .subcontent form li { 391 list-style: none; 392 margin: 0.2em 0; 393 } 394 395 .property { 396 display: inline-block; 397 width: 180px; 398 } 399 400 #quicksearch { 401 margin: 1em 0 0; 402 } 403 #quicksearch p { 404 margin: 0; 405 } 406 #quicksearch #q { 407 width: 150px; 408 } 409 410 /* Menubar */ 411 412 #menubar { 413 margin: 0 2em 0 0; 414 padding: 0; 415 float: left; 416 width: 15%; 417 } 418 419 #menubar ul { 420 margin: 0; 421 padding: 1em 0 1em 2em; 422 } 423 #menubar dd { 424 margin: 0; 425 padding: 0; 426 } 427 428 #menubar ul ul { 429 margin: 0; 430 padding: 0 0 0 1em; 431 } 432 433 /* images thumbnails */ 434 435 #thumbnails { 436 width: auto; 437 text-align: center; 438 padding: 1em 0; 439 } 440 441 #thumbnails ul, .middle_block > ul { 442 margin: 0; 443 padding: 0; 444 overflow: hidden; 445 list-style: none; 446 } 447 448 #thumbnails li, .middle_block > ul li { 449 margin: 1em; 450 padding: 0; 451 display: inline-block; 452 vertical-align: middle; 453 } 454 455 .nb-comments, .nb-hits { 456 font-weight: normal; 457 } 458 .zero { 459 display: none; 460 } 461 462 /* categories thumbnails */ 463 464 .thumbnailCategories { 465 margin: 0; 466 padding: 0; 467 overflow: hidden; 468 list-style: none; 469 } 470 471 .thumbnailCategories li { 472 display: inline-block; 473 overflow: hidden; 474 vertical-align: top; 475 margin: 1em; 476 width: 29%; 477 text-align: center; 478 } 479 480 .illustration { 481 } 482 483 .description { 484 overflow: auto; 485 } 486 487 .description h3 { 488 margin: 0; 489 } 490 491 .thumbCatDescNfoDate, .thumbCatDescNbImg { 492 margin: 0; 493 font-size: 80%; 494 } 495 496 .thumbCatDesc { 497 margin: 0; 498 padding-top: 4px; 499 word-wrap: break-word; 500 } 501 502 /* page : title bar */ 503 504 #additional_info { 505 margin: 1em 5em; 506 } 507 508 .navigationBar { 509 padding: 0.5em; 510 text-align: right; 511 } 512 513 /* pictures pages */ 514 515 #thePicturePage #content { 516 background-color:transparent; 517 border-top:none; 518 margin:none; 519 padding:none; 520 } 521 522 #thePicturePage #theHeader { 523 display: none; 524 } 525 #thePicturePage #content { 526 padding: 1em 0 0; 527 } 528 529 .imageNumber { 530 float: right; 531 padding: 0 3px; 532 font-size: 0.9em; 533 } 534 535 .navButtons { 536 font-size: 1.5em; 537 text-align: center; 538 } 539 540 #navThumbPrev, #navThumbNext { 541 text-align: center; 542 margin: 1em auto; 543 } 544 545 #imageToolBar { 546 height: 25px; 547 } 548 /* 549 #imageInfoBar { 550 float: right; 551 clear: right; 552 width: 25%; 553 } 554 555 #randomButtons ul { 556 padding: 0; 557 list-style-type: none; 558 } 559 560 #imageInfos dt, #imageMeta dt { 561 font-weight: bold; 562 } 563 #imageInfos dd, #imageMeta dd { 564 margin-left: 1em; 565 overflow: hidden; 566 } 567 568 #theImage { 569 float: left; 570 width: 75%; 571 text-align: center; 572 padding: 1em 0 2em; 573 margin: 0 auto; 574 overflow: hidden; 575 } 576 */ 577 #rateForm { 578 margin: 0; 579 } 580 #rateForm input, #rateForm input:active { 581 cursor: pointer; 582 border: none; 583 padding: 0; 584 } 585 #rateForm input.rateButtonStarFull { 586 background: url('icon/rating-stars.png') no-repeat scroll -16px center; 587 width: 16px; 588 } 589 #rateForm input.rateButtonStarEmpty { 590 background: url('icon/rating-stars.png') no-repeat scroll 0 center; 591 width: 16px; 592 } 593 594 595 /* slideshow */ 596 597 #slideshow { 598 margin: 1em auto; 599 } 600 #slideshow .titrePage { 601 width: 600px; 602 margin: 0 auto; 603 } 604 605 #slideshow .navButtons { 606 display: inline; 607 font-size: 1em; 608 float: right; 609 margin-right: 1em; 610 } 611 #slideshow #theImage { 612 float: none; 613 width: 100%; 614 } 615 616 #slideshow #copyright {display:none;} 617 #slideshow #content {border:none;} 618 619 /* comments */ 620 621 #theComments h3 { 622 height: 25px; 623 line-height: 25px; 624 padding-left: 1em; 625 cursor: pointer; 626 } 627 628 #commentAdd, #commentList { 629 width: 48%; 630 padding: 1%; 631 } 632 #commentAdd { float: left; } 633 #commentList { float: right; } 634 635 #commentAdd input[type="text"], #commentAdd textarea { 636 width: 400px; 637 } 638 639 #commentList ul { 640 list-style: none; 641 padding: 0; 642 } 643 #commentList li { 644 clear: both; 645 display: block; 646 border-top: 1px dotted #606060; 647 padding: 0.5em 0; 648 } 649 #commentList li ul { 650 list-style-type: none; 651 padding: 4px; 652 } 653 654 ul.actions { 655 float: right; 656 } 657 658 #commentList .author { 659 font-weight: bold; 660 font-variant: small-caps; 661 } 662 #commentList .date { 663 font-style: italic; 664 } 665 666 #theCommentsPage #comments li { 667 list-style: none; 668 border-top: none; 669 /* display: table-row; */ 670 min-height:150px; 671 } 672 673 #theCommentsPage form label { 674 display: inline-block; 675 line-height: 25px; 676 } 677 678 #comments .illustration { 679 width: auto; 680 } 681 682 /* calendar */ 683 684 .calendarViews, .calendarCalBar { 685 margin: 1em 0; 686 } 687 688 .calCalHead { 689 font-size: 1.1em; 690 font-weight: bold; 691 } 692 693 .calMonth { 694 width: 80%; 695 margin: 1em auto; 696 } 697 698 .calendarBar { 699 text-align: center; 700 } 701 .calendarBar span { 702 margin: 0 0.5em; 703 } 704 705 /* Footer */ 706 707 #copyright { 708 padding: 2px; 709 clear: both; 710 } 711 712 /* PWG stuff */ 713 714 .personal_block { padding: 0 !important; } 715 716 717 /* */ 718 719 @media only screen and (max-width: 957px) { 720 #the_page { 721 width: 100%; 722 margin: 0; 723 } 724 725 #thePicturePage #content { 726 position: relative; 727 } 728 729 #theHeader { margin: 0 1em; } 730 .titrePage { margin: 1em; } 731 732 #theImage { 733 width: 100%; 734 float: none; 735 } 736 737 #imageInfoBar { 738 float: none; 739 clear: both; 740 width: 100%; 741 margin: 0 10px; 742 } 743 #navThumbPrev, #navThumbNext { 744 float: left; 745 margin: 1em; 746 } 747 .thumbnailCategories li { 748 width: 45%; 749 } 750 } 751 752 @media only screen and (max-width: 520px) { 753 .thumbnailCategories li { 754 width: 95%; 755 } 756 } 757 758 /* (from elegant) picture page */ 759 760 .contentWithMenu #imageHeaderBar { padding: 0;} 761 /* 762 #imageHeaderBar { padding: 0 0 0 10px;} 763 */ 764 #imageHeaderBar { width: auto;} 765 #imageHeaderBar h2 { font-size: 100%; font-weight: inherit;} 766 #imageHeaderBar .browsePath { 767 display:inline-block; 768 float:left; 769 font-size:100%; 770 text-transform:uppercase; 771 line-height:20px; 772 padding: 0; 773 font-weight:bold; 774 margin:0; 775 } 776 #imageToolBar .imageNumber { display: inline-block; float: right; line-height: 26px; margin: 0 2px 0 0; min-width: 40px; text-align: center;} 777 #imageToolBar { margin-top: -38px; margin-bottom: 0; float: right;} 778 #thePicturePage .pwg-button { width: 26px;} 779 #thePicturePage .actionButtons { margin-right: 26px;} 780 781 #theImageAndInfos { 782 background-color:#3f3f3f; 783 padding:15px 0; 784 border-top: 2px solid #606060; 785 display: block; 786 width: 100%; 787 position: relative; 788 } 789 #theImage { 790 display: inline-block; 791 width: 70%; 792 vertical-align: top; 793 overflow: auto; 794 padding: 10px 0 5px 0; 795 text-align:center; 796 } 797 798 .rateButtonStarFull { background: url('icon/rating-stars.png') no-repeat -16px center; width:16px;} 799 .rateButtonStarEmpty { background: url('icon/rating-stars.png') no-repeat 0 center; width:16px;} 800 801 802 /* image infos */ 803 804 #imageInfos { 805 display: inline-block; 806 width: 29.5%; 807 vertical-align: top; 808 padding-top: 0; 809 padding-bottom: 5px; 810 margin: 10px 0 10px 0.5%; 811 word-wrap:break-word; 812 } 813 814 #imageInfos .navThumbs { width: 260px; height: 130px; margin: auto; padding: 0 5px;} 815 #imageInfos .navThumb { position: relative; /* width: 120px; height: 120px; */ margin: 0; overflow: hidden;} 816 #imageInfos #linkPrev { float: left;} 817 #imageInfos #linkNext { float: right;} 818 #imageInfos .thumbHover { position: absolute; width: 100%; height: 100%;} 819 #imageInfos .prevThumbHover { background: transparent url(icon/none.png) no-repeat center center;} 820 #imageInfos .prevThumbHover:hover { background: transparent url(icon/img_prev.png) no-repeat center center;} 821 #imageInfos .nextThumbHover { background: transparent url(icon/none.png) no-repeat center center;} 822 #imageInfos .nextThumbHover:hover { background: transparent url(icon/img_next.png) no-repeat center center;} 823 824 #imageInfos dl.imageInfoTable { display: block; padding: 0 15px; margin: 12px auto;} 825 #imageInfos .imageInfo { display: block; line-height: 16px;} 826 #imageInfos .imageInfo dt { display: block; font-weight: bold; text-align: left; padding: 0;} 827 #imageInfos .imageInfo dd { display: block; text-align: left; margin: 0 0 5px 20px;} 828 #imageInfos h3 { margin: 20px 0 10px;} 829 #imageInfos .navThumbs a img {border:2px solid #606060;} 830 #imageInfos .navThumbs a:hover img {border-color:#ccc;} 831 832 /* image comments */ 833 834 #thePicturePage #comments { padding: 2px 5px; background-color:#3f3f3f; border-top:2px solid #606060;} 835 #thePicturePage #comments h3 { margin: 10px 0;} 836 #thePicturePage #comments form { margin: 10px 0;} 837 #thePicturePage #comments fieldset { margin: 0 1em;} 838 839 .commentshidden #pictureComments { display: none;} 840 .commentContent .comments_toggle { cursor: pointer;} 841 842 #commentAdd, #pictureCommentList { width: 48%; padding: 0 1%;} 843 #commentAdd { float: left; } 844 #pictureCommentList { float: right; } 845 846 #commentAdd input[type="text"], 847 #commentAdd textarea { 848 width: 95%; 849 font-family: Arial,Helvetica,sans-serif; 850 font-size: 100%; 851 } 852 853 #pictureCommentList .commentsOrder { float: left; margin-bottom: 5px;} 854 #pictureCommentList .navigationBar { float: right; margin-bottom: 5px;} 855 #pictureComments h4 { margin: 0;} 856 #pictureComments form p { margin: 5px 0;} 857 #pictureComments form p textarea { margin: 10px 0;} 858 #pictureComments INPUT { margin: 10px;} 859 #pictureComments INPUT[type=submit] { margin: 0;} 860 .commentElement .description { padding: 5px;} 861 862 /* icons */ 863 .pwg-icon { 864 display: inline-block; /*IE6 does not get this correctly*/ 865 text-indent: -9999px; overflow: hidden; background-repeat: no-repeat; 866 width: 26px; height: 26px; background-image: url(s26/outline_808080.png); 867 vertical-align: bottom; 868 } 869 .pwg-button-text { display:none; } 870 871 .pwg-state-disabled .pwg-icon { 872 opacity: .5; 873 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 874 filter: alpha(opacity=50); 875 } 876 877 .pwg-button { 878 display: inline-block; 879 vertical-align: top; 880 cursor:pointer; 881 } 882 883 .pwg-icon-home {background-position: -26px 0} 884 .pwg-icon-camera {background-position: -52px 0} 885 .pwg-icon-save {background-position: -78px 0} 886 .pwg-icon-cloud {background-position: -104px 0} 887 .pwg-icon-letters {background-position: -130px 0} 888 .pwg-icon-calendar {background-position: -156px 0} 889 .pwg-icon-camera-calendar {background-position: -182px 0} 890 891 .pwg-icon-arrow-n {background-position: 0 -26px} 892 .pwg-icon-arrow-e {background-position: -26px -26px} 893 /*.pwg-icon-arrow-s {background-position: -52px -26px}*/ 894 .pwg-icon-arrow-w {background-position: -78px -26px} 895 /*.pwg-icon-arrowstop-n {background-position: -104px -26px}*/ 896 .pwg-icon-arrowstop-e {background-position: -130px -26px} 897 /*.pwg-icon-arrowstop-s {background-position: -156px -26px}*/ 898 .pwg-icon-arrowstop-w {background-position: -182px -26px} 899 900 .pwg-icon-close {background-position: 0 -52px} 901 .pwg-icon-category-edit {background-position: -26px -52px} 902 .pwg-icon-sort {background-position: -52px -52px} 903 .pwg-icon-sizes {background-position: -78px -52px} 904 .pwg-icon-category-view-normal {background-position: -156px -52px} 905 .pwg-icon-category-view-flat {background-position: -182px -52px} 906 907 .pwg-icon-caddie {background-position: 0 -78px} 908 .pwg-icon-caddie-add {background-position: -26px -78px} 909 .pwg-icon-caddie-del {background-position: -52px -78px} 910 .pwg-icon-favorite {background-position: -78px -78px} 911 .pwg-icon-favorite-add {background-position: -104px -78px} 912 .pwg-icon-favorite-del {background-position: -130px -78px} 913 .pwg-icon-filter {background-position: -156px -78px} 914 .pwg-icon-filter-del {background-position: -182px -78px} 915 916 .pwg-icon-camera-info {background-position: 0 -104px} 917 .pwg-icon-representative {background-position: -26px -104px} 918 .pwg-icon-edit {background-position: -52px -104px} 919 .pwg-icon-register {background-position: -78px -104px} 920 .pwg-icon-lost-password {background-position: -104px -104px} 921 922 .pwg-icon-slideshow {background-position: 0 -130px} 923 .pwg-icon-play {background-position: -26px -130px} 924 .pwg-icon-pause {background-position: -52px -130px} 925 .pwg-icon-stop {background-position: -78px -130px} 926 .pwg-icon-clock-plus {background-position: -104px -130px} 927 .pwg-icon-clock-minus {background-position: -130px -130px} 928 .pwg-icon-repeat-play {background-position: -156px -130px} 929 .pwg-icon-repeat-stop {background-position: -182px -130px} 930 931 .pwg-icon-map {background-position: 0 -156px} 932 .pwg-icon-globe {background-position: -26px -156px} 933 934 .pwg-icon { background-image: url(../default/s26/outline_808080.png);} 935 A:hover .pwg-icon { background-image: url(../default/s26/outline_ffffff.png);} 936 937 /** 938 * Picture 939 */ 940 #imageHeaderBar { 941 padding-top: 2px; 942 padding-bottom: 2px; 943 margin-bottom:10px; 944 overflow: hidden; 945 width: 100%; 946 } 947 948 #imageHeaderBar .browsePath { 949 float: left; 950 } 951 952 #imageToolBar .imageNumber { 953 float: right; 954 margin:0 0 0 10px; 955 } 956 957 #imageHeaderBar H2 { 958 display: inline; 959 text-align: center; 960 padding: 0; 961 } 962 963 #imageToolBar { 964 text-align: center; 965 clear: both; 966 margin-bottom: 2px; 967 padding: 0; 968 height: 28px; 969 } 970 971 #imageToolBar .actionButtons { float: left; } 972 #imageToolBar .navigationButtons { float: right; } 973 974 .switchBox { 975 padding: 0.5em 5px; 976 border-radius: 4px; 977 z-index: 100; 978 text-align:left; 979 display: none; 980 position: absolute; 981 left: 0; top: 0; /*left, right set through js*/ 982 } 983 984 .switchBoxTitle { 985 border-bottom:1px solid #ccc; 986 padding-bottom:5px; 987 margin-bottom:5px; 988 } 989 990 .switchBox { 991 border: none; 992 background-color: #222; 993 color:#aaa; 994 font-size:14px; 995 } 996 997 .switchBoxTitle { 998 border-bottom: 1px solid #444444; 999 } 1000 1001 1002 .relSwitchBox { 1003 position: relative; 1004 } 1005 1006 #infoSwitcher {display:none;} 1007 #pictureComments {display: none;} 1008 .derivativeSizeDetails {display: none;}
Note: See TracChangeset
for help on using the changeset viewer.