Difference between revisions of "MediaWiki:Common.css"

From CETAF Identifiers Wiki
Jump to: navigation, search
(+inline definitions)
 
m (gray line numbers in <syntaxhighlight class="lineno-gray" >)
 
(7 intermediate revisions by the same user not shown)
Line 6: Line 6:
 
.definition-inline.code-bold-only dt { font-weight:normal; }
 
.definition-inline.code-bold-only dt { font-weight:normal; }
 
.definition-inline.code-bold-only dt code { font-weight:bold; }
 
.definition-inline.code-bold-only dt code { font-weight:bold; }
 +
 +
/* 2 column Layout */
 +
  .two-columns {
 +
    -moz-column-count:2; /* Firefox */
 +
    -webkit-column-count:2; /* Safari and Chrome */
 +
    column-count:2;
 +
 +
    -moz-column-gap:40px; /* Firefox */
 +
    -webkit-column-gap:40px; /* Safari and Chrome */
 +
    column-gap:40px;
 +
 +
    -moz-column-rule:2px outset gray; /* Firefox */
 +
    -webkit-column-rule:2px outset gray; /* Safari and Chrome */
 +
    column-rule:2px outset gray;
 +
  }
 +
/* 3 column Layout */
 +
  .three-columns {
 +
    -moz-column-count:3; /* Firefox */
 +
    -webkit-column-count:3; /* Safari and Chrome */
 +
    column-count:3;
 +
 +
    -moz-column-gap:40px; /* Firefox */
 +
    -webkit-column-gap:40px; /* Safari and Chrome */
 +
    column-gap:40px;
 +
 +
    -moz-column-rule:2px outset gray; /* Firefox */
 +
    -webkit-column-rule:2px outset gray; /* Safari and Chrome */
 +
    column-rule:2px outset gray;
 +
  }
 +
  .three-columns.flat-ul ul li {
 +
    float:left;
 +
    margin-left:1.5em;
 +
  }
 +
  .three-columns.flat-ul ul {
 +
    clear:both;
 +
    margin:0px 0px 0.5ex 0px;
 +
    padding:0px;
 +
  }
 +
  .three-columns.flat-ul p {
 +
    margin:5px 0px 0ex 0px;
 +
  }
 +
  .three-columns tr {
 +
    /* verhindere Spaltenumbruch */
 +
    -webkit-column-break-inside: avoid; /* Chrome, Safari */
 +
    page-break-inside: avoid;          /* Theoretically FF 20+ */
 +
    break-inside: avoid-column;        /* IE 11 */
 +
  }
 +
 +
/* booktable as in (scientific) books/journals  */
 +
table.booktable, table.booktabledotted {
 +
    margin: 1em 1em 1em 0;
 +
    background: #ffffff;
 +
    border-top:    2px #656463 solid;
 +
    border-bottom: 2px #656463 solid;
 +
    border-collapse: collapse;
 +
}
 +
.booktabledotted td {
 +
  border-bottom: 1px dotted gray;
 +
  padding:0.2em;
 +
}
 +
.booktable td {
 +
  border: 0px none !important;
 +
  padding:0.2em;
 +
}
 +
.booktable tr.line-t td, .booktable tr td.line-t{
 +
  border-top:    1px #656463 solid !important;
 +
}
 +
.booktable tr.line-b td, .booktable tr td.line-b{
 +
  border-bottom:    1px #656463 solid !important;
 +
}
 +
.booktable tr.line-tb td, .booktable tr td.line-tb{
 +
  border-bottom:    1px #656463 solid !important;
 +
  border-top:    1px #656463 solid !important;
 +
}
 +
.booktabledotted th, .booktable th {
 +
    vertical-align:bottom;
 +
    border-bottom:1px solid #656463;
 +
    border-top:  1px solid #656463;
 +
    border-left:0px;
 +
    border-right:0px;
 +
    padding: 0.2em;
 +
}
 +
.booktabledotted th, .booktable th {
 +
  background: #ffffff;
 +
  text-align: center;
 +
}
 +
.booktable caption, .booktabledotted caption {
 +
    font-weight: normal;
 +
}
 +
/* a plain table but vertical align top  */
 +
table.vertical-align-top td {  vertical-align:top;}
 +
table.vertical-align-bottom td {  vertical-align:bottom; }
 +
table.vertical-align-middle td {  vertical-align:middle; }
 +
 +
 +
/* references hanging layout */
 +
div.hanging-indent {
 +
  padding-left:1.5em !important;
 +
  text-indent:-1.5em;
 +
  margin-top: 0.0em !important;
 +
  margin-bottom: 0.0em !important;
 +
}
 +
 +
div.hanging-indent.compact-references p {
 +
  margin:0;
 +
}
 +
 +
div.hanging-indent p *
 +
, div.hanging-indent div *
 +
, div.hanging-indent ol *
 +
, div.hanging-indent ul *
 +
{
 +
  text-indent:0;
 +
}
 +
 +
/* nesting on talk pages
 +
  idea: border only each 2nd level down, not each level down
 +
*/
 +
.ns-talk .mw-body-content ul li > dl {
 +
    border-left:blanchedalmond 2px solid;
 +
}
 +
.ns-talk .mw-body-content ul li > dl > dd > dl > dd > dl {
 +
    border-left:navajowhite 2px solid;
 +
}
 +
.ns-talk .mw-body-content ul li > dl > dd > dl > dd > dl > dd > dl> dd > dl {
 +
    border-left:burlywood 1px solid;
 +
}
 +
 +
.ns-talk .mw-body-content p ~ dl {
 +
    border-left:blanchedalmond 2px solid;
 +
}
 +
