Template:Clade/styles.css

From IxWiki
Revision as of 17:28, 29 March 2023 by Insui (talk | contribs) (Created page with "→‎{{pp-template}}: table.clade { border-spacing:0; margin:0; font-size:100%; line-height:100%; border-collapse:separate; width:auto; } table.clade table.clade { width:100%; line-height:inherit; } table.clade td.clade-label { →‎the cell with the label: min-width:0.2em; →‎both min-width and width seem to be needed to get consistent behaviour: width:0.1em; padding:0 0.15em; vertical-align:bottom; text-align:center;...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search
/* {{pp-template}} */
table.clade {
    border-spacing:0;
    margin:0;
    font-size:100%;
    line-height:100%;
    border-collapse:separate;
    width:auto;
}
table.clade table.clade {
    width:100%;
    line-height:inherit;
}

table.clade td.clade-label {  /* the cell with the label */
	min-width:0.2em; /* both min-width and width seem to be needed to get consistent behaviour */
	width:0.1em;
    padding:0 0.15em;
    vertical-align:bottom;
    text-align:center;
    border-left:1px solid;   /* don't set default colour, helps with green on black monotype skin  */
    border-bottom:1px solid;
    white-space:nowrap;
}
table.clade td.clade-label::before, table.clade td.clade-slabel::before {
	content: "\2060";
}
table.clade td.clade-fixed-width {
    overflow:hidden;
    text-overflow:ellipsis;
}
table.clade td.clade-fixed-width:hover {
	overflow:visible;
}
table.clade td.clade-label.first {
	border-left:none;
	border-right:none;
}
table.clade td.clade-label.reverse {
	border-left:none;
	border-right:1px solid;
}
table.clade td.clade-slabel {  /* the cell with the sublabel; only use if there is a label */
    padding:0 0.15em;
    vertical-align:top;
    text-align:center;
    border-left: 1px solid;
    white-space:nowrap;
}
table.clade td.clade-slabel:hover {
	overflow:visible;
}
table.clade td.clade-slabel.last  {
	border-left:none;
	border-right:none;
}
table.clade td.clade-slabel.reverse {
	border-left:none;
	border-right:1px solid;
}

table.clade td.clade-bar {  /* the cell with the bar label or group label */
    vertical-align:middle;
    text-align:left;
    padding:0 0.5em;
    position:relative;
}
table.clade td.clade-bar.reverse {
    text-align:right;
    position:relative;
}

table.clade td.clade-leaf {  /* the cell with the leaf content (rowspan=2) */
    border:0;
    padding:0;
    text-align:left;
}
table.clade td.clade-leafR {  /* the cell with the leaf content (rowspan=2) */
    border:0;
    padding:0;
    text-align:right;
}
table.clade td.clade-leaf.reverse {  /* the cell with the leaf content (rowspan=2) */
    text-align:right;
}

table.clade:hover span.linkA {
     background-color: yellow;
}
table.clade:hover span.linkB {
     background-color: green;
}