Difference between revisions of "MediaWiki:Common.css"

Latest revision as of 01:38, 24 May 2025

/* 这里放置的CSS将应用于所有皮肤 */

/* 以下是 Tabs 扩展使用的 CSS 源码。由于 JS 生成过慢，导致置顶菜单有一闪而过的现象，所以手动贴在这里。 */
body:not(oldbrowser) .tabs-content {
  display: none;
}

#tabs-inputform {
  font-family: sans-serif !important;
  margin: 0px !important;
}

head~body #tabs-inputform {
  margin: 1px !important;
}

body:not(oldbrowser) #tabs-inputform {
  font-family: serif !important;
}

.tabs,
.tabs * {
  max-height: 1000000px;
}

.tabs-input,
.tabs-close,
#tabs-inputform,
body.tabs-oldbrowserscript .tabs-content {
  display: none;
}

.tabs-tabbox,
.tabs-togglebox {
  margin: 10px 0;
}

.tabs-label {
  cursor: pointer;
  padding: 1px 6px;
  background-color: #DDD;
  border: 1px solid #AAA;
}

.tabs-togglebox.tabs-inline {
  display: inline-block;
}

* html .tabs-togglebox .tabs-inline {
  display: inline;
}

*+html .tabs-togglebox .tabs-inline {
  display: inline;
}

.tabs-tabbox>.tabs-input+.tabs-input+.tabs-label {
  margin-left: 10px;
}

.tabs-tabbox>.tabs-container {
  margin-top: -1px;
  padding: 2px 6px;
  border-radius: 8px;
  position: relative;
  border: 1px solid #AAA;
  width: inherit;
  max-width: inherit;
  min-width: inherit;
  z-index: 1;
}

.tabs-tabbox>.tabs-label {
  margin: 0 2px;
  border-bottom: none;
  border-radius: 7px 7px 0 0;
  position: relative;
  display: inline-block;
  vertical-align: bottom;
}

.tabs-tabbox .tabs-content-0 {
  display: inline-block;
}

.tabs-tabbox .tabs-block.tabs-content-0 {
  display: block;
}

.tabs-tabbox .tabs-inline.tabs-content-0 {
  display: inline;
}

.tabs-plain>.tabs-label {
  border: 1px solid #AAA;
  border-radius: 8px;
  margin: 2px;
}

.tabs-plain>.tabs-container {
  border-radius: 0;
  border: none;
  padding: 0;
  margin-top: 1px;
}

.tabs-togglebox>.tabs-container {
  display: inline-block;
  width: inherit;
  min-width: inherit;
  max-width: inherit;
  padding: 0;
  border-radius: 8px;
}

.tabs-togglebox>*>.tabs-label {
  display: block;
  text-align: center;
  border-radius: 7px;
  padding: 1px 5px;
  margin: 0;
  outline: none;
}

.tabs-togglebox>*>.tabs-content {
  padding: 2px 6px;
  border-radius: 0 0 7px 7px;
  border: 1px solid #AAA;
  border-top: none;
  vertical-align: top;
}

.tabs-dropdown .tabs-container {
  width: inherit;
  min-width: inherit;
  max-width: inherit;
  position: relative;
}

.tabs-dropdown>*>.tabs-content {
  border-radius: 0;
}

.tabs-dropdown p {
  margin: 0;
}

.tabs-dropdown>*>.tabs-label {
  margin-right: -14px;
}

.tabs-dropdown {
  margin-right: 14px;
}

.tabs-dropdown>*>.tabs-content {
  position: absolute;
  z-index: 100000;
  cursor: default;
  margin: 0;
  padding: 0 6px;
  display: block;
  left: -1000000px;
}

.tabs-dropdown>*>.tabs-content,
.tabs-dropdown li ul,
.tabs-dropdown li ol {
  width: inherit;
  min-width: inherit;
  max-width: inherit;
  box-shadow: 2px 3px 5px #888;
}

.tabs-dropdown li {
  width: inherit;
  min-width: inherit;
  max-width: inherit;
}

.tabs-dropdown>*>.tabs-label,
.tabs-dropdown>*>.tabs-content,
.tabs-dropdown ul,
.tabs-dropdown ul:before,
.tabs-dropdown ol,
.tabs-dropdown ol:before {
  -webkit-transition-property: left, margin-left, border-radius;
  -webkit-transition-delay: 0.2s;
  -moz-transition-property: left, margin-left, border-radius;
  -moz-transition-delay: 0.2s;
  -o-transition-property: left, margin-left, border-radius;
  -o-transition-delay: 0.2s;
  transition-property: left, margin-left, border-radius;
  transition-delay: 0.2s;
}

.tabs-dropdown .tabs-dropdown {
  margin-left: -7px;
}

.tabs-dropdown li li .tabs-dropdown {
  margin-left: 0;
}