.ns-talk .mw-body-content p ~ dl > dd > dl > dd > dl {
 +
    border-left:navajowhite 2px solid;
 +
}
 +
.ns-talk .mw-body-content p ~ dl > dd > dl > dd > dl > dd > dl> dd > dl {
 +
    border-left:burlywood 1px solid;
 +
}
 +
 +
/* for gray line numbers in:
 +
  <syntaxhighlight class="lineno-gray" lang="..." line >
 +
  </syntaxhighlight>
 +
*/
 +
.lineno-grey span.lineno,.lineno-gray span.lineno {
 +
    color:gray;
 +
}

Latest revision as of 10:51, 16 July 2020

/* CSS placed here will be applied to all skins */

/* inline definitions */
.definition-inline dt { float:left; padding-right:0.5em; margin-bottom: 0px; line-height: 1.5em;}
.definition-inline dd { margin-bottom: 0px;line-height: 1.6em;} /* line-height a bit higher, because dt in bold pushes line-height */
.definition-inline.code-bold-only dt { font-weight:normal; }
.definition-inline.code-bold-only dt code { font-weight:bold; }

/* 2 column Layout */
  .two-columns {
    -moz-column-count:2; /* Firefox */
    -webkit-column-count:2; /* Safari and Chrome */
    column-count:2;

    -moz-column-gap:40px; /* Firefox */
    -webkit-column-gap:40px; /* Safari and Chrome */
    column-gap:40px;

    -moz-column-rule:2px outset gray; /* Firefox */
    -webkit-column-rule:2px outset gray; /* Safari and Chrome */
    column-rule:2px outset gray;
  }
/* 3 column Layout */
  .three-columns {
    -moz-column-count:3; /* Firefox */
    -webkit-column-count:3; /* Safari and Chrome */
    column-count:3;

    -moz-column-gap:40px; /* Firefox */
    -webkit-column-gap:40px; /* Safari and Chrome */
    column-gap:40px;

    -moz-column-rule:2px outset gray; /* Firefox */
    -webkit-column-rule:2px outset gray; /* Safari and Chrome */
    column-rule:2px outset gray;
  }
  .three-columns.flat-ul ul li {
    float:left;
    margin-left:1.5em;
  }
  .three-columns.flat-ul ul {
    clear:both;
    margin:0px 0px 0.5ex 0px;
    padding:0px;
  }
  .three-columns.flat-ul p {
    margin:5px 0px 0ex 0px;
  }
  .three-columns tr {
    /* verhindere Spaltenumbruch */
    -webkit-column-break-inside: avoid; /* Chrome, Safari */
    page-break-inside: avoid;           /* Theoretically FF 20+ */
    break-inside: avoid-column;         /* IE 11 */
  }

/* booktable as in (scientific) books/journals  */
table.booktable, table.booktabledotted {
    margin: 1em 1em 1em 0;
    background: #ffffff;
    border-top:    2px #656463 solid;
    border-bottom: 2px #656463 solid;
    border-collapse: collapse;
}
.booktabledotted td {
  border-bottom: 1px dotted gray;
  padding:0.2em;
}
.booktable td {
  border: 0px none !important;
  padding:0.2em;
}
.booktable tr.line-t td, .booktable tr td.line-t{
   border-top:    1px #656463 solid !important;
}
.booktable tr.line-b td, .booktable tr td.line-b{
   border-bottom:    1px #656463 solid !important;
}
.booktable tr.line-tb td, .booktable tr td.line-tb{
   border-bottom:    1px #656463 solid !important;
   border-top:    1px #656463 solid !important;
}
.booktabledotted th, .booktable th {
    vertical-align:bottom;
    border-bottom:1px solid #656463;
    border-top:   1px solid #656463;
    border-left:0px;
    border-right:0px;
    padding: 0.2em;
}
.booktabledotted th, .booktable th {
  background: #ffffff;
  text-align: center;
}
.booktable caption, .booktabledotted caption {
    font-weight: normal;
}
/* a plain table but vertical align top  */
table.vertical-align-top td {  vertical-align:top;}
table.vertical-align-bottom td {  vertical-align:bottom; }
table.vertical-align-middle td {  vertical-align:middle; }


/* references hanging layout */
div.hanging-indent {
  padding-left:1.5em !important;
  text-indent:-1.5em;
  margin-top: 0.0em !important;
  margin-bottom: 0.0em !important;
}
 
div.hanging-indent.compact-references p {
  margin:0;
}

div.hanging-indent p *
, div.hanging-indent div * 
, div.hanging-indent ol * 
, div.hanging-indent ul * 
{
  text-indent:0;
}

/* nesting on talk pages 
  idea: border only each 2nd level down, not each level down
*/
.ns-talk .mw-body-content ul li > dl {
    border-left:blanchedalmond 2px solid;
}
.ns-talk .mw-body-content ul li > dl > dd > dl > dd > dl {
    border-left:navajowhite 2px solid;
}
.ns-talk .mw-body-content ul li > dl > dd > dl > dd > dl > dd > dl> dd > dl {
    border-left:burlywood 1px solid;
}

.ns-talk .mw-body-content p ~ dl {
    border-left:blanchedalmond 2px solid;
}
.ns-talk .mw-body-content p ~ dl > dd > dl > dd > dl {
    border-left:navajowhite 2px solid;
}
.ns-talk .mw-body-content p ~ dl > dd > dl > dd > dl > dd > dl> dd > dl {
    border-left:burlywood 1px solid;
}

/* for gray line numbers in:
   <syntaxhighlight class="lineno-gray" lang="..." line >
   </syntaxhighlight>
*/
.lineno-grey span.lineno,.lineno-gray span.lineno {
    color:gray;
}