MediaWiki:Common.css:修订间差异
imported>=海豚= |
imported>=海豚= 无编辑摘要 |
||
| 第1行: | 第1行: | ||
/* | /* | ||
* | * 放置于这里的CSS将应用于所有皮肤 | ||
* | * 请尊重版权,以下代码除非注明均是管理员手敲出来的!!!复制需要注明源自H萌娘,并且附上URL地址http://www.hmoegirl.com/MediaWiki:Common.css | ||
* 版权协定:知识共享 署名-非商业性使用-相同方式共享 3.0 | * 版权协定:知识共享 署名-非商业性使用-相同方式共享 3.0 | ||
* | * 复制之后请把图片换成自己网站上URL地址! | ||
*/ | */ | ||
/* | /* | ||
* | * vector界面、主标题字体定制,参考Github添加了Emoji支持 | ||
* | * 更改后要同步到 [[MediaWiki:Gadget-GothicMoe.css]] | ||
*/ | */ | ||
body, | |||
#firstHeading { | |||
font-family: BlinkMacSystemFont, -apple-system, "Helvetica Neue", Tahoma, Arial, "PingFang SC", "Microsoft YaHei", \5fae\8f6f\96c5\9ed1, "Hiragino Sans GB", "WenQuanYi Micro Hei", "Microsoft JhengHei", 微軟正黑體, sans-serif; | |||
} | |||
/*懒加载渐入*/ | |||
.lazyload, | |||
.lazyloading { | |||
opacity: 0; | |||
} | |||
.lazyloaded { | |||
opacity: 1; | |||
transition: opacity 300ms; | |||
} | } | ||
/* 侧边栏、顶部栏 */ | /* 侧边栏、顶部栏 */ | ||
| 第42行: | 第43行: | ||
.clear-div { | .clear-div { | ||
clear: both; | clear: both; | ||
} | } | ||
/* 副标题 */ | /* 副标题 */ | ||
| 第61行: | 第52行: | ||
text-align: right; | text-align: right; | ||
} | } | ||
/* | /* 标题加粗 */ | ||
div# | h1 { | ||
font-weight: 700; | |||
} | |||
h2 { | |||
font-weight: 700; | |||
} | |||
/* 右上通知处奇怪的数字移除 */ | |||
#pt-notifications-alert .mw-echo-notifications-badge, | |||
#pt-notifications-notice .mw-echo-notifications-badge { | |||
text-indent: -99999px; | |||
} | |||
#pt-notifications-alert .mw-echo-notifications-badge:after, | |||
#pt-notifications-notice .mw-echo-notifications-badge:after { | |||
text-indent: 0; | |||
} | |||
/* 对齐搜索按钮 */ | |||
div#simpleSearch button#searchButton { | |||
padding-top: .1em; | |||
padding-bottom: .2em; | |||
padding-right: .1em; | |||
} | |||
/* 被点过的外部链接不变色。采取和默认皮肤相同写法,以便override */ | |||
.mw-body a.external:visited { | |||
color: #36b; | color: #36b; | ||
} | } | ||
| 第69行: | 第83行: | ||
margin-right: 3px; | margin-right: 3px; | ||
} | } | ||
/* Extension:MultimediaViewer的半透明化修改 */ | |||
/* | .mw-mmv-overlay { | ||
. | position: fixed; | ||
top: 0; | |||
left: 0; | |||
right: 0; | |||
bottom: 0; | |||
background-color: rgba(0,0,0,0.8); | |||
opacity: 0.73; | |||
} | |||
body.mediawiki.mw-mmv-lightbox-open #mw-page-base, | |||
body.mediawiki.mw-mmv-lightbox-open #mw-head-base, | |||
body.mediawiki.mw-mmv-lightbox-open #mw-navigation, | |||
body.mediawiki.mw-mmv-lightbox-open #content, | |||
body.mediawiki.mw-mmv-lightbox-open #footer, | |||
body.mediawiki.mw-mmv-lightbox-open #globalWrapper { | |||
display: inherit; | |||
} | |||
body.mediawiki.mw-mmv-lightbox-open > * { | |||
display: inherit; | |||
} | |||
body.mediawiki.mw-mmv-lightbox-open > script, | |||
body.mediawiki.mw-mmv-lightbox-open > style { | |||
display: none; | |||
} | |||
body.mediawiki.mw-mmv-lightbox-open { | |||
overflow: hidden; | |||
} | |||
body .mw-mmv-wrapper { | |||
position: fixed; | |||
} | |||
/* mutilmediaViewer 信息栏修复 */ | |||
.mw-mmv-image-metadata-column.mw-mmv-image-metadata-desc-column { | |||
width: 30%; | |||
} | |||
.mw-mmv-image-metadata-column.mw-mmv-image-metadata-links-column { | |||
width: 70%; | |||
max-width: 70%; | |||
} | } | ||
. | ul.mw-mmv-image-links li { | ||
float: left; | |||
padding: | padding: .3em 1em; | ||
} | } | ||
. | div.mw-mmv-image-desc-div, | ||
div.mw-mmv-image-links-div{ | |||
display:block | |||
} | } | ||
. | div.metadata-panel-is-closed .mw-mmv-image-links li.mw-mmv-license-li { | ||
height:inherit; | |||
line-height:inherit; | |||
} | } | ||
. | /* 通用圆角框 */ | ||
.common-box { | |||
padding: .2em .4em; | |||
border: 1px solid #ddd; | border: 1px solid #ddd; | ||
border- | -moz-border-radius: 10px; | ||
-webkit-border-radius: 10px; | |||
-khtml-border-radius: 10px; | |||
-o-border-radius: 10px; | |||
-webkit-box-shadow: #666 0 2px 3px; | |||
-moz-box-shadow: #666 0 2px 3px; | |||
border-radius: 10px; | |||
box-shadow: #666 0 2px 3px; | |||
} | } | ||
/* 数据表格 */ | /* 数据表格 */ | ||
| 第107行: | 第153行: | ||
word-wrap: break-word; | word-wrap: break-word; | ||
} | } | ||
/* | /* 隐藏首页标题、空行、分类、讨论、查看源代码tab */ | ||
.page-Mainpage h1.firstHeading, | .page-Mainpage h1.firstHeading, | ||
.page-Mainpage #siteSub, | .page-Mainpage #siteSub, | ||
.page-Mainpage #contentSub, | .page-Mainpage #contentSub, | ||
.page-Mainpage li#ca-viewsource, | .page-Mainpage li#ca-viewsource, | ||
.page-Mainpage li#ca-talk { | .page-Mainpage li#ca-talk, | ||
.page-Mainpage #catlinks { | |||
display: none; | display: none; | ||
} | } | ||
/* 黑幕模板配合CSS */ | /* 黑幕模板配合CSS */ | ||
/* 把这几行单独拎出来写,否则会被Firefox合并到“.heimu a”这条规则,然后又被上面的“点过外链不变色”规则override */ | /* 把这几行单独拎出来写,否则会被Firefox合并到“.heimu a”这条规则,然后又被上面的“点过外链不变色”规则override */ | ||
| 第135行: | 第181行: | ||
body:not(.heimu_toggle_on) .heimu:active, | body:not(.heimu_toggle_on) .heimu:active, | ||
body:not(.heimu_toggle_on) .heimu.off { | body:not(.heimu_toggle_on) .heimu.off { | ||
transition: color .13s linear; | |||
color: white; | color: white; | ||
} | } | ||
| 第141行: | 第188行: | ||
body:not(.heimu_toggle_on) .heimu.off a, | body:not(.heimu_toggle_on) .heimu.off a, | ||
body:not(.heimu_toggle_on) a:hover .heimu.off { | body:not(.heimu_toggle_on) a:hover .heimu.off { | ||
transition: color .13s linear; | |||
color: lightblue; | color: lightblue; | ||
} | } | ||
| 第149行: | 第197行: | ||
body:not(.heimu_toggle_on) .heimu.off .new:hover, | body:not(.heimu_toggle_on) .heimu.off .new:hover, | ||
body:not(.heimu_toggle_on) .new:hover .heimu.off { | body:not(.heimu_toggle_on) .new:hover .heimu.off { | ||
transition: color .13s linear; | |||
color: #BA0000; | color: #BA0000; | ||
} | |||
/* 目录样式 */ | |||
#toc{ | |||
padding: 0.8em; | |||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.12); | |||
border-radius: 10px; | |||
overflow: hidden; | |||
border: 1px solid #ddd; | |||
background: rgba(250,250,250,0.9); | |||
} | |||
/* 导航条(完全没有apple风格的apple风面包屑orz) 来源:http://www.jankoatwarpspeed.com/examples/breadcrumb/ */ | |||
#breadcrumb { | |||
background-image: url(//img.moegirl.org/breadcrumb/bc_bg.png); | |||
color: red; | |||
border: solid 1px #cacaca; | |||
border-radius: 10px; | |||
overflow: hidden; | |||
} | |||
#breadcrumb span { | |||
float: left; | |||
padding-left: 10px; | |||
} | |||
#breadcrumb a { | |||
display: block; | |||
background: url(//img.moegirl.org/breadcrumb/bc_separator.png) no-repeat right; | |||
padding-right: 15px; | |||
color: #454545; | |||
} | |||
#breadcrumb a:hover { | |||
color: #35acc5; | |||
} | |||
/* info类模板 */ | |||
.infobox { | |||
margin:0 auto; | |||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.10); | |||
border-radius: 5px; | |||
overflow: hidden; | |||
border: 0.5px solid #ddd; | |||
} | |||
.infobox2 { | |||
margin-top: 0.4em ; | |||
margin-left: 1em; | |||
padding: 0.2em; | |||
float: right; | |||
clear: right; | |||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); | |||
border-radius: 4px; | |||
overflow: hidden; | |||
background: rgba(251,251,251,0.8); | |||
} | |||
.infoBoxTitle { | |||
margin: 3px auto; | |||
padding: 0; | |||
text-align: center; | |||
font-weight: 700; | |||
} | |||
.infoBoxIcon { | |||
display: table-cell; | |||
padding: 2px 0 2px .5em; | |||
vertical-align: middle; | |||
} | |||
.infoBoxText { | |||
display: table-cell; | |||
padding: .25em .5em .25em 1.3em; | |||
width: 100%; | |||
vertical-align: middle; | |||
} | |||
.infoBoxContent { | |||
padding: 0.6em; | |||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); | |||
border-radius: 5px; | |||
overflow: hidden; | |||
border: 1px solid #ddd; | |||
background: rgba(251,251,251,0.8); | |||
} | |||
.infoBoxBelow { | |||
margin: 0 auto; | |||
padding: 0; | |||
text-align: center; | |||
} | |||
.infoBoxYellow { | |||
padding: 0.5em; | |||
background: rgba(255,255,245,0.8); | |||
} | |||
.infoBoxRed { | |||
padding: 0.5em; | |||
background: rgba(258,240,245,0.8); | |||
} | |||
.infoBoxBlue { | |||
padding: 0.4em; | |||
background: rgba(240,248,255,0.8); | |||
} | |||
.infoBoxPurple { | |||
padding: 0.4em; | |||
background: rgba(248,248,255,0.8); | |||
} | |||
.infoBoxGreen { | |||
padding: 0.5em; | |||
background: rgba(245,255,250,0.8); | |||
} | |||
.infoBoxOrange { | |||
padding: 0.5em; | |||
background: rgba(250,240,230,0.8); | |||
} | } | ||
/*热门评论*/ | |||
.comment-container-top>div:not(.comment-thread) { | |||
background-color: rgba(244, 196, 48, 0.8) !important; | |||
color: white !important; | |||
font-weight: bolder !important; | |||
} | |||
.comment-thread.comment-popular { | |||
background-color: rgba(244, 196, 48, 0.05) !important; | |||
} | |||
/* wikitable MD化 */ | |||
table.wikitable { | |||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); | |||
border-radius: 4px; | |||
background-color: rgba(251,251,251,0.8) !important; | |||
overflow: hidden; | |||
} | |||
/* 回到顶部 */ | /* 回到顶部 */ | ||
.backToTop { | .backToTop { | ||
| 第171行: | 第338行: | ||
opacity: .6; | opacity: .6; | ||
filter: Alpha(opacity=60); | filter: Alpha(opacity=60); | ||
z-index: 73; | |||
} | } | ||
/* | .mw-mmv-lightbox-open .backToTop { | ||
display: none !important; | |||
} | |||
/* 信息模板的css */ | |||
.infotemplatebox { | .infotemplatebox { | ||
float: right; | float: right; | ||
| 第183行: | 第354行: | ||
word-break: break-all; | word-break: break-all; | ||
clear: right; | clear: right; | ||
} | } | ||
/* 编辑区样式 */ | /* 编辑区样式 */ | ||
| 第223行: | 第378行: | ||
/* 页面底部导航框(2011年8月16日引自中文维基)(所谓大家族模板) */ | /* 页面底部导航框(2011年8月16日引自中文维基)(所谓大家族模板) */ | ||
table.navbox { | table.navbox { | ||
border: 1px solid #aaa; | |||
clear: both; | clear: both; | ||
margin: auto; | margin: auto; | ||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); | |||
padding: 1px; | padding: 1px; | ||
text-align: center; | text-align: center; | ||
| 第280行: | 第436行: | ||
.navbox .collapseButton { | .navbox .collapseButton { | ||
width: 6em; | width: 6em; | ||
} | |||
/* Fix by case : Rev 1327309 ([[Special:Permalink/1327309]]) | |||
Address alignment issue of nested tabs in Navbox */ | |||
.navbox .TabLabel { | |||
text-align: left; | |||
} | } | ||
/* Tabs */ | /* Tabs */ | ||
.tab .TabLabelText { | .tab .TabLabelText { | ||
border-top: 3px solid transparent; | |||
padding: 1px; | padding: 1px; | ||
background: #fff; | |||
border-left: 1px solid transparent; | |||
border-right: 1px solid transparent; | |||
cursor: pointer; | cursor: pointer; | ||
flex: none; | |||
} | } | ||
.tab .TabLabel { | .tab .TabLabel { | ||
| 第295行: | 第460行: | ||
-o-user-select: none; | -o-user-select: none; | ||
user-select: none; | user-select: none; | ||
display: flex; | |||
flex-wrap: wrap; | |||
} | } | ||
.tab .TabLabelText.selected { | .tab .TabLabelText.selected { | ||
| 第331行: | 第498行: | ||
.sysop-show, | .sysop-show, | ||
.accountcreator-show { | .accountcreator-show { | ||
display: none; | display: none !important; | ||
} | } | ||
/* wikitable green */ | /* wikitable green */ | ||
| 第357行: | 第524行: | ||
body.ns-2 div#catlinks { | body.ns-2 div#catlinks { | ||
display: none !important; | display: none !important; | ||
} | |||
/* 仅手机版显示支持 */ | |||
.mobileonly { | |||
display: none !important; | |||
} | |||
/* 编辑请求 */ | |||
.editRequest { | |||
text-align: center; | |||
border: 1px solid #ddd; | |||
border-radius: 3px; | |||
margin:1em 2.5em; | |||
padding: 1em; | |||
background: white; | |||
} | |||
.editRequest .newComment { | |||
white-space: nowrap; | |||
background: #347bff; | |||
color: #fff; | |||
border: 1px solid #347bff; | |||
text-shadow: 0 1px rgba(0,0,0,0.1); | |||
font-family: inherit; | |||
font-size: 1em; | |||
min-width: 4em; | |||
max-width: 28.75em; | |||
padding: .5em 1em; | |||
margin: 0; | |||
border-radius: 2px; | |||
-webkit-box-sizing: border-box; | |||
-moz-box-sizing: border-box; | |||
box-sizing: border-box; | |||
-webkit-appearance: none; | |||
zoom: 1; | |||
vertical-align: middle; | |||
text-align: center; | |||
font-weight: bold; | |||
cursor: pointer; | |||
} | |||
/* 注释里的列表 */ | |||
.reference-text > ul.listInRef, | |||
.reference-text > ol.listInRef { | |||
margin: -1.5em 0 0 2em; | |||
} | } | ||
/* | /* | ||
| 第549行: | 第757行: | ||
margin-left: 52%; | margin-left: 52%; | ||
} | } | ||
} | |||
/* | |||
* 感谢[[萌百:User:Great Brightstar]]的贡献,源码来自[[special:diff/834104]] | |||
* 以下是原注释: | |||
* 在这里使用 font-feature-settings 属性会让使用“lang”标签的元素强制使用 OpenType 技术显示本地化的变体字(通过激活 locl 标签,即便浏览器本身不直接激活)。 | |||
* 如果你使用思源黑体(非 CN、JP、KO、TW 版)、Noto Sans CJK 显示文字的话就有可能看到效果。 | |||
* 关于上述这个 CSS 属性的用法,参阅:https://developer.mozilla.org/en-US/docs/Web/CSS/font-feature-settings 注意:此文引用的 OpenType Feature Tags list 同样需要关注。 | |||
* 如有任何问题请即刻禁用之 | |||
* Nbdd0121: 将原来的[lang]改为span[lang],这样就不会影响非{{lang}}的[lang]了 (e.g. div#mw-content-text) | |||
*/ | |||
span[lang] { | |||
font-family: initial; | |||
font-feature-settings: "locl" on; | |||
-webkit-font-feature-settings: "locl" on; | |||
} | |||
[style*="font"] span[lang] { | |||
font-family: inherit; | |||
} | |||
/* 日语斜体 */ | |||
@font-face { | |||
font-family: JapaneseItalic; | |||
src: local(meiryo); | |||
} | |||
i span[lang=ja i], | |||
span[lang=ja i] i, | |||
[style*=italic i] span[lang=ja i], | |||
span[lang=ja i] [style*=italic i] { | |||
font-family: JapaneseItalic; | |||
} | |||
[style*="font"] i span[lang=ja i], | |||
[style*="font"] span[lang=ja i] i, | |||
[style*="font"] [style*=italic i] span[lang=ja i], | |||
[style*="font"] span[lang=ja i] [style*=italic i] { | |||
font-family: inherit; | |||
} | |||
/* 折叠表格的定位处理 | |||
body:not(.ns--1):not(.ns--2) .mw-collapsible > tbody > tr:first-child > th:last-child { | |||
position: relative; | |||
padding-right: 0; | |||
} | |||
body:not(.ns--1):not(.ns--2) .mw-collapsible:not(.mw-collapsed) > tbody > tr:first-child > th:last-child { | |||
position: relative; | |||
padding-left: 4em; | |||
padding-right: 4em; | |||
} | |||
body:not(.ns--1):not(.ns--2) .mw-collapsible > tbody > tr:first-child > th:last-child > .mw-collapsible-toggle { | |||
margin: 0 .5em; | |||
} | |||
body:not(.ns--1):not(.ns--2) .mw-collapsible:not(.mw-collapsed) > tbody > tr:first-child > th:last-child > .mw-collapsible-toggle { | |||
position: absolute; | |||
right: .5em; | |||
top: .15em; | |||
float: none; | |||
margin: 0; | |||
} */ | |||
/* 大家族模板下折叠表格的定位处理 | |||
body:not(.ns--1):not(.ns--2) .navbox .mw-collapsible > tbody > tr:first-child > th:last-child { | |||
position: relative; | |||
padding-right: 0; | |||
padding-left: 0; | |||
} | |||
body:not(.ns--1):not(.ns--2) .navbox .mw-collapsible .mw-collapsible-toggle { | |||
margin-left: 0; | |||
} | |||
body:not(.ns--1):not(.ns--2) .navbox .mw-collapsible > tbody > tr:first-child > th:last-child > [style*="float:left"] { | |||
position: absolute; | |||
left: 1em; | |||
top: 0; | |||
float: none; | |||
} | |||
body:not(.ns--1):not(.ns--2) .navbox .mw-collapsible > tbody > tr:first-child > th:last-child > .mw-collapsible-toggle { | |||
position: absolute; | |||
right: 1em; | |||
top: 0; | |||
float: none; | |||
margin-left: 0; | |||
} | |||
body:not(.ns--1):not(.ns--2) .navbox .mw-collapsible:not(.mw-collapsed) > tbody > tr:first-child > th:last-child > .mw-collapsible-toggle:last-child { | |||
position: static; | |||
float: right; | |||
margin-right: -3.5em; | |||
} */ | |||
/* wikitable 的 caption */ | |||
.wikitable.mw-collapsible caption { | |||
border: 1px solid rgba(170, 170, 170, 0.37); | |||
border-bottom-width: 0; | |||
background-color: rgb(249,249,249); | |||
} | |||
.wikitable.mw-collapsible.mw-collapsed caption { | |||
border-bottom-width: 1px; | |||
} | |||
/* vectorMenu 的排序 */ | |||
div.vectorMenu ul { | |||
display: flex; | |||
flex-flow: column; | |||
} | |||
/* 分类页同开头的页面的列表不分段 */ | |||
.mw-category-group { | |||
-webkit-column-break-inside: avoid; | |||
page-break-inside: avoid; | |||
break-inside: avoid; | |||
} | |||
.mw-category-group:nth-child(1):nth-last-child(1), /* 只有一个列表时 */ | |||
.mw-category-group:nth-child(1):nth-last-child(2), /* 只有两个列表时 */ | |||
.mw-category-group:nth-child(2):nth-last-child(1) { /* 只有两个列表时 */ | |||
-webkit-column-break-inside: auto; | |||
page-break-inside: auto; | |||
break-inside: auto; | |||
} | } | ||
/* R18模板 */ | /* R18模板 */ | ||