MediaWiki:Common.css
外观
注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5。
/****************************************************
* ✅ 次元企鹅百科 v5.5 — 轻萌系 UI 主题(最终稳定)
* 顶部渐变 + 干净 LOGO + 全站白框消除 + 图片稳定强化
****************************************************/
/* ==================================================
✅ 顶部渐变 Header 样式
================================================== */
.pg-header {
width: 100%;
background: linear-gradient(180deg, #e9f4ff 0%, #ffffff 80%);
padding: 50px 0 60px;
text-align: center;
border-radius: 0 0 22px 22px;
box-shadow: 0 4px 12px rgba(0,0,0,0.06);
margin-bottom: 30px;
}
.pg-header__inner {
max-width: 900px;
margin: 0 auto;
}
/* ✅✅✅ LOGO 卡片彻底清除(不再触发 figure)*/
.pg-header__logo {
background: none !important;
padding: 0 !important;
margin-bottom: 18px;
border-radius: 0 !important;
box-shadow: none !important;
display: inline-block;
}
/* ✅ 防止 VE 给 logo 图片自动加 max-width: 100% */
.pg-logo-img {
display: inline-block !important;
margin: 0 !important;
max-width: none !important;
}
/* 主标题 */
.pg-header__title {
font-size: 42px;
font-weight: 800;
color: #195a8d;
margin: 12px 0;
}
/* 副标题 */
.pg-header__subtitle {
color: #2b3a55;
font-size: 18px;
line-height: 1.8;
max-width: 750px;
margin: 0 auto;
}
/* 小脚印动画 */
.pg-header__prints {
margin-top: 16px;
font-size: 20px;
animation: pawFade 3.2s ease-in-out infinite;
}
@keyframes pawFade {
0%,100% { opacity: 0.2; }
50% { opacity: 1; }
}
/****************************************************
* ✅ 核心导航卡片
****************************************************/
.pg-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 20px;
max-width: 1100px;
margin: 20px auto;
padding: 0 15px;
}
.pg-card {
background: #ffffff;
padding: 20px 18px;
border-radius: 20px;
box-shadow: 0 4px 14px rgba(0,0,0,0.06);
text-align: center;
transition: .25s ease;
}
.pg-card:hover {
transform: translateY(-6px);
box-shadow: 0 10px 32px rgba(0,0,0,0.12);
}
.pg-card__icon { font-size: 32px; }
.pg-card__title { font-size: 20px; font-weight: 800; color: #185480; }
.pg-card__desc { margin-top: 6px; color: #67727e; font-size: 14.8px; }
.pg-card__link { margin-top: 10px; color: #007bba !important; font-weight: 700; }
/****************************************************
* ✅ 新番推荐区(封面卡片)
****************************************************/
.pg-gallery {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
gap: 20px;
max-width: 1100px;
margin: 25px auto;
padding: 0 15px;
}
.pg-cover-img {
border-radius: 16px !important;
transition: .25s ease;
max-width: none !important; /* ✅ 不受 VE 限制 */
}
.pg-cover-img:hover {
transform: scale(1.04);
box-shadow: 0 8px 22px rgba(0,0,0,0.15);
}
.pg-cover__title {
text-align: center;
margin-top: 8px;
font-weight: 700;
color: #2d3e50;
}
/****************************************************
* ✅ 关于本站
****************************************************/
.pg-about {
max-width: 900px;
margin: 30px auto 60px;
padding: 20px 10px;
color: #333;
font-size: 16px;
line-height: 1.9;
}
/****************************************************
* ✅ 首页移除 Vector-2022 灰色外框
****************************************************/
body.page-Main_Page .vector-feature-main,
body.page-Main_Page .vector-feature-body,
body.page-Main_Page .vector-main-container,
body.page-Main_Page #content,
body.page-Main_Page .mw-body,
body.page-Main_Page .mw-body-content,
body.page-Main_Page .vector-page-container {
background: transparent !important;
padding: 0 !important;
margin: 0 !important;
border: none !important;
box-shadow: none !important;
}
/* 防止首页第一段被解析成 pre */
body.page-Main_Page pre {
white-space: normal !important;
background: transparent !important;
padding: 0 !important;
border: none !important;
}
/****************************************************
* ✅ 首页自动图片框(thumb/figure)彻底移除
* ✅ 不影响文章内的正常图片
****************************************************/
body.page-Main_Page figure,
body.page-Main_Page .thumb,
body.page-Main_Page .thumbinner,
body.page-Main_Page .mw-file-element,
body.page-Main_Page .tleft,
body.page-Main_Page .tright,
body.page-Main_Page .mw-halign-left,
body.page-Main_Page .mw-halign-right {
display: none !important;
}