.tabs-dropdown li,
.tabs-dropdown>*>.tabs-content>a,
.tabs-dropdown>*>.tabs-content>p>a,
.tabs-dropdown ol>li>a {
  display: list-item;
  list-style: none;
  margin: -1px -6px 0 -6px;
  padding: 2px 6px;
  border-top: 1px solid #AAA;
  position: relative;
}

.tabs-dropdown ol>li>a {
  border: none;
  margin: -2px -6px;
  padding: 2px 6px;
}

.tabs-dropdown li li a {
  margin: -2px 0;
}

.tabs-dropdown li li,
.tabs-dropdown li li:last-child {
  margin-left: 0;
  margin-right: 0;
  padding: 2px 0;
}

.tabs-dropdown>*>.tabs-content ul,
.tabs-dropdown>*>.tabs-content ol {
  margin: 0;
  width: inherit;
  min-width: inherit;
  max-width: inherit;
}

.tabs-dropdown li ul,
.tabs-dropdown li ol {
  position: absolute;
  border: 1px solid #AAA;
  top: -1px;
  left: -1000012px;
}

.tabs-dropdown li ul~ul,
.tabs-dropdown li ul~ol,
.tabs-dropdown li ol~ul,
.tabs-dropdown li ol~ol {
  display: none;
}

.tabs-dropdown li ul:before,
.tabs-dropdown li ol:before {
  content: ">";
  color: #88F;
  font-weight: bold;
  position: absolute;
  left: 100%;
  margin-left: 1000012px;
}

.tabs-dropdown li li ul:before,
.tabs-dropdown li li ol:before {
  margin-left: 1000000px;
}

.tabs-label:hover {
  background-color: #CCC;
}

.tabs-label:active,
.tabs-label:focus {
  background-color: #CCE;
}

.tabs-tabbox>.tabs-input:checked+.tabs-label,
.tabs-input-0:checked+.tabs-input-1+.tabs-label {
  z-index: 2;
  background-color: #FFF;
}

.tabs-togglebox>*>.tabs-input:checked+.tabs-label,
.tabs-dropdown>*>.tabs-label:focus,
.tabs-dropdown:hover>*>.tabs-label {
  border-radius: 7px 7px 0 0;
}

.tabs-togglebox>*>.tabs-input:checked~.tabs-content {
  display: block;
}

.tabs-togglebox .tabs-input:checked+* .tabs-close {
  display: inline;
}

.tabs-togglebox .tabs-input:checked+* .tabs-open {
  display: none;
}

.tabs-dropdown>*>.tabs-content li:hover {
  background: #CCC;
}

.tabs-dropdown a,
.tabs-dropdown a:hover,
.tabs-dropdown a:visited {
  color: #15B;
}

.tabs-dropdown a:active {
  color: #108;
}

.tabs-dropdown>*>.tabs-content>a:hover,
.tabs-dropdown>*>.tabs-content>p>a:hover,
.tabs-dropdown ol>li>a:hover {
  background: #CCE;
  text-decoration: none;
}

.tabs-dropdown>*>.tabs-label:focus+.tabs-content,
.tabs-dropdown:hover>*>.tabs-content {
  left: 0;
}

.tabs-dropdown>*>.tabs-content li:hover>ul,
.tabs-dropdown>*>.tabs-content li:hover>ol {
  left: 100%;
}

.tabs-dropdown>*>.tabs-content li:hover>ul:before,
.tabs-dropdown>*>.tabs-content li:hover>ol:before {
  margin-left: 0;
  left: -12px;
}

.tabs-tabbox>.tabs-input.checked+.tabs-label,
.tabs-input-0.checked+.tabs-input-1+.tabs-label {
  z-index: 2;
  background-color: #FFF;
}

.tabs-togglebox>*>.tabs-input.checked~.tabs-content {
  display: block;
}

.tabs-togglebox>*>.tabs-input.checked+* .tabs-close {
  display: inline;
}

.tabs-togglebox>*>.tabs-input.checked+* .tabs-open {
  display: none;
}

summary::-webkit-details-marker {
  display: none;
}

.tabs-togglebox details.tabs-container:not([open]) .tabs-content {
  display: none;
}

.tabs-togglebox details.tabs-container[open] .tabs-content {
  display: block;
}

.tabs-togglebox details.tabs-container:not([open]) .tabs-label {
  border-radius: 7px;
}

.tabs-togglebox details.tabs-container[open] .tabs-label {
  border-radius: 7px 7px 0 0;
}

.tabs-togglebox details.tabs-container[open] .tabs-close {
  display: inline;
}

.tabs-togglebox details.tabs-container[open] .tabs-open {
  display: none;
}

/* Collapsible elements. Toggle-link moved to left.
/* Margin around it adjusted. */

.mw-collapsible span.mw-collapsible-toggle {
  float: left;
  margin-left: 0;
  margin-right: 1em;
}