MediaWiki:Common.css:修订间差异
无编辑摘要 标签:已被回退 |
无编辑摘要 标签:已被回退 |
||
| 第160行: | 第160行: | ||
/* Noblecraft homepage | /* Noblecraft homepage polish. Append after the current homepage CSS in MediaWiki:Common.css */ | ||
.nc- | |||
/* Keep polish scoped to the existing homepage pieces. */ | |||
.nc-stage, | |||
.nc-cards { | |||
max-width: 1180px; | max-width: 1180px; | ||
margin: | margin-left: auto; | ||
margin-right: auto; | |||
} | } | ||
. | /* A compact intro panel for the current homepage text area. */ | ||
.nc-home-intro { | |||
max-width: 1180px; | |||
margin: 8px auto 18px; | |||
.nc- | padding: 20px 24px; | ||
background: rgba(255,255,255,.58); | |||
margin: 8px | |||
padding: | |||
background: rgba(255,255,255,. | |||
border: 1px solid rgba(255,255,255,.82); | border: 1px solid rgba(255,255,255,.82); | ||
box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 18px | box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 18px 42px -30px rgba(45,52,68,.55); | ||
backdrop-filter: blur( | backdrop-filter: blur(18px) saturate(135%); | ||
-webkit-backdrop-filter: blur( | -webkit-backdrop-filter: blur(18px) saturate(135%); | ||
} | } | ||
.nc- | .nc-home-intro h2 { | ||
margin-top: 0; | |||
border-bottom: 0; | |||
color: #24282f; | color: #24282f; | ||
font-size: | font-size: 1.45rem; | ||
line-height: 1.35; | |||
line-height: 1. | |||
} | } | ||
.nc- | .nc-home-intro p { | ||
color: #4f5663; | color: #4f5663; | ||
font-size: 1. | font-size: 1.02rem; | ||
line-height: 1. | line-height: 1.75; | ||
} | } | ||
.nc- | .nc-home-actions { | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; | flex-wrap: wrap; | ||
gap: 10px; | gap: 10px; | ||
margin-top: | margin-top: 14px; | ||
} | } | ||
.nc- | .nc-home-actions a { | ||
display: inline-flex; | display: inline-flex; | ||
align-items: center; | align-items: center; | ||
min-height: 34px; | |||
padding: 0 14px; | |||
background: rgba(255,255,255,.74); | |||
border: 1px solid #cbd3d8; | border: 1px solid #cbd3d8; | ||
color: #27313b !important; | |||
color: #27313b; | |||
font-weight: 700; | font-weight: 700; | ||
box-shadow: 0 8px | text-decoration: none !important; | ||
box-shadow: 0 8px 18px -16px rgba(20,30,45,.55); | |||
transition: transform .15s ease, background .15s ease, border-color .15s ease; | transition: transform .15s ease, background .15s ease, border-color .15s ease; | ||
} | } | ||
.nc- | .nc-home-actions a:first-child { | ||
background: #0f4c5c; | |||
border-color: #0f4c5c; | |||
color: #fff !important; | |||
} | |||
.nc-home-actions a:hover { | |||
transform: translateY(-1px); | transform: translateY(-1px); | ||
background: #fff; | background: #fff; | ||
| 第235行: | 第229行: | ||
} | } | ||
.nc- | .nc-home-actions a:first-child:hover { | ||
background: #123f4c; | background: #123f4c; | ||
border-color: #123f4c; | border-color: #123f4c; | ||
} | } | ||
/* Make the original four-card layout feel more deliberate. */ | |||
.nc-cards { | |||
. | |||
.nc- | |||
gap: 16px; | gap: 16px; | ||
margin-top: 18px; | |||
} | } | ||
.nc | .nc-card { | ||
min-width: 230px; | |||
border | border-color: rgba(225,229,234,.95); | ||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
.nc- | .nc-card-head { | ||
position: relative; | |||
padding: 14px 18px 13px; | |||
letter-spacing: 0; | |||
padding: 13px | |||
} | } | ||
.nc- | .nc-card-head::after { | ||
content: ""; | |||
position: absolute; | |||
left: 18px; | |||
right: 18px; | |||
bottom: 0; | |||
height: 1px; | |||
background: rgba(255,255,255,.45); | |||
} | } | ||
.nc | .nc-card li a { | ||
position: relative; | |||
padding: | padding: 8px 18px 8px 28px; | ||
font-weight: 620; | font-weight: 620; | ||
} | } | ||
.nc | .nc-card li a::before { | ||
content: ""; | |||
position: absolute; | |||
left: 16px; | |||
top: 50%; | |||
width: 4px; | |||
height: 4px; | |||
margin-top: -2px; | |||
background: #9aa4ad; | |||
} | } | ||
.nc- | .nc-card li a:hover { | ||
padding-left: 32px; | |||
background: rgba(86,102,118,.12); | |||
} | } | ||
.nc- | .nc-card li a:hover::before { | ||
background: #0f4c5c; | |||
background | |||
} | } | ||
/* 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) { | @media (max-width: 760px) { | ||
.nc- | .nc-home-intro { | ||
padding: 16px; | |||
padding: | |||
} | } | ||
.nc- | .nc-home-intro h2 { | ||
font-size: 1. | font-size: 1.22rem; | ||
} | } | ||
.nc- | .nc-home-actions a { | ||
width: 100%; | |||
justify-content: center; | |||
} | } | ||
.nc- | .nc-card { | ||
min-width: 100%; | |||
} | } | ||
} | } | ||