MediaWiki:Common.css

Baneq留言 | 贡献2026年6月3日 (三) 12:56的版本

注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的更改的影响。

  • Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5Ctrl-R(Mac为⌘-R
  • Google Chrome:Ctrl-Shift-R(Mac为⌘-Shift-R
  • Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5
/* Noblecraft homepage polish. Append after the current homepage CSS in MediaWiki:Common.css */

/* Keep polish scoped to the existing homepage pieces. */
.nc-stage,
.nc-cards {
	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
}

.nc-mascot {
	max-width: 1180px;
	margin: 0 auto 10px;
	text-align: center;
}

.nc-mascot img {
	max-width: min(560px, 88vw);
	height: auto;
	filter: drop-shadow(0 18px 28px rgba(45,52,68,.18));
}

/* A compact intro panel for the current homepage text area. */
.nc-home-intro {
	max-width: 1180px;
	margin: 8px auto 18px;
	padding: 20px 24px;
	background: rgba(255,255,255,.58);
	border: 1px solid rgba(255,255,255,.82);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 18px 42px -30px rgba(45,52,68,.55);
	backdrop-filter: blur(18px) saturate(135%);
	-webkit-backdrop-filter: blur(18px) saturate(135%);
}

.nc-home-intro h2 {
	margin-top: 0;
	border-bottom: 0;
	color: #24282f;
	font-size: 1.45rem;
	line-height: 1.35;
}

.nc-home-subtitle {
	margin: -4px 0 14px;
	color: #75808c;
	font-size: .96rem;
	font-weight: 700;
}

.nc-home-intro p {
	color: #4f5663;
	font-size: 1.02rem;
	line-height: 1.75;
}

.nc-home-meta {
	max-width: 1180px;
	margin: -4px auto 12px;
	padding: 10px 14px;
	background: rgba(255,255,255,.46);
	border: 1px solid rgba(210,216,222,.78);
	color: #56616d;
	font-size: .94rem;
	font-weight: 620;
	box-shadow: 0 10px 24px -24px rgba(45,52,68,.45);
}

.nc-home-meta a {
	color: #0f4c5c;
	font-weight: 800;
	text-decoration: none;
}

/* Make the original four-card layout feel more deliberate. */
.nc-cards {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin-top: 18px;
	align-items: stretch;
}

.nc-card {
	position: relative;
	min-width: 230px;
	min-height: 520px;
	border-color: rgba(225,229,234,.95);
	overflow: hidden;
	align-self: stretch;
}

.nc-card ul {
	padding-bottom: 84px !important;
}

.nc-card::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 6px;
	opacity: .42;
}

.nc-card-lobby::after { background: #d89038; }
.nc-card-play::after { background: #4c8fbd; }
.nc-card-comm::after { background: #8d62b8; }
.nc-card-apply::after { background: #c85c70; }

.nc-card-head {
	position: relative;
	padding: 14px 18px 13px;
	letter-spacing: 0;
}

.nc-card-head::after {
	content: "";
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: 0;
	height: 1px;
	background: rgba(255,255,255,.45);
}

.nc-card li a {
	position: relative;
	padding: 8px 18px 8px 28px;
	font-weight: 620;
}

.nc-card li a::before {
	content: "";
	position: absolute;
	left: 16px;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	background: #9aa4ad;
}

.nc-card li a:hover {
	padding-left: 32px;
	background: rgba(86,102,118,.12);
}

.nc-card li a:hover::before {
	background: #0f4c5c;
}

/* Softer status boxes if you keep {{成功}} near the top. */
.mw-parser-output .successbox,
.mw-parser-output .mw-message-box-success {
	border-color: #bdd8c8;
	background: rgba(246,252,248,.72);
}

/* Mobile: keep the mascot useful, not overwhelming. */
@media (max-width: 760px) {
	.nc-mascot img {
		max-width: min(360px, 86vw);
	}
	.nc-home-intro {
		padding: 16px;
	}
	.nc-home-intro h2 {
		font-size: 1.22rem;
	}
	.nc-card {
		min-width: 100%;
	}
}

@media (max-width: 1080px) {
	.nc-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 760px) {
	.nc-cards {
		grid-template-columns: 1fr;
	}
}