MediaWiki:Gadget-NavboxCSS.css:修订间差异
外观
IdleTap-bot(留言 | 贡献) 部署 NavboxCSS 样式(Navbox 系列模板样式表) |
IdleTap-bot(留言 | 贡献) 修复:Navbox 组标签列过窄导致中文标签被逐字挤压,auto 改为 minmax(10em, auto) |
||
| 第46行: | 第46行: | ||
flex-direction: column; | flex-direction: column; | ||
grid-gap: 3px; | grid-gap: 3px; | ||
grid-template-columns: auto 1fr; | grid-template-columns: minmax(10em, auto) 1fr; | ||
text-align: left; | text-align: left; | ||
--navbox-title-color: hsl(var(--navbox-hue, 160) var(--navbox-saturation, 45%) 72%); | --navbox-title-color: hsl(var(--navbox-hue, 160) var(--navbox-saturation, 45%) 72%); | ||
2026年8月9日 (日) 13:36的版本
/**
* SPDX-License-Identifier: CC-BY-SA-4.0
* _addText: '{{Gadget Header|license=CC-BY-SA-4.0}}'
*
* @source {@link https://git.qiuwen.net.cn/InterfaceAdmin/QiuwenGadgets/src/branch/master/src/NavboxCSS}
* @license CC-BY-SA-4.0 {@link https://www.qiuwenbaike.cn/wiki/H:CC-BY-SA-4.0}
*/
/**
* +------------------------------------------------------------+
* | === WARNING: GLOBAL GADGET FILE === |
* +------------------------------------------------------------+
* | All changes should be made in the repository, |
* | otherwise they will be lost. |
* +------------------------------------------------------------+
* | Changes to this page may affect many users. |
* | Please discuss changes by opening an issue before editing. |
* +------------------------------------------------------------+
*/
/* <nowiki> */
/* src/NavboxCSS/NavboxCSS.less */
:root {
--navbox-hue: 160;
--navbox-saturation: 45%;
}
.navbox {
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 3px;
border: 1px solid #a2a9b1;
margin: 1em 0;
background: #fdfdfd;
clear: both;
font-size: 97.5%;
overflow-x: auto;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: flex;
display: grid;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-moz-box-orient: vertical;
-moz-box-direction: normal;
flex-direction: column;
grid-gap: 3px;
grid-template-columns: minmax(10em, auto) 1fr;
text-align: left;
--navbox-title-color: hsl(var(--navbox-hue, 160) var(--navbox-saturation, 45%) 72%);
--navbox-group-color: hsl(var(--navbox-hue, 160) var(--navbox-saturation, 45%) 80%);
--navbox-subgroup-color: hsl(var(--navbox-hue, 160) var(--navbox-saturation, 45%) 86%);
--navbox-sub-subgroup-color: hsl(var(--navbox-hue, 160) var(--navbox-saturation, 45%) 90%);
}
.navbox .navbox-cell {
padding: 0.0875em 1em;
}
.navbox .navbox-above,
.navbox .navbox-below,
.navbox .navbox-title {
text-align: center;
margin-bottom: 1px;
}
.navbox .navbox-sole-row {
grid-column: 1 / 3;
}
.navbox .navbox-group {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: flex;
display: grid;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
grid-column: 1 / 2;
text-align: center;
vertical-align: middle;
font-weight: bold;
}
.navbox .navbox-list {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: flex;
display: grid;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
align-items: center;
}
.navbox .navbox-title {
display: block;
display: grid;
grid-template-columns: 1fr auto 1fr;
padding-left: 1em;
background-color: #c4e3b5;
background-color: var(--navbox-title-color, #c4e3b5);
font-size: 97.5%;
font-weight: bolder;
text-align: center;
}
.navbox .navbox-title > .navbar,
.navbox .navbox-title-inner > .navbar {
float: left;
text-align: left;
margin-right: 0;
margin-left: 0.5em;
grid-column: 1 / span 1;
justify-self: start;
}
.navbox .navbox-title > .navbox-title-content,
.navbox .navbox-title-inner > .navbox-title-content {
grid-column: 2 / span 1;
justify-self: center;
}
.navbox .navbox-title .collapsetoggle,
.navbox .navbox-title-inner .collapsetoggle,
.navbox .navbox-title .mw-collapsible-toggle,
.navbox .navbox-title-inner .mw-collapsible-toggle,
.navbox .navbox-title .gadget-collapsible-toggler,
.navbox .navbox-title-inner .gadget-collapsible-toggler {
font-weight: normal;
grid-column: 3 / span 1;
justify-self: end;
}
.navbox .navbox-group,
.navbox .navbox-above,
.navbox .navbox-below,
.navbox .navbox .navbox-title {
background-color: #d2ebc7;
background-color: var(--navbox-group-color, #d2ebc7);
}
.navbox .navbox .navbox-group,
.navbox .navbox .navbox-above,
.navbox .navbox .navbox-below,
.navbox .navbox .navbox .navbox-title {
background-color: #e2f1da;
background-color: var(--navbox-subgroup-color, #e2f1da);
}
.navbox .navbox .navbox .navbox-group,
.navbox .navbox .navbox .navbox-above,
.navbox .navbox .navbox .navbox-below,
.navbox .navbox .navbox .navbox .navbox-title {
background-color: #f0f7ed;
background-color: var(--navbox-sub-subgroup-color, #f0f7ed);
}
.navbox .navbox-odd {
background: transparent;
}
.navbox .navbox-even {
background: #f7f7f7;
}
.navbox .navbar {
display: inline;
font-weight: normal;
}
.navbox .navbar ul {
display: inline;
}
.navbox .navbar li {
word-spacing: -0.125em;
}
.navbox .navbar-mini li abbr[title] {
border-bottom: 0;
cursor: inherit;
-webkit-font-feature-settings: "smcp";
-moz-font-feature-settings: "smcp";
font-feature-settings: "smcp";
font-variant: small-caps;
-webkit-text-decoration: none;
text-decoration: none;
}
.navbox .navbox-list.navbox,
.navbox .navbox-list > span > .navbox,
.navbox .navbox-list > span > span > .navbox,
.navbox .navbox-list > .navbox {
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-moz-box-align: stretch;
align-items: stretch;
-webkit-align-self: stretch;
align-self: stretch;
padding: 0;
border: 0;
margin: 0;
font-size: inherit;
}
.navbox .navbox-list > .navbox,
.navbox .navbox-list > span > .navbox,
.navbox .navbox-list > span > span > .navbox {
margin: -0.0875em -1em;
}
.navbox .navbox-list > .navbox:not(.navbox-level-0) {
margin: 0;
}
.navbox .hlist dl,
.navbox .hlist ol,
.navbox .hlist ul,
.navbox .hlist dd,
.navbox .hlist dt,
.navbox .hlist li {
margin: 0 !important;
padding: 0.125em 0;
}
.navbox .hlist dd,
.navbox .hlist dt,
.navbox .hlist li {
white-space: nowrap;
display: inline;
}
.navbox .hlist dd dl,
.navbox .hlist dt dl,
.navbox .hlist li dl,
.navbox .hlist dd ul,
.navbox .hlist dt ul,
.navbox .hlist li ul,
.navbox .hlist dd ol,
.navbox .hlist dt ol,
.navbox .hlist li ol {
white-space: normal;
}
.navbox .hlist dd a,
.navbox .hlist dt a,
.navbox .hlist li a {
display: inline-block;
}
.navbox .hlist ul ul,
.navbox .hlist ol ul,
.navbox .hlist ul ol,
.navbox .hlist ol ol {
padding-left: 0;
margin-left: 0;
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul {
padding: 0.125em 0;
}
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
padding: 0.125em 0;
}
.navbox-wrapper + .navbox-wrapper > .navbox,
.navbox-wrapper + .navbox-wrapper > .content-table > .navbox,
.navbox + .navbox {
margin-top: -webkit-calc(-1px - 1em);
margin-top: calc(-1px - 1em);
}
.navboxes > .navbox,
.navboxes > .navbox-wrapper > .navbox,
.navboxes > .navbox-wrapper > .content-table > .navbox {
padding: 0.625em 0;
}
.plainbox > .navbox-group {
max-width: none;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
text-align: center;
}
.plainbox > .navbox-group,
.plainbox > .navbox-list {
grid-column: 1 / 3;
}
.navbox.vertical > .navbox-group,
.navbox-group.vertical {
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
text-align: center;
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
}
.plainbox.vertical > .navbox-group,
.plainbox > .navbox-group.vertical {
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
text-align: center;
-webkit-writing-mode: inherit;
writing-mode: inherit;
}
@media screen and (max-width: 768px) {
.plainbox > .navbox-group {
max-width: none;
}
.plainbox > .navbox-group,
.plainbox > .navbox-list {
grid-column: 1 / 3;
}
.plainbox.vertical > .navbox-group,
.plainbox > .navbox-group.vertical {
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
text-align: center;
-webkit-writing-mode: inherit;
writing-mode: inherit;
}
.navbox .navbox-group {
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
justify-content: center;
text-align: center;
}
.navbox .navbox-list,
.navbox .navbox-cell {
padding: 0.0875em 0;
}
.navbox .navbox-list > .navbox,
.navbox .navbox-list > span > .navbox,
.navbox .navbox-list > span > span > .navbox {
margin: 0;
}
.navbox.vertical > .navbox-group,
.navbox-group.vertical {
-webkit-writing-mode: horizontal-tb;
writing-mode: horizontal-tb;
}
.mw-body-content .navbox,
.mw-body-content .navbox > .navbox-inner {
display: block;
width: 100% !important;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
table.navbox,
table.navbox-inner {
display: table;
width: 100%;
}
@media screen and (max-width: 768px) {
table.navbox,
table.navbox-inner {
max-width: 100% !important;
margin-left: 1px !important;
margin-right: 1px !important;
}
}
/* </nowiki> */