Template:Clade/styles.css: Difference between revisions
Jump to navigation
Jump to search
(Use content:<word joiner> instead of HTML whitespace, and make spacing of vertical lines more consistent.) |
m (1 revision imported) |
Latest revision as of 01:34, 5 December 2023
/* {{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;
}