MediaWiki:Gadget-NavboxCSS.css
请注意:更新本页面后,您可能需要清除浏览器缓存才能看到所作变更的影响。
Google Chrome、Microsoft Edge、Mozilla Firefox、Safari:按住⇧ Shift,同时单击“刷新”。
Google Chrome、Microsoft Edge、Mozilla Firefox、Safari:按住⇧ Shift,同时单击“刷新”。
本小工具代码采用下列版权许可:
本文件采用知识共享署名-相同方式共享(CC BY-SA 4.0)许可协议授权。
- 您可以自由地:
- 分享 – 在任何媒介以任何形式复制、发行本作品
- 演绎 – 修改、转换或以本作品为基础进行创作
- 惟须遵守下列条件:
- 署名 – 您必须给出适当的署名,提供指向本许可协议的链接,同时标明是否(对原始作品)作了修改。您可以用任何合理的方式来署名,但是不得以任何方式暗示许可人为您或您的使用背书。
- 相同方式共享 – 如果您再混合、转换或者基于本作品进行创作,您必须基于与原先许可协议相同或相兼容的许可协议分发您贡献的作品。
/**
* 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,
.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,
.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,
.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,
.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,
.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,
.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> */