Difference between revisions of "Template:Diagonal split header/doc"

From blackwiki
Jump to navigation Jump to search
imported>Jc86035
m (→‎Usage: use mw-collapsible class)
imported>Cmglee
(→‎Usage: Update documentation)
Line 20: Line 20:
  
 
As the effect is achieved by drawing a diagonal line across the cell, the two headers are still part of the same cell and can easily overrun the line. A remedy is to pad the headers with non-breaking spaces (<code>&amp;nbsp;</code>) and/or line breaks (<code>&lt;br /&gt;</code>), as in the example above. The template user is responsible for checking that it does not overrun on common Web browsers.
 
As the effect is achieved by drawing a diagonal line across the cell, the two headers are still part of the same cell and can easily overrun the line. A remedy is to pad the headers with non-breaking spaces (<code>&amp;nbsp;</code>) and/or line breaks (<code>&lt;br /&gt;</code>), as in the example above. The template user is responsible for checking that it does not overrun on common Web browsers.
 +
 +
A third parameter can be added to change the background colour from the standard header cell colour. Changing it to <code>white</code>, <code>#fff</code>, or <code>#f8f9fa</code> (the standard non-header background colour) lets the template be applied to non-header cells. Prefix it with <code>|</code> instead of <code>!</code>, as in this ''Friend or Foe?'' payoff matrix:
 +
{| class="wikitable" style="margin-left:auto;margin-right:auto;text-align:center;"
 +
! {{diagonal split header|{{color|#009|Pair 1}}|{{color|#900|Pair 2}}}}
 +
! scope="col" style="width:6em;" | {{color|#900|"Friend"<br />(cooperate)}}
 +
! scope="col" style="width:6em;" | {{color|#900|"Foe"<br />(defect)}}
 +
|-
 +
! scope="row" style="width:6em;" | {{color|#009|"Friend"<br />(cooperate)}}
 +
| {{diagonal split header|{{color|#009|1}}|{{color|#900|1}}|white}}
 +
| {{diagonal split header|{{color|#009|0}}|{{color|#900|2}}|white}}
 +
|-
 +
! scope="row" | {{color|#009|"Foe"<br />(defect)}}
 +
| {{diagonal split header|{{color|#009|2}}|{{color|#900|0}}|white}}
 +
| {{diagonal split header|{{color|#009|0}}|{{color|#900|0}}|white}}
 +
|}
  
 
The template is compatible with collapsible tables, and cells using colspan or rowspan, in which case place the colspan/rowspan attribute between <code>!</code> and <code><nowiki>{{diagonal split header &hellip;}}</nowiki></code>. It is not compatible with sortable tables, as the sort arrows are not drawn, but this problem can be resolved by using a second header row:
 
The template is compatible with collapsible tables, and cells using colspan or rowspan, in which case place the colspan/rowspan attribute between <code>!</code> and <code><nowiki>{{diagonal split header &hellip;}}</nowiki></code>. It is not compatible with sortable tables, as the sort arrows are not drawn, but this problem can be resolved by using a second header row:

Revision as of 12:55, 6 July 2017

Usage

This template simulates a table header cell split diagonally, a device often used to compactly label headers of rows and columns, as in this example:

To
From 
Solid Liquid Gas
Solid Solid-solid transformation Melting Sublimation
Liquid Freezing Boiling/evaporation
Gas Deposition Condensation

To use it, create a header cell using ! followed by {{diagonal split header|NATURE-OF-ROW-HEADERS|NATURE-OF-COLUMN-HEADERS}}.

As the effect is achieved by drawing a diagonal line across the cell, the two headers are still part of the same cell and can easily overrun the line. A remedy is to pad the headers with non-breaking spaces (&nbsp;) and/or line breaks (<br />), as in the example above. The template user is responsible for checking that it does not overrun on common Web browsers.

A third parameter can be added to change the background colour from the standard header cell colour. Changing it to white, #fff, or #f8f9fa (the standard non-header background colour) lets the template be applied to non-header cells. Prefix it with | instead of !, as in this Friend or Foe? payoff matrix:

Pair 2
Pair 1
"Friend"
(cooperate)
"Foe"
(defect)
"Friend"
(cooperate)
1
1
2
0
"Foe"
(defect)
0
2
0
0

The template is compatible with collapsible tables, and cells using colspan or rowspan, in which case place the colspan/rowspan attribute between ! and {{diagonal split header …}}. It is not compatible with sortable tables, as the sort arrows are not drawn, but this problem can be resolved by using a second header row:

n
Township
2025 2026
Nov Dec Jan
Aoraki Mount Cook 8 1 6
Aparima Riverton 3 5 7
Waiau Franz Josef 4 9 2

Template data

Simulate a table header cell split diagonally

Template parameters

ParameterDescriptionTypeStatus
Rows1

header of row headers, shown on the bottom left

Example
''Y-axis''
Stringrequired
Columns2

header of column headers, shown on the top right

Example
{{color|#6cf|X-axis}}
Stringrequired
Background colour3

Optional colour of background, otherwise the standard header background is used

Default
#eaecf0
Example
#f8f9fa
Stringoptional