跳转到内容

MediaWiki:Common.css:修订间差异

来自家是本宇宙
WikiAdmin留言 | 贡献
???????????
WikiAdmin留言 | 贡献
无编辑摘要
 
(未显示同一用户的4个中间版本)
第1行: 第1行:
:root{--jsb-red:#b52e24;--jsb-green:#246044;--jsb-ink:#202122;--jsb-line:#c8ccd1}
/* Brand colors – light default, automatically adapt in dark mode */
body{background:#fff;color:var(--jsb-ink)}
:root {
.mw-page-container{background:#fff;border-color:var(--jsb-line);box-shadow:none}
  --jsb-red: #b52e24;
.mw-body h1,.mw-body h2,.mw-body h3{font-family:"Noto Serif SC","Songti SC","STSong",serif;color:var(--jsb-ink)}
  --jsb-green: #246044;
.mw-body h1{font-weight:700;letter-spacing:-.02em}.mw-body h2{border-color:var(--jsb-red)}
  --jsb-gold: #c69b4b;
a{color:var(--jsb-green)}a:hover{color:var(--jsb-red)}
}
.jsb-hero{margin:0 0 28px;padding:34px 30px;background:#fff;color:var(--jsb-ink);border:1px solid var(--jsb-line);border-top:5px solid var(--jsb-red)}
html.skin-theme-clientpref-night {
.jsb-kicker{font:700 .72rem monospace;color:var(--jsb-red);letter-spacing:.14em}.jsb-title{font:bold clamp(3rem,8vw,6rem)/1.05 "Noto Serif SC","Songti SC",serif;letter-spacing:-.06em;margin:.12em 0}.jsb-title span{color:var(--jsb-red)}.jsb-hero p{max-width:700px;font-size:1.08rem}.jsb-actions a{display:inline-block;color:var(--jsb-green);border:1px solid var(--jsb-green);padding:6px 12px;text-decoration:none}.jsb-actions a:hover{color:#fff;background:var(--jsb-green)}
  --jsb-red: #d94a3d;
.jsb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0}.jsb-card{padding:18px;background:#fff;border:1px solid var(--jsb-line);box-shadow:none}.jsb-card>b{color:var(--jsb-red);font:700 .75rem monospace}.jsb-card h2{border:0;margin:.2em 0!important}.jsb-portals,.jsb-relation,.jsb-note{padding:16px 20px;margin:18px 0;border:1px solid var(--jsb-line);background:#fff}.jsb-relation{border-left:4px solid var(--jsb-green);line-height:1.9}.jsb-note{border-left:4px solid #c69b4b;background:#fffdf7}.jsb-infobox{float:right;width:290px;margin:0 0 20px 22px;background:#fff;border:1px solid var(--jsb-line);box-shadow:none}.jsb-infobox-title{background:#f8f9fa;color:var(--jsb-ink);font:bold 1.4rem serif!important;border-bottom:3px solid var(--jsb-red)}.jsb-infobox>div{padding:10px 14px;border-bottom:1px solid var(--jsb-line)}.jsb-infobox small{display:block;color:#54595d;font:700 .7rem monospace}.jsb-table th{background:#f8f9fa;color:var(--jsb-ink);border-bottom:2px solid var(--jsb-green)}.wikitable{background:#fff;border-color:var(--jsb-line)}
  --jsb-green: #3a8a66;
@media(max-width:720px){.jsb-grid{grid-template-columns:1fr}.jsb-infobox{float:none;width:auto;margin:0 0 20px}.jsb-hero{padding:26px 20px}.jsb-title{font-size:18vw}}
  --jsb-gold: #d4a84c;
}
 
/* Base layout – use Vector theme variables */
body {
  background: var(--background-color-base);
  color: var(--color-base);
}
.mw-page-container {
  background: var(--background-color-base);
  border-color: var(--border-color-subtle);
  box-shadow: none;
}
 
/* Typography */
.mw-body h1,
.mw-body h2,
.mw-body h3 {
  font-family: "Noto Serif SC", "Songti SC", "STSong", serif;
  color: var(--color-base);
}
.mw-body h1 { font-weight: 700; letter-spacing: -.02em; }
.mw-body h2 { border-color: var(--jsb-red); }
 
/* Links */
a { color: var(--jsb-green); }
a:hover { color: var(--jsb-red); }
 
/* ── Hero ── */
.jsb-hero {
  margin: 0 0 28px;
  padding: 34px 30px;
  background: var(--background-color-base);
  color: var(--color-base);
  border: 1px solid var(--border-color-subtle);
  border-top: 5px solid var(--jsb-red);
}
.jsb-kicker {
  font: 700 1rem monospace;
  color: var(--jsb-red);
  letter-spacing: .14em;
}
.jsb-title {
  font: bold clamp(3rem, 8vw, 6rem)/1.05 "Noto Serif SC", "Songti SC", serif;
  letter-spacing: -.06em;
  margin: .12em 0;
}
.jsb-title span { color: var(--jsb-red); }
.jsb-hero p { max-width: 700px; font-size: 1.08rem; }
.jsb-actions a {
  display: inline-block;
  color: var(--jsb-green);
  border: 1px solid var(--jsb-green);
  padding: 6px 12px;
  text-decoration: none;
}
.jsb-actions a:hover {
  color: var(--color-inverted-fixed);
  background: var(--jsb-green);
}
 
/* ── Card grid ── */
.jsb-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 22px 0;
}
.jsb-card {
  padding: 18px;
  background: var(--background-color-base);
  border: 1px solid var(--border-color-subtle);
  box-shadow: none;
}
.jsb-card > b {
  color: var(--jsb-red);
  font: 700 1rem monospace;
}
.jsb-card h2 { border: 0; margin: .2em 0 !important; }
 
/* ── Portals / relation / note ── */
.jsb-portals,
.jsb-relation,
.jsb-note {
  padding: 16px 20px;
  margin: 18px 0;
  border: 1px solid var(--border-color-subtle);
  background: var(--background-color-base);
}
.jsb-relation {
  border-left: 4px solid var(--jsb-green);
  line-height: 1.9;
}
.jsb-note {
  border-left: 4px solid var(--jsb-gold);
  background: var(--background-color-base);
}
html.skin-theme-clientpref-night .jsb-note {
  background: #1c1610;
}
 
/* ── Infobox ── */
.jsb-infobox {
  float: right;
  width: 290px;
  margin: 0 0 20px 22px;
  background: var(--background-color-base);
  border: 1px solid var(--border-color-subtle);
  box-shadow: none;
}
.jsb-infobox-title {
  background: var(--background-color-interactive-subtle);
  color: var(--color-base);
  font: bold 1.4rem serif !important;
  border-bottom: 3px solid var(--jsb-red);
}
.jsb-infobox > div {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border-color-subtle);
}
.jsb-infobox small {
  display: block;
  color: var(--color-base--subtle);
  font: 700 1rem monospace;
}
 
/* ── Tables ── */
.jsb-table th {
  background: var(--background-color-interactive-subtle);
  color: var(--color-base);
  border-bottom: 2px solid var(--jsb-green);
}
.wikitable {
  background: var(--background-color-base);
  border-color: var(--border-color-subtle);
}
 
/* ── Evidence & source notices ── */
.jsb-evidence,
.jsb-source-note {
  margin: 1em 0;
  padding: .75em 1em;
  border: 1px solid var(--border-color-subtle);
  background: var(--background-color-base);
}
.jsb-evidence { border-left: 4px solid var(--jsb-green); }
.jsb-source-note {
  font-size: 1rem;
  color: var(--color-base--subtle);
}
 
/* ── Responsive ── */
@media (max-width: 720px) {
  .jsb-grid { grid-template-columns: 1fr; }
  .jsb-infobox { float: none; width: auto; margin: 0 0 20px; }
  .jsb-hero { padding: 26px 20px; }
  .jsb-title { font-size: 18vw; }
}

2026年7月14日 (二) 12:43的最新版本

/* Brand colors – light default, automatically adapt in dark mode */
:root {
  --jsb-red: #b52e24;
  --jsb-green: #246044;
  --jsb-gold: #c69b4b;
}
html.skin-theme-clientpref-night {
  --jsb-red: #d94a3d;
  --jsb-green: #3a8a66;
  --jsb-gold: #d4a84c;
}

/* Base layout – use Vector theme variables */
body {
  background: var(--background-color-base);
  color: var(--color-base);
}
.mw-page-container {
  background: var(--background-color-base);
  border-color: var(--border-color-subtle);
  box-shadow: none;
}

/* Typography */
.mw-body h1,
.mw-body h2,
.mw-body h3 {
  font-family: "Noto Serif SC", "Songti SC", "STSong", serif;
  color: var(--color-base);
}
.mw-body h1 { font-weight: 700; letter-spacing: -.02em; }
.mw-body h2 { border-color: var(--jsb-red); }

/* Links */
a { color: var(--jsb-green); }
a:hover { color: var(--jsb-red); }

/* ── Hero ── */
.jsb-hero {
  margin: 0 0 28px;
  padding: 34px 30px;
  background: var(--background-color-base);
  color: var(--color-base);
  border: 1px solid var(--border-color-subtle);
  border-top: 5px solid var(--jsb-red);
}
.jsb-kicker {
  font: 700 1rem monospace;
  color: var(--jsb-red);
  letter-spacing: .14em;
}
.jsb-title {
  font: bold clamp(3rem, 8vw, 6rem)/1.05 "Noto Serif SC", "Songti SC", serif;
  letter-spacing: -.06em;
  margin: .12em 0;
}
.jsb-title span { color: var(--jsb-red); }
.jsb-hero p { max-width: 700px; font-size: 1.08rem; }
.jsb-actions a {
  display: inline-block;
  color: var(--jsb-green);
  border: 1px solid var(--jsb-green);
  padding: 6px 12px;
  text-decoration: none;
}
.jsb-actions a:hover {
  color: var(--color-inverted-fixed);
  background: var(--jsb-green);
}

/* ── Card grid ── */
.jsb-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 22px 0;
}
.jsb-card {
  padding: 18px;
  background: var(--background-color-base);
  border: 1px solid var(--border-color-subtle);
  box-shadow: none;
}
.jsb-card > b {
  color: var(--jsb-red);
  font: 700 1rem monospace;
}
.jsb-card h2 { border: 0; margin: .2em 0 !important; }

/* ── Portals / relation / note ── */
.jsb-portals,
.jsb-relation,
.jsb-note {
  padding: 16px 20px;
  margin: 18px 0;
  border: 1px solid var(--border-color-subtle);
  background: var(--background-color-base);
}
.jsb-relation {
  border-left: 4px solid var(--jsb-green);
  line-height: 1.9;
}
.jsb-note {
  border-left: 4px solid var(--jsb-gold);
  background: var(--background-color-base);
}
html.skin-theme-clientpref-night .jsb-note {
  background: #1c1610;
}

/* ── Infobox ── */
.jsb-infobox {
  float: right;
  width: 290px;
  margin: 0 0 20px 22px;
  background: var(--background-color-base);
  border: 1px solid var(--border-color-subtle);
  box-shadow: none;
}
.jsb-infobox-title {
  background: var(--background-color-interactive-subtle);
  color: var(--color-base);
  font: bold 1.4rem serif !important;
  border-bottom: 3px solid var(--jsb-red);
}
.jsb-infobox > div {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border-color-subtle);
}
.jsb-infobox small {
  display: block;
  color: var(--color-base--subtle);
  font: 700 1rem monospace;
}

/* ── Tables ── */
.jsb-table th {
  background: var(--background-color-interactive-subtle);
  color: var(--color-base);
  border-bottom: 2px solid var(--jsb-green);
}
.wikitable {
  background: var(--background-color-base);
  border-color: var(--border-color-subtle);
}

/* ── Evidence & source notices ── */
.jsb-evidence,
.jsb-source-note {
  margin: 1em 0;
  padding: .75em 1em;
  border: 1px solid var(--border-color-subtle);
  background: var(--background-color-base);
}
.jsb-evidence { border-left: 4px solid var(--jsb-green); }
.jsb-source-note {
  font-size: 1rem;
  color: var(--color-base--subtle);
}

/* ── Responsive ── */
@media (max-width: 720px) {
  .jsb-grid { grid-template-columns: 1fr; }
  .jsb-infobox { float: none; width: auto; margin: 0 0 20px; }
  .jsb-hero { padding: 26px 20px; }
  .jsb-title { font-size: 18vw; }
}