Widget:背景图片:修订间差异
imported>=海豚= 清空页面 |
imported>=海豚= 无编辑摘要 |
||
| 第1行: | 第1行: | ||
<noinclude>用来给{{tl|替换侧边栏底图}}和{{tl|背景图片}}更好的体验效果的,作者[[User:AnnAngela]],修订[[User:=海豚=]]。</noinclude><includeonly><!--{if !isset($wgSideBarPic) || !$wgSideBarPic}--><!--{assign var="wgSideBarPic" value=true scope="global"}--><script> | |||
window.RLQ = window.RLQ || []; | |||
window.RLQ.push(function() { | |||
$(function() { | |||
var sidebarCharacter = $(".sidebar-character").slice(0, 3); | |||
if (!sidebarCharacter.length) return; | |||
$("body").addClass("sideBarPic"); | |||
sidebarCharacter.addClass('active').each(function() { | |||
var self = $(this); | |||
self.appendTo("#mw-navigation").fadeIn().addClass(this.dataset.align === 'top' ? 'top' : 'bottom').css('user-select', 'none'); | |||
self.find('img').removeAttr('width').removeAttr('height'); | |||
}); | |||
$(window).on('resize', function() { | |||
sidebarCharacter.each(function() { | |||
var self = $(this); | |||
self.find('img').width(self.width()); | |||
}); | |||
}).resize(); | |||
if (sidebarCharacter.is('[data-displaylogo="yes"]')) $('body').addClass('show-logo'); | |||
}); | |||
});</script><style> | |||
/* 侧边栏logo或左下角图片添加 */ | |||
@media screen and (max-width: 600px) { | |||
/* 低像素设备隐藏 */ | |||
.sidebar-character { | |||
display: none!important; | |||
} | |||
} | |||
.sideBarPic.skin-vector:not(.DeceasedPerson) div#mw-panel div.portal { | |||
background-color: rgba(246, 246, 246, 0.9); | |||
/*padding-top: 0; | |||
top: 212px*/ | |||
margin-left: -0.75em; | |||
margin-right: 0; | |||
padding-left: 1.5em; | |||
padding-right: .95em; | |||
} | |||
.sideBarPic.skin-vector:not(.DeceasedPerson) div#mw-panel #p-logo + div.portal{ | |||
padding-top: 1.1em; | |||
margin-top: 0; | |||
} | |||
.sideBarPic.skin-vector:not(.DeceasedPerson) #mw-panel div#p-logo { | |||
/*background: rgba(246, 246, 246, 0.73); | |||
left: 0; | |||
padding: 0 .5em; | |||
top: -212px*/ | |||
} | |||
.sideBarPic:not(.DeceasedPerson) .sidebar-character.active { | |||
display: block; | |||
} | |||
.sidebar-character { | |||
display: none; | |||
} | |||
body.show-logo:not(.DeceasedPerson) #mw-panel #p-logo { | |||
height: 160px; | |||
} | |||
body.show-logo:not(.DeceasedPerson) #mw-panel #p-logo .mw-wiki-logo { | |||
height: 160px; | |||
} | |||
.sideBarPic:not(.DeceasedPerson) #footer { | |||
background-color: rgba(255,255,255,.7); | |||
} | |||
.sideBarPic:not(.DeceasedPerson) #footer #footer-moegirl .copyright { | |||
color: #2f2f2f; | |||
} | |||
div#content,div#p-cactions li a:hover,div#p-cactions li.selected a,div#content div.thumb { | |||
background-color: rgba(255,255,255,.8); | |||
background-image: none; | |||
} | |||
div#mw-page-base { | |||
background-color: rgba(255,255,255,0); | |||
background-image: none; | |||
} | |||
div#mw-head div#p-personal { | |||
background: rgba(255,255,255,.73); | |||
padding: 5px 10px 5px 0; | |||
} | |||
div#mw-head div#p-personal ul { | |||
padding-left: 0; | |||
} | |||
body.sideBarPic div#mw-head div.vectorMenu h3 { | |||
background-repeat: repeat-x; | |||
} | |||
#right-navigation { | |||
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5) 30%, rgba(255, 255, 255, 1)); | |||
background-position: bottom left; | |||
background-repeat: repeat-x; | |||
} | |||
div.vectorTabs ul li, | |||
#p-variants, | |||
#p-cactions { | |||
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)); | |||
background-color: transparent; | |||
} | |||
div.vectorTabs li.selected { | |||
background-image:-webkit-linear-gradient(top, rgba(167, 215, 249, 0), rgba(167, 215, 249, .5) 30%, rgba(167, 215, 249, 1));/* rgba(167, 215, 249, 1) = #a7d7f9 */ | |||
background-color: transparent; | |||
} | |||
#p-variants-label, | |||
div.vectorTabs, | |||
div.vectorTabs span, | |||
div.vectorTabs ul, | |||
div#mw-head div.vectorMenu h3 { | |||
background-image: none; | |||
} | |||
#mw-head { | |||
top: -0.04em; | |||
width: 100.06%; | |||
} | |||
.goog-te-gadget { | |||
background-color: rgba(251,251,251,0.85)!important; | |||
} | |||
.comment-body textarea, .comment-preview { | |||
background: rgba(251,251,251,0.75); | |||
} | |||
.comment-toolbar { | |||
background: rgba(251,251,251,0.9); | |||
} | |||
</style> | |||
<!--{/if}--></includeonly> | |||