Changeset 26889 for extensions/Slide/theme.css
- Timestamp:
- Jan 19, 2014, 11:22:11 PM (10 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
extensions/Slide/theme.css
r25167 r26889 123 123 } 124 124 .headbord { 125 border-bottom: 1px solid rgb(51, 51, 51);125 border-bottom: 1px solid #808080; 126 126 } 127 127 #imageHeaderBar { 128 128 margin-bottom: 10px; 129 129 padding-left: 15px; 130 } 130 border: none; 131 background: none; 132 } 133 131 134 /*_______________________________menu______________________________________*/ 132 135 #menubar { … … 152 155 list-style: none outside none; 153 156 margin: 0px; 154 } 157 padding: 0px 0px 0px 5px 158 } 159 #topnav { 160 padding: 0px 2px 0px 0px; 161 height: 30px; 162 position: relative; 163 z-index: 999; 164 display: inline-block; 165 } 166 #topnav .liSub { 167 height: 30px; 168 float: left; 169 position: relative; 170 padding-right: 2px; 171 } 172 #topnav .sub, #loger { 173 position: absolute; 174 top: 30px; 175 margin-left: 0px; 176 background: none repeat scroll 0% 0% rgb(121, 121, 121); 177 padding: 5px 8px 10px 5px; 178 float: left; 179 max-width: 100em; 180 min-width: 200px; 181 max-height: 500px; 182 } 183 155 184 .dd_wrapper, .cl_wrapper, .cc_wrapper, #menubar dt, #menubar dt a { 156 185 float: left; … … 160 189 line-height: 21px; 161 190 text-decoration: none; 162 color: rgb(179, 179, 179);163 191 font-size: 16px; 164 192 } 165 .dd_wrapper:hover, .cl_wrapper:hover, .cc_wrapper:hover, .activate { 166 z-index: 100; 167 padding: 3px 16px 6px; 168 text-shadow: none; 169 cursor: default; 170 background: none repeat scroll 0px 0px rgb(228, 228, 228); 171 } 172 #menubar dt a, #menubar dt a:hover { 173 z-index: 100; 174 padding: 0px; 175 text-shadow: none; 176 cursor: default; 177 } 178 span#menu_start { 179 width: 85px; 180 float: left; 181 display: block; 182 height: 30px; 183 } 184 span#menu_start a { 185 background: url("images/menu/home_w.png") no-repeat scroll left top transparent; 186 width: 52px; 187 height: 30px; 188 padding: 0px; 189 margin: 0px 20px 0px 25px; 190 display: block; 191 line-height: 46px; 192 } 193 span#menu_start a:hover { 194 background-position: left -30px; 195 } 196 span#menu_start a:active { 197 background-position: left -60px; 198 } 199 #topnav { 200 margin: 0px; 201 padding: 0px 2px 0px 0px; 202 list-style: none outside none; 203 height: 30px; 204 position: relative; 205 z-index: 999; 206 display: inline-block; 207 } 208 #topnav .liSub { 209 float: left; 210 position: relative; 211 padding-right: 2px; 212 } 213 #topnav .sub, #topnav #loger { 214 position: absolute; 215 top: 30px; 216 margin-left: 0px; 217 background: none repeat scroll 0% 0% rgb(121, 121, 121); 218 padding: 5px 8px 10px 5px; 219 float: left; 220 max-width: 100em; 221 min-width: 200px; 222 display: none; 223 max-height: 500px; 224 } 225 #topnav #loger { 226 z-index: 50; 227 } 193 .activate{ 194 cursor: default; 195 background: none repeat scroll 0px 0px rgb(121, 121, 121); 196 } 197 .activate:first-child{ 198 color: #dddddd!important; 199 } 200 228 201 .sub { 229 202 z-index: 100; … … 236 209 text-transform: none; 237 210 } 238 .sub a {211 .sub a, #loger a { 239 212 color: rgb(179, 179, 179); 240 } 241 .sub a:hover { 242 color: rgb(179, 179, 179); 243 } 244 ul#topnav .sub ul li, ul#topnav #loger ul li, ul#topnav .sub #menuTagCloud div { 213 font-size: 1.4em; 214 line-height: 17px; 215 padding: 0px 0px 0px 15px; 216 } 217 218 .sub a:hover,loger a:hover { 219 color: rgb(196, 196, 196); 220 background: url("images/menu/navlist_arrow_hover.png") no-repeat scroll 4px 5px transparent; 221 } 222 .sub .selected a { 223 background: url("images/menu/navlist_arrow_select.png") no-repeat scroll 4px 5px transparent; 224 } 225 .sub ul li, #loger ul li, .sub #menuTagCloud div { 245 226 width: 95%; 246 227 color: rgb(179, 179, 179); … … 253 234 -webkit-border-radius: 10px 10px 10px 10px; 254 235 } 255 ul#topnav .sub ul li a, ul#topnav #loger ul li a { 256 float: none; 257 text-indent: 0px; 258 height: auto; 259 margin: 0px 8px; 260 display: block; 261 text-decoration: none; 262 color: rgb(179, 179, 179); 263 font-size: 1.2em; 264 text-shadow: none; 265 text-transform: none; 266 line-height: 17px; 267 padding: 0px 0px 0px 15px; 268 } 269 ul#topnav .sub ul .level1 li, ul#topnav .sub ul .level1 li .selected { 270 border: medium none; 271 background: none repeat scroll 0% 0% transparent; 272 } 273 ul#topnav .sub ul li.selected a { 274 background: url("images/menu/navlist_arrow_select.png") no-repeat scroll 4px 5px transparent; 275 color: rgb(179, 179, 179); 276 text-decoration: none; 277 border: medium none; 278 } 279 ul#topnav .sub ul li a:hover, ul#topnav .sub #menuTagCloud div a:hover { 280 color: rgb(196, 196, 196); 281 background: url("images/menu/navlist_arrow_hover.png") no-repeat scroll 4px 5px transparent; 282 } 283 ul#topnav li .sub ul, ul#topnav #loger ul { 284 list-style: none outside none; 285 margin: 0px 5px 0px 10px; 286 padding: 0px; 287 } 288 .level2, .level3, .level4, .level5 { 236 .level2, .level3, .level4, .level5,.level6 { 289 237 border: medium none ! important; 290 238 } … … 299 247 margin-bottom: 5px; 300 248 height: 30px; 249 } 250 #menu_cat_act a:hover { 251 background: none; 301 252 } 302 253 #filter { … … 313 264 #menuTagCloud a { 314 265 text-decoration: none; 315 text-shadow: none;316 266 z-index: 200; 267 } 268 span#menu_start { 269 width: 85px; 270 float: left; 271 display: block; 272 height: 30px; 273 } 274 span#menu_start a { 275 background: url("images/menu/home_w.png") no-repeat scroll left top transparent; 276 width: 52px; 277 height: 30px; 278 padding: 0px; 279 margin: 0px 20px 0px 25px; 280 display: block; 281 line-height: 46px; 282 } 283 span#menu_start a:hover { 284 background-position: left -30px; 317 285 } 318 286 #quickconnect { … … 346 314 float: left; 347 315 padding: 0px; 348 border: 0pxnone;316 border: none; 349 317 height: 24px; 350 318 width: 23px; … … 365 333 } 366 334 #loger { 367 line-height: 2 5px;335 line-height: 20px; 368 336 width: 220px; 369 337 position: absolute; 370 338 top: 30px; 371 background: none repeat scroll 0% 0% rgb(255, 255, 255);372 339 padding: 10px; 373 340 float: left; … … 380 347 margin-bottom: 20px; 381 348 } 382 # quickconnect #log {349 #log { 383 350 margin-bottom: 20px; 351 margin-top: 5px! important; 384 352 } 385 353 #log div { … … 415 383 } 416 384 /*_______________________________content______________________________________*/ 417 #the_page { 418 height: 900px; 419 } 420 #content { 385 386 #the_page #content, #the_page > .content { 421 387 width: 90%; 422 388 margin: 20px auto; 423 } 389 border: none; 390 } 391 424 392 .contentWithMenu { 425 393 margin: 0px auto; 426 394 } 427 .thumbnailCategories {395 .thumbnailCategories, #profile, .filter { 428 396 background: none repeat scroll 0% 0% rgb(51, 51, 51); 429 397 border: 1px solid rgb(20, 20, 20); … … 433 401 margin-bottom: 20px; 434 402 } 403 .thumbnailCategory .illustration, .commentElement .illustration{ 404 text-align: left; 405 } 435 406 .content .titrePage { 436 407 margin: 10px; 437 408 height: auto; 409 background: none; 410 border: none; 411 } 412 .content .titrePage H2, #imageHeaderBar h2{ 413 font-size: 120%; 414 font-weight: bold; 438 415 } 439 416 .blockConteneur { … … 519 496 } 520 497 .thumbnails { 498 padding: 10px; 521 499 margin-top: 20px; 522 500 border: 1px solid rgb(20, 20, 20); … … 566 544 z-index: 120; 567 545 } 568 /*_______________________________slide______________________________________*/ 546 547 /*_______________________________SLIDE______________________________________*/ 569 548 #pageslide { 570 549 display: none; … … 577 556 overflow: hidden; 578 557 padding: 0px; 579 } 580 .intabs { 581 background: none repeat scroll 0% 0% rgb(34, 34, 34); 582 width: 40px; 583 border-right: 1px solid rgb(77, 77, 77); 584 z-index: 120; 585 top: 0px; 586 position: absolute; 587 left: 0px; 588 transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s; 589 -moz-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s; 590 -webkit-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s; 591 -o-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s; 592 opacity: 0; 593 -ms-filter: "alpha(opacity=0)"; 594 filter: alpha(opacity=0); 595 zoom: 1; 596 cursor: default; 558 background:red; 559 display:block; 597 560 } 598 561 .tabs { … … 612 575 zoom: 1; 613 576 } 614 #sld_tab, #sld_tabIdent {577 .sld_tab, .sld_tabIdent { 615 578 font-size: 30px; 616 579 position: relative; … … 625 588 display: none; 626 589 } 627 .hideTransi {628 opacity: 0;629 -ms-filter: "alpha(opacity=0)";630 filter: alpha(opacity=0);631 zoom: 1;632 transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s;633 -moz-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s;634 -webkit-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s;635 -o-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 2s ease 0s;636 }637 .visibleTransi {638 opacity: 1;639 -ms-filter: "alpha(opacity=100)";640 filter: alpha(opacity=100);641 zoom: 1;642 transition: bottom 1s ease 0s, width 1s ease 0s, opacity 3s ease 2s;643 -moz-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 3s ease 2s;644 -webkit-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 3s ease 2s;645 -o-transition: bottom 1s ease 0s, width 1s ease 0s, opacity 3s ease 2s;646 }647 590 .visible { 648 591 opacity: 1; … … 654 597 .jspPane { 655 598 position: absolute; 599 min-height:100%; 656 600 } 657 601 .jspContainer { … … 747 691 z-index: 1000 ! important; 748 692 } 693 /*_______________________________slide_______________________________________*/ 694 .pageslide { 695 display: none; 696 position: absolute; 697 top: 0; 698 height: 100%; 699 z-index: 101; 700 width: 100%; 701 background-color: #222; 702 color: #FFF; 703 } 704 .tab{ 705 height: 100%; 706 position: absolute; 707 right: 0px; 708 width: 40px; 709 background: none repeat scroll 0% 0% rgb(34, 34, 34); 710 cursor: pointer; 711 z-index: 100; 712 display: none; 713 border-right: 1px solid #808080; 714 padding-right: 2px 715 } 716 .tab:hover{ 717 background: none repeat scroll 0% 0% #333333; 718 } 719 720 /*____________________________SLIDESHOW___________________________________________*/ 721 #slideshow{ 722 font-family: Arial; 723 font-size: 12px; 724 position: relative; 725 min-width: 500px; 726 min-height: 500px; 727 margin-top: 10px 728 } 729 .contener_slideshow{ 730 border: 1px solid #ccc; 731 border-radius: 5px 732 } 733 #slideshow ul{ 734 height: 100%; 735 margin: 0; 736 padding: 0; 737 position: relative; 738 overflow: hidden 739 } 740 #slideshow ul li{ 741 list-style-type: none; 742 } 743 .slideloader{ 744 background: url(images/slideshow/loader.gif)no-repeat center ! important; 745 position: absolute; 746 top: 0; 747 left: 0; 748 z-index: 1000 749 } 750 .contenerImg{ 751 position: relative 752 } 753 .contenerImg img{ 754 position: relative; 755 } 756 .control_slideshow{ 757 position: relative; 758 } 759 /*FADE*/ 760 .Fade .contenerImg{ 761 position: absolute; 762 left: 0; 763 top: 0; 764 } 765 .Fade ul li{ 766 position: absolute; 767 top: 0; 768 left: 0; 769 height: 100%; 770 width: 100% 771 } 772 /*SLIDE*/ 773 .slideCont{ 774 overflow: hidden; 775 position: relative; 776 } 777 .Slide ul li{ 778 float: left 779 } 780 /*THUMB*/ 781 .nav-thumb-slide{ 782 height: auto 783 } 784 .nav-thumb-content{ 785 position: relative; 786 } 787 .nav-thumb-content span{ 788 padding: 0; 789 border: none; 790 } 791 .thumb{ 792 height: 100%; 793 width: 100%; 794 position: absolute; 795 top: 0px; 796 left: 0px 797 } 798 .slideshow-thumb{ 799 border: 1px #000 solid; 800 cursor: pointer; 801 left: 3px; 802 line-height: 22px; 803 margin: 3px; 804 padding: 2px 6px; 805 position: relative; 806 text-align: center; 807 top: 3px; 808 vertical-align: top; 809 display: inline-block; 810 opacity: 0.50; 811 } 812 .slideshow-thumb:hover{ 813 opacity: 1 814 } 815 .thumb_control{ 816 opacity: 0.5; 817 width: 40px; 818 height: 100%; 819 cursor: pointer; 820 position: absolute; 821 top: 0; 822 } 823 .thumb_control:hover{ 824 opacity: 1 825 } 826 .thumb-left{ 827 background: url(images/slideshow/prev_thumb.png)no-repeat 50% 50%; 828 } 829 .thumb-right{ 830 background: url(images/slideshow/next_thumb.png)no-repeat 50% 50%; 831 right: 0; 832 } 833 .nav-thumb-slide{ 834 overflow: hidden; 835 836 } 837 .clt_thumb{ 838 background: url(images/slideshow/show.png)no-repeat -2px -34px; 839 border: 1px #4a4a4a solid; 840 width: 28px; 841 height: 28px; 842 cursor: pointer; 843 margin: 3px; 844 text-align: center; 845 vertical-align: top; 846 right: 0; 847 z-index: 200; 848 display: inline-block; 849 position: absolute; 850 } 851 .show{ 852 background: url(images/slideshow/show.png)no-repeat -2px -2px 853 } 854 /*LINK-NAV*/ 855 .link{ 856 text-align: center; 857 height: auto; 858 padding: 5px 0; 859 position: relative 860 } 861 .slideshow-link{ 862 cursor: pointer; 863 display: inline-block; 864 width: 24px; 865 height: 24px; 866 background: url(images/slideshow/nav.png)no-repeat center 0px; 867 padding: 0 10px; 868 color: #fff; 869 line-height: 24px 870 } 871 .slideshow-link:hover{ 872 background: url(images/slideshow/nav.png) no-repeat scroll center -24px transparent; 873 } 874 .selected { 875 background: url(images/slideshow/nav.png) no-repeat scroll center -24px transparent; 876 font-weight: bold; 877 opacity: 1; 878 } 879 /*PLAY/PAUSE*/ 880 .slideshow_control { 881 display: inline-block; 882 border: 1px #4a4a4a solid; 883 width: 28px; 884 height: 28px; 885 cursor: pointer; 886 margin: 3px; 887 text-align: center; 888 vertical-align: top; 889 z-index: 200 890 } 891 .pause{ 892 background: url(images/slideshow/pauseh.png)no-repeat center; 893 } 894 .play{ 895 background: url(images/slideshow/playh.png)no-repeat center 896 } 897 .play:hover{ 898 background: url(images/slideshow/play.png)no-repeat center 899 } 900 .pause:hover{ 901 background: url(images/slideshow/pause.png)no-repeat center; 902 } 903 /*NAVIGATION*/ 904 .nav{ 905 cursor: pointer; 906 position: absolute; 907 width: 20%; 908 top: 0; 909 min-width: 30px 910 } 911 .prev{ 912 left: 0 913 } 914 .next{ 915 right: 0 916 } 917 .prev:hover{ 918 background: url(images/slideshow/prev.png)no-repeat 0 50%; 919 } 920 .next:hover{ 921 background: url(images/slideshow/next.png)no-repeat 100% 50% 922 } 923 /*DESCRIPTION*/ 924 .descr{ 925 position: absolute; 926 color: #fff; 927 z-index: 100; 928 display: none; 929 background: rgba(0,0,0,0.5); 930 font-size: 15px 931 } 932 933 934 /*_____________________________________RATING____________________________________________________*/ 935 #rateForm{ 936 position: relative 937 } 938 INPUT[type="submit"].rateButton, INPUT[type="button"].rateButton { 939 background: url("images/rating-stars.png") repeat scroll 0% 0% transparent; 940 min-width: inherit; 941 box-shadow: none; 942 border-radius: 0; 943 margin: 0 5px; 944 height: 16px; 945 width: 16px; 946 padding-bottom: 0 947 948 } 949 INPUT[type="button"].rateButtonSelected { 950 background: url("images/rating-stars.png") repeat scroll 16px center transparent; 951 margin: 0 5px; 952 height: 16px; 953 width: 16px; 954 font-size: 100% 955 } 956 INPUT[type="submit"].rateButtonFull, INPUT[type="button"].rateButtonFull { 957 background: url("images/rating-stars.png") repeat scroll 16px center transparent; 958 } 959 .derivative:hover, .original:hover{ 960 color: rgb(194, 194, 194); 961 cursor: pointer 962 } 963 964 /*________________________________________COMMENT__________________________________*/ 965 @keyframes monanimation { 966 0% { 967 border: 1px solid #fff; 968 } 969 100%{ 970 border: 1px solid red; 971 } 972 } 973 #comments TEXTAREA, #comments INPUT[type="text"]{ 974 border: 1px solid #fff; 975 } 976 977 #comments INPUT[type="text"].requi, #comments TEXTAREA.requi { 978 animation: monanimation 0.5s ease-in-out 4 alternate; 979 border: 1px solid red; 980 } 981 #msgBoxCom { 982 border: 1px solid rgb(107, 120, 133); 983 border-radius: 5px 5px 5px 5px; 984 -moz-border-radius: 5px 5px 5px 5px; 985 -webkit-border-radius: 5px 5px 5px 5px; 986 text-align: center; 987 font-size: 1.2em; 988 height: auto; 989 width: 310px; 990 padding: 25px 5px; 991 } 992 #msgBox { 993 background: none repeat scroll 0% 0% rgb(0, 0, 0); 994 position: fixed; 995 top: 100px; 996 right: 100px; 997 width: 320px; 998 height: auto; 999 padding: 15px; 1000 border-radius: 5px 5px 5px 5px; 1001 -moz-border-radius: 5px 5px 5px 5px; 1002 -webkit-border-radius: 5px 5px 5px 5px; 1003 z-index: 200; 1004 } 1005 1006 /*_______________________________PICTURE PAGE____________________________________________________*/ 1007 #imgContent{ 1008 position: relative; 1009 display: table; 1010 margin: auto 1011 } 1012 #imgHoverNav a{ 1013 outline: medium none 1014 } 1015 #imgPrevHov,#imgNextHov,#thumbPrevHov,#thumbNextHov{ 1016 width: 48%; 1017 height: 100%; 1018 display: block; 1019 border: medium none!important; 1020 opacity: 0; 1021 position: relative 1022 } 1023 #imgPrevHov{ 1024 left: 0; 1025 float: left; 1026 margin-left: 3px; 1027 background: url(images/picture/imgPrevHover.png) no-repeat scroll left 45% transparent 1028 } 1029 #imgNextHov{ 1030 right: 0; 1031 float: right; 1032 margin-right: 3px; 1033 background: url(images/picture/imgNextHover.png) no-repeat scroll right 45% transparent 1034 } 1035 #thumbPrevHov{ 1036 left: 0; 1037 float: left; 1038 background: none repeat scroll 0 0 transparent 1039 } 1040 #thumbNextHov{ 1041 right: 0; 1042 float: right; 1043 background: none repeat scroll 0 0 transparent 1044 } 1045 #imgPrevHov:hover,#imgNextHov:hover,#thumbPrevHov:hover,#thumbNextHov:hover{ 1046 opacity: 1 1047 } 1048 .linkPrev{ 1049 position: absolute; 1050 left: -80px; 1051 top: 40% 1052 } 1053 .linkNext{ 1054 position: absolute; 1055 right: -80px; 1056 top: 40% 1057 } 1058 #imageInfos{ 1059 border-radius: 5px; 1060 } 1061 .pwg-icon-arrowstop-w{ 1062 display: none 1063 } 1064 1065 /*_________________________ICONS_______________________________________________________*/ 1066 .pwg-icon{ 1067 background-image: url(icon/icons_sprite.png); 1068 } 1069 A:hover .pwg-icon{ 1070 background-image: url(icon/icons_sprite-hover.png); 1071 } 1072 1073 /*_________________________slide loading_______________________________________________*/ 1074 #slideLoading{ 1075 position: fixed; 1076 height: 100px; 1077 width: 100px; 1078 background: url("/piwigo26/themes/Slide/images/ajax-loader.gif") no-repeat scroll center center rgba(51, 51, 51, 0.46); 1079 z-index: 0; 1080 border-radius: 5px; 1081 border: 1px solid #000; 1082 } 1083
Note: See TracChangeset
for help on using the changeset viewer.