MediaWiki:Common.css:修订间差异
MediaWiki界面页面
更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第1行: | 第1行: | ||
.homepage-container { | .homepage-container { | ||
display: grid !important; | display: grid !important; | ||
grid-template-columns: 1fr 1fr; | grid-template-columns: 1fr 1fr; | ||
column-gap: 30px; | column-gap: 30px; | ||
row-gap: 10px; | row-gap: 10px; | ||
| 第9行: | 第9行: | ||
.homepage-left, .homepage-right { | .homepage-left, .homepage-right { | ||
min-width: 0; | min-width: 0; | ||
} | } | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.homepage-container { | .homepage-container { | ||
| 第19行: | 第18行: | ||
} | } | ||
.hp-banner { | .hp-banner { | ||
display: flex !important; | display: flex !important; | ||
justify-content: space-between; | justify-content: space-between; | ||
align-items: center; | align-items: center; | ||
background: linear-gradient(135deg, #1a3a6c 0%, #2a5298 100%) !important; | background: linear-gradient(135deg, #1a3a6c 0%, #2a5298 100%) !important; | ||
color: white !important; | color: white !important; | ||
padding: 35px 45px !important; | padding: 35px 45px !important; | ||
margin: 10px 0 30px 0 !important; | margin: 10px 0 30px 0 !important; | ||
border-radius: 12px !important; | border-radius: 12px !important; | ||
border: none !important; | border: none !important; | ||
box-shadow: 0 8px 20px rgba(26, 58, 108, 0.2) !important; | box-shadow: 0 8px 20px rgba(26, 58, 108, 0.2) !important; | ||
| 第36行: | 第33行: | ||
} | } | ||
.hp-banner::after { | .hp-banner::after { | ||
content: ""; | content: ""; | ||
| 第51行: | 第47行: | ||
.hp-banner-info { | .hp-banner-info { | ||
flex: 2; | flex: 2; | ||
z-index: 1; | z-index: 1; | ||
} | } | ||
| 第81行: | 第77行: | ||
.hp-banner-nav { | .hp-banner-nav { | ||
flex: 0 0 auto !important; | flex: 0 0 auto !important; | ||
display: flex !important; | display: flex !important; | ||
align-items: center !important; | align-items: center !important; | ||
| 第88行: | 第84行: | ||
padding-left: 30px !important; | padding-left: 30px !important; | ||
margin-left: 20px !important; | margin-left: 20px !important; | ||
text-align: right !important; | |||
} | } | ||
.hp-banner-nav a { | .hp-banner-nav a { | ||
font-weight: bold; | font-weight: bold; | ||
| 第101行: | 第97行: | ||
} | } | ||
.hp-nav-box a { | .hp-nav-box a { | ||
color: #1a3a6c !important; | color: #1a3a6c !important; | ||
font-weight: bold !important; | font-weight: bold !important; | ||
text-decoration: none !important; | text-decoration: none !important; | ||
| 第116行: | 第111行: | ||
} | } | ||
.hp-nav-box span.sep { | .hp-nav-box span.sep { | ||
color: #a2a9b1; | color: #a2a9b1; | ||
| 第130行: | 第116行: | ||
} | } | ||
@media (max-width: 850px) { | @media (max-width: 850px) { | ||
.hp-banner { | .hp-banner { | ||
| 第147行: | 第132行: | ||
} | } | ||
.homepage-container .floatright { | .homepage-container .floatright { | ||
margin: 0 0 10px 15px !important; | margin: 0 0 10px 15px !important; | ||
| 第155行: | 第139行: | ||
} | } | ||
.hp-news-bar { | .hp-news-bar { | ||
display: flex; | display: flex; | ||
| 第161行: | 第144行: | ||
background: #fff; | background: #fff; | ||
border: 1px solid #e2e8f0; | border: 1px solid #e2e8f0; | ||
border-left: 4px solid #1a3a6c; | border-left: 4px solid #1a3a6c; | ||
padding: 10px 20px; | padding: 10px 20px; | ||
margin-bottom: 25px; | margin-bottom: 25px; | ||
| 第185行: | 第168行: | ||
} | } | ||
.hp-news-content a { | .hp-news-content a { | ||
color: #2a5298; | color: #2a5298; | ||
| 第191行: | 第173行: | ||
text-decoration: none; | text-decoration: none; | ||
} | } | ||
.hp-news-content a:hover { | .hp-news-content a:hover { | ||
text-decoration: underline; | text-decoration: underline; | ||
} | } | ||
2025年12月21日 (日) 21:56的版本
.homepage-container {
display: grid !important;
grid-template-columns: 1fr 1fr;
column-gap: 30px;
row-gap: 10px;
width: 100%;
margin: 20px 0;
}
.homepage-left, .homepage-right {
min-width: 0;
}
@media (max-width: 768px) {
.homepage-container {
grid-template-columns: 1fr;
}
}
.hp-banner {
display: flex !important;
justify-content: space-between;
align-items: center;
background: linear-gradient(135deg, #1a3a6c 0%, #2a5298 100%) !important;
color: white !important;
padding: 35px 45px !important;
margin: 10px 0 30px 0 !important;
border-radius: 12px !important;
border: none !important;
box-shadow: 0 8px 20px rgba(26, 58, 108, 0.2) !important;
position: relative;
overflow: hidden;
}
.hp-banner::after {
content: "";
position: absolute;
top: -50%;
right: -10%;
width: 300px;
height: 300px;
background: rgba(255, 255, 255, 0.05);
border-radius: 50%;
pointer-events: none;
}
.hp-banner-info {
flex: 2;
z-index: 1;
}
.hp-banner-title {
font-size: 2.5em !important;
font-family: "Linux Libertine", "Georgia", "Times", serif;
font-weight: bold !important;
color: #ffffff !important;
margin: 0 0 10px 0 !important;
text-shadow: 0 2px 4px rgba(0,0,0,0.3);
border: none !important;
}
.hp-banner-subtitle {
font-size: 1.2em !important;
color: rgba(255, 255, 255, 0.9) !important;
margin-bottom: 12px !important;
font-weight: 300;
}
.hp-banner-stats {
font-size: 0.95em !important;
background: rgba(0, 0, 0, 0.2);
display: inline-block;
padding: 4px 12px;
border-radius: 20px;
color: rgba(255, 255, 255, 0.8) !important;
}
.hp-banner-nav {
flex: 0 0 auto !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-left: 1px solid rgba(255, 255, 255, 0.2) !important;
padding-left: 30px !important;
margin-left: 20px !important;
text-align: right !important;
}
.hp-banner-nav a {
font-weight: bold;
text-decoration: none !important;
}
.hp-banner-nav a:hover {
color: #ffffff !important;
text-decoration: underline !important;
}
.hp-nav-box a {
color: #1a3a6c !important;
font-weight: bold !important;
text-decoration: none !important;
padding: 2px 5px;
}
.hp-nav-box a:hover {
color: #2a5298 !important;
background: rgba(26, 58, 108, 0.05);
border-radius: 4px;
text-decoration: underline !important;
}
.hp-nav-box span.sep {
color: #a2a9b1;
margin: 0 4px;
}
@media (max-width: 850px) {
.hp-banner {
padding: 30px 20px !important;
flex-direction: column;
text-align: center;
}
.hp-banner-nav {
border-left: none !important;
border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
margin-top: 20px;
padding: 20px 0 0 0 !important;
text-align: center;
width: 100%;
}
}
.homepage-container .floatright {
margin: 0 0 10px 15px !important;
border-radius: 4px;
overflow: hidden;
border: 1px solid #f0f0f0;
}
.hp-news-bar {
display: flex;
align-items: center;
background: #fff;
border: 1px solid #e2e8f0;
border-left: 4px solid #1a3a6c;
padding: 10px 20px;
margin-bottom: 25px;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.hp-news-tag {
background: #1a3a6c;
color: white;
padding: 2px 10px;
border-radius: 4px;
font-size: 0.85em;
font-weight: bold;
margin-right: 15px;
white-space: nowrap;
}
.hp-news-content {
font-size: 0.95em;
color: #4a5568;
flex: 1;
}
.hp-news-content a {
color: #2a5298;
font-weight: bold;
text-decoration: none;
}
.hp-news-content a:hover {
text-decoration: underline;
}