MediaWiki:Common.css:修訂間差異
跳至導覽
跳至搜尋
無編輯摘要 |
無編輯摘要 |
||
| 第2行: | 第2行: | ||
Encyclato 資訊面板 | Encyclato 資訊面板 | ||
維基風格・靠右・分隔版 | 維基風格・靠右・分隔版 | ||
適用:國家、艦級、裝甲車輛等所有 encyclato-infobox | |||
========================================================= */ | ========================================================= */ | ||
/* ---------- | /* ---------- 1. 面板本體 ---------- */ | ||
table.encyclato-infobox { | table.encyclato-infobox { | ||
float: right !important; | float: right !important; | ||
clear: right !important; | clear: right !important; | ||
width: 22em; | width: 22em; | ||
max-width: calc(100% - 1em); | max-width: calc(100% - 1em); | ||
margin: 0 0 1em 1.25em !important; | margin: 0 0 1em 1.25em !important; | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
border-collapse: collapse; | border-collapse: collapse; | ||
border-spacing: 0; | border-spacing: 0; | ||
background: #f8f9fa; | background: #f8f9fa; | ||
color: #202122; | color: #202122; | ||
font-size: 90%; | font-size: 90%; | ||
line-height: 1.24; | line-height: 1.24; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
table.encyclato-infobox + table.encyclato-infobox { | |||
clear: right; | |||
} | |||
/* ---------- 2. 主標題 ---------- */ | |||
table.encyclato-infobox > caption { | table.encyclato-infobox > caption { | ||
padding: 0.55em 0.6em; | padding: 0.55em 0.6em; | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
border-bottom: 0; | border-bottom: 0; | ||
background: #f8f9fa; | background: #f8f9fa; | ||
font-size: 125%; | font-size: 125%; | ||
font-weight: 700; | font-weight: 700; | ||
| 第55行: | 第43行: | ||
} | } | ||
/* ---------- | /* ---------- 3. 一般儲存格 ---------- */ | ||
table.encyclato-infobox > tbody > tr > th, | table.encyclato-infobox > tbody > tr > th, | ||
table.encyclato-infobox > tbody > tr > td { | table.encyclato-infobox > tbody > tr > td { | ||
box-sizing: border-box; | box-sizing: border-box; | ||
padding: 0.10em 0.48em; | padding: 0.10em 0.48em; | ||
border-bottom: 1px solid #eaecf0; | border-bottom: 1px solid #eaecf0; | ||
vertical-align: middle; | |||
} | |||
table.encyclato-infobox > tbody > tr:last-child > th, | |||
table.encyclato-infobox > tbody > tr:last-child > td { | |||
border-bottom: 0; | |||
} | } | ||
/* ------- | /* 資料列 */ | ||
table.encyclato-infobox > tbody > tr.infobox-row > th, | |||
table.encyclato-infobox > tbody > tr.infobox-row > td { | |||
padding-top: 0.10em; | |||
padding-bottom: 0.14em; | |||
line-height: 1.24; | |||
} | |||
/* ---------- 4. 欄名與內容 ---------- */ | |||
table.encyclato-infobox > tbody > tr > th.infobox-label { | table.encyclato-infobox > tbody > tr > th.infobox-label { | ||
width: 38%; | width: 38%; | ||
border-right: 1px solid #eaecf0; | |||
background: #f8f9fa; | background: #f8f9fa; | ||
font-weight: 600; | font-weight: 600; | ||
text-align: center; | text-align: center; | ||
} | } | ||
table.encyclato-infobox > tbody > tr > th.infobox-label + td { | table.encyclato-infobox > tbody > tr > th.infobox-label + td { | ||
width: 62%; | width: 62%; | ||
background: #ffffff; | background: #ffffff; | ||
text-align: left; | text-align: left; | ||
overflow-wrap: anywhere; | overflow-wrap: anywhere; | ||
} | } | ||
/* | /* 四字以內欄名兩端對齊 */ | ||
table.encyclato-infobox .infobox-label-text { | table.encyclato-infobox .infobox-label-text { | ||
display: inline-block; | display: inline-block; | ||
width: 4em; | width: 4em; | ||
text-align: justify; | text-align: justify; | ||
text-align-last: justify; | text-align-last: justify; | ||
text-justify: inter-character; | text-justify: inter-character; | ||
white-space: nowrap; | white-space: nowrap; | ||
} | } | ||
/* | /* 動態欄名(職稱、建立事件)允許換行 */ | ||
table.encyclato-infobox > tbody > tr > th.infobox-label-dynamic { | table.encyclato-infobox > tbody > tr > th.infobox-label-dynamic { | ||
white-space: normal; | white-space: normal; | ||
| 第114行: | 第97行: | ||
} | } | ||
/* ---------- | /* ---------- 5. 區塊標題 ---------- */ | ||
/* 上框線同時充當上一區塊最後一列的底線 */ | |||
table.encyclato-infobox > tbody > tr > th.infobox-section { | table.encyclato-infobox > tbody > tr > th.infobox-section { | ||
padding: 0.34em 0.55em; | |||
border-top: 1px solid #a2a9b1; | |||
padding: 0. | |||
border-top: | |||
border-bottom: 1px solid #a2a9b1; | border-bottom: 1px solid #a2a9b1; | ||
background: #eaecf0; | background: #eaecf0; | ||
font-weight: 700; | font-weight: 700; | ||
text-align: center; | text-align: center; | ||
letter-spacing: 0.05em; | letter-spacing: 0.05em; | ||
} | } | ||
table.encyclato-infobox > tbody > tr > th.infobox-subsection { | table.encyclato-infobox > tbody > tr > th.infobox-subsection { | ||
padding: 0.24em 0.55em; | padding: 0.24em 0.55em; | ||
border-top: 1px solid #a2a9b1; | |||
border-top: | |||
border-bottom: 1px solid #c8ccd1; | border-bottom: 1px solid #c8ccd1; | ||
background: #f1f3f5; | background: #f1f3f5; | ||
font-weight: 700; | font-weight: 700; | ||
text-align: center; | text-align: center; | ||
} | } | ||
/* ---------- | /* ---------- 6. 國旗與國徽 ---------- */ | ||
table.encyclato-infobox > tbody > tr.infobox-symbol-row > td { | table.encyclato-infobox > tbody > tr.infobox-symbol-row > td { | ||
width: 50%; | width: 50%; | ||
padding: 0.4em 0.4em 0.35em; | padding: 0.4em 0.4em 0.35em; | ||
background: #ffffff; | background: #ffffff; | ||
text-align: center; | text-align: center; | ||
vertical-align: middle; | vertical-align: middle; | ||
| 第172行: | 第133行: | ||
table.encyclato-infobox .infobox-symbol-name { | table.encyclato-infobox .infobox-symbol-name { | ||
display: block; | display: block; | ||
margin-bottom: 0.3em; | margin-bottom: 0.3em; | ||
font-weight: 600; | font-weight: 600; | ||
} | } | ||
table.encyclato-infobox .infobox-symbol-media { | table.encyclato-infobox .infobox-symbol-media { | ||
line-height: 0; | line-height: 0; | ||
text-align: center; | text-align: center; | ||
| 第195行: | 第144行: | ||
table.encyclato-infobox .infobox-symbol-media img { | table.encyclato-infobox .infobox-symbol-media img { | ||
display: inline-block; | display: inline-block; | ||
vertical-align: middle; | |||
} | |||
/* 移除 MediaWiki 自動插入的多餘段落與換行 */ | |||
table.encyclato-infobox > tbody > tr.infobox-symbol-row p { | |||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
} | |||
table.encyclato-infobox > tbody > tr.infobox-symbol-row br:first-child, | |||
table.encyclato-infobox > tbody > tr.infobox-symbol-row br:last-child { | |||
display: none; | |||
} | } | ||
/* ---------- | /* ---------- 7. 圖像 ---------- */ | ||
table.encyclato-infobox .infobox-wide-image, | table.encyclato-infobox .infobox-wide-image, | ||
table.encyclato-infobox .infobox-image-cell { | table.encyclato-infobox .infobox-image-cell { | ||
background: #ffffff; | background: #ffffff; | ||
text-align: center; | text-align: center; | ||
vertical-align: middle; | vertical-align: middle; | ||
} | } | ||
table.encyclato-infobox .infobox-signature-cell { | table.encyclato-infobox .infobox-signature-cell { | ||
background: #ffffff; | background: #ffffff; | ||
text-align: center; | text-align: center; | ||
vertical-align: middle; | vertical-align: middle; | ||
| 第242行: | 第175行: | ||
max-width: 150px; | max-width: 150px; | ||
max-height: 80px; | max-height: 80px; | ||
width: auto; | |||
} | |||
width: | table.encyclato-infobox img { | ||
max-width: 100%; | |||
height: auto; | height: auto; | ||
} | } | ||
/* ----------------------- | /* ---------- 8. 跨欄內容與備註 ---------- */ | ||
/* 跨兩欄的清單內容,例如艦艇或車輛的變體 */ | |||
- | table.encyclato-infobox .infobox-wide-cell { | ||
padding: 0.3em 0.55em; | |||
background: #ffffff; | |||
text-align: left; | |||
} | |||
table.encyclato-infobox .infobox-note { | table.encyclato-infobox .infobox-note { | ||
padding: 0.55em 0.65em; | padding: 0.55em 0.65em; | ||
background: #ffffff; | background: #ffffff; | ||
font-size: 85%; | font-size: 85%; | ||
} | } | ||
/* ---------- | /* ---------- 9. 儲存格內的段落與清單 ---------- */ | ||
table.encyclato-infobox th p, | |||
table.encyclato-infobox td p { | |||
margin: 0; | |||
table.encyclato-infobox | |||
} | } | ||
table.encyclato-infobox th ul, | |||
table.encyclato-infobox th ol, | |||
- | table.encyclato-infobox td ul, | ||
table.encyclato-infobox td ol { | |||
table.encyclato-infobox | margin-top: 0.15em; | ||
margin-bottom: 0.15em; | |||
} | } | ||
/* ---------- | /* ---------- 10. 空白列 ---------- */ | ||
table.encyclato-infobox > tbody > tr.infobox-hidden { | |||
display: none !important; | |||
table.encyclato-infobox | |||
} | } | ||
/* ---------- | /* ---------- 11. 窄螢幕(保持靠右浮動)---------- */ | ||
@media screen and (max-width: 520px) { | @media screen and (max-width: 520px) { | ||
table.encyclato-infobox { | table.encyclato-infobox { | ||
width: 21em; | width: 21em; | ||
max-width: calc(100% - 0.5em); | max-width: calc(100% - 0.5em); | ||
margin: 0 0 1em 0.75em !important; | margin: 0 0 1em 0.75em !important; | ||
} | } | ||
| 第311行: | 第234行: | ||
table.encyclato-infobox > tbody > tr > th.infobox-label + td { | table.encyclato-infobox > tbody > tr > th.infobox-label + td { | ||
width: 61%; | width: 61%; | ||
} | } | ||
} | } | ||
2026年9月18日 (五) 09:21的版本
/* =========================================================
Encyclato 資訊面板
維基風格・靠右・分隔版
適用:國家、艦級、裝甲車輛等所有 encyclato-infobox
========================================================= */
/* ---------- 1. 面板本體 ---------- */
table.encyclato-infobox {
float: right !important;
clear: right !important;
width: 22em;
max-width: calc(100% - 1em);
margin: 0 0 1em 1.25em !important;
border: 1px solid #a2a9b1;
border-collapse: collapse;
border-spacing: 0;
background: #f8f9fa;
color: #202122;
font-size: 90%;
line-height: 1.24;
box-sizing: border-box;
}
table.encyclato-infobox + table.encyclato-infobox {
clear: right;
}
/* ---------- 2. 主標題 ---------- */
table.encyclato-infobox > caption {
padding: 0.55em 0.6em;
border: 1px solid #a2a9b1;
border-bottom: 0;
background: #f8f9fa;
font-size: 125%;
font-weight: 700;
line-height: 1.35;
text-align: center;
}
table.encyclato-infobox .infobox-native-name {
font-size: 80%;
font-weight: 400;
}
/* ---------- 3. 一般儲存格 ---------- */
table.encyclato-infobox > tbody > tr > th,
table.encyclato-infobox > tbody > tr > td {
box-sizing: border-box;
padding: 0.10em 0.48em;
border-bottom: 1px solid #eaecf0;
vertical-align: middle;
}
table.encyclato-infobox > tbody > tr:last-child > th,
table.encyclato-infobox > tbody > tr:last-child > td {
border-bottom: 0;
}
/* 資料列 */
table.encyclato-infobox > tbody > tr.infobox-row > th,
table.encyclato-infobox > tbody > tr.infobox-row > td {
padding-top: 0.10em;
padding-bottom: 0.14em;
line-height: 1.24;
}
/* ---------- 4. 欄名與內容 ---------- */
table.encyclato-infobox > tbody > tr > th.infobox-label {
width: 38%;
border-right: 1px solid #eaecf0;
background: #f8f9fa;
font-weight: 600;
text-align: center;
}
table.encyclato-infobox > tbody > tr > th.infobox-label + td {
width: 62%;
background: #ffffff;
text-align: left;
overflow-wrap: anywhere;
}
/* 四字以內欄名兩端對齊 */
table.encyclato-infobox .infobox-label-text {
display: inline-block;
width: 4em;
text-align: justify;
text-align-last: justify;
text-justify: inter-character;
white-space: nowrap;
}
/* 動態欄名(職稱、建立事件)允許換行 */
table.encyclato-infobox > tbody > tr > th.infobox-label-dynamic {
white-space: normal;
line-height: 1.35;
}
/* ---------- 5. 區塊標題 ---------- */
/* 上框線同時充當上一區塊最後一列的底線 */
table.encyclato-infobox > tbody > tr > th.infobox-section {
padding: 0.34em 0.55em;
border-top: 1px solid #a2a9b1;
border-bottom: 1px solid #a2a9b1;
background: #eaecf0;
font-weight: 700;
text-align: center;
letter-spacing: 0.05em;
}
table.encyclato-infobox > tbody > tr > th.infobox-subsection {
padding: 0.24em 0.55em;
border-top: 1px solid #a2a9b1;
border-bottom: 1px solid #c8ccd1;
background: #f1f3f5;
font-weight: 700;
text-align: center;
}
/* ---------- 6. 國旗與國徽 ---------- */
table.encyclato-infobox > tbody > tr.infobox-symbol-row > td {
width: 50%;
padding: 0.4em 0.4em 0.35em;
background: #ffffff;
text-align: center;
vertical-align: middle;
}
table.encyclato-infobox > tbody > tr.infobox-symbol-row > td + td {
border-left: 1px solid #eaecf0;
}
table.encyclato-infobox .infobox-symbol-name {
display: block;
margin-bottom: 0.3em;
font-weight: 600;
}
table.encyclato-infobox .infobox-symbol-media {
line-height: 0;
text-align: center;
}
table.encyclato-infobox .infobox-symbol-media img {
display: inline-block;
vertical-align: middle;
}
/* 移除 MediaWiki 自動插入的多餘段落與換行 */
table.encyclato-infobox > tbody > tr.infobox-symbol-row p {
margin: 0;
padding: 0;
}
table.encyclato-infobox > tbody > tr.infobox-symbol-row br:first-child,
table.encyclato-infobox > tbody > tr.infobox-symbol-row br:last-child {
display: none;
}
/* ---------- 7. 圖像 ---------- */
table.encyclato-infobox .infobox-wide-image,
table.encyclato-infobox .infobox-image-cell {
background: #ffffff;
text-align: center;
vertical-align: middle;
}
table.encyclato-infobox .infobox-signature-cell {
background: #ffffff;
text-align: center;
vertical-align: middle;
}
table.encyclato-infobox .infobox-signature-cell img {
max-width: 150px;
max-height: 80px;
width: auto;
}
table.encyclato-infobox img {
max-width: 100%;
height: auto;
}
/* ---------- 8. 跨欄內容與備註 ---------- */
/* 跨兩欄的清單內容,例如艦艇或車輛的變體 */
table.encyclato-infobox .infobox-wide-cell {
padding: 0.3em 0.55em;
background: #ffffff;
text-align: left;
}
table.encyclato-infobox .infobox-note {
padding: 0.55em 0.65em;
background: #ffffff;
font-size: 85%;
}
/* ---------- 9. 儲存格內的段落與清單 ---------- */
table.encyclato-infobox th p,
table.encyclato-infobox td p {
margin: 0;
}
table.encyclato-infobox th ul,
table.encyclato-infobox th ol,
table.encyclato-infobox td ul,
table.encyclato-infobox td ol {
margin-top: 0.15em;
margin-bottom: 0.15em;
}
/* ---------- 10. 空白列 ---------- */
table.encyclato-infobox > tbody > tr.infobox-hidden {
display: none !important;
}
/* ---------- 11. 窄螢幕(保持靠右浮動)---------- */
@media screen and (max-width: 520px) {
table.encyclato-infobox {
width: 21em;
max-width: calc(100% - 0.5em);
margin: 0 0 1em 0.75em !important;
}
table.encyclato-infobox > caption {
font-size: 120%;
}
table.encyclato-infobox > tbody > tr > th.infobox-label {
width: 39%;
}
table.encyclato-infobox > tbody > tr > th.infobox-label + td {
width: 61%;
}
}