Difference between revisions of "Template:Clade/styles.css"

From blackwiki
Jump to navigation Jump to search
imported>Jts1882
(position:relative; for barlabel and grouplabel)
imported>Jts1882
(update to match updated module)
Line 11: Line 11:
 
     width:100%;
 
     width:100%;
 
}
 
}
 +
 
table.clade td.clade-label {  /* the cell with the label */
 
table.clade td.clade-label {  /* the cell with the label */
 
     width:0.7em; /* was only used for first leaf but shouldn't matter for others */
 
     width:0.7em; /* was only used for first leaf but shouldn't matter for others */
     padding:0 0.2em;
+
     padding:0 0.15em;
 
     vertical-align:bottom;
 
     vertical-align:bottom;
 
     text-align:center;
 
     text-align:center;
     border-left: 1px solid;  /* don't set default colour, helps with green on black monotype skin  */
+
     border-left:1px solid;  /* don't set default colour, helps with green on black monotype skin  */
     border-bottom: 1px solid;
+
     border-bottom:1px solid;
 +
    white-space:nowrap;
 +
    overflow:hidden;
 +
    text-overflow:ellipsis;
 +
}
 +
table.clade td.clade-label:hover {
 +
overflow:visible;
 
}
 
}
 
table.clade td.clade-label.first {
 
table.clade td.clade-label.first {
border-left: none;
+
border-left:none;
border-right: none;
+
border-right:none;
 
}
 
}
 
table.clade td.clade-label.reverse {
 
table.clade td.clade-label.reverse {
border-left: none;
+
border-left:none;
border-right: 1px solid;
+
border-right:1px solid;
 
}
 
}
 
table.clade td.clade-slabel {  /* the cell with the sublabel; only use if there is a label */
 
table.clade td.clade-slabel {  /* the cell with the sublabel; only use if there is a label */
Line 32: Line 39:
 
     text-align:center;
 
     text-align:center;
 
     border-left: 1px solid;
 
     border-left: 1px solid;
 +
    white-space:nowrap;
 
}
 
}
 +
 
table.clade td.clade-slabel.last  {
 
table.clade td.clade-slabel.last  {
border-left: none;
+
border-left:none;
border-right: none;
+
border-right:none;
 
}
 
}
 
table.clade td.clade-slabel.reverse {
 
table.clade td.clade-slabel.reverse {
border-left: none;
+
border-left:none;
border-right: 1px solid;
+
border-right:1px solid;
 
}
 
}
  
Line 50: Line 59:
 
table.clade td.clade-bar.reverse {
 
table.clade td.clade-bar.reverse {
 
     text-align:right;
 
     text-align:right;
 +
    position:relative;
 
}
 
}
  
Line 64: Line 74:
 
table.clade td.clade-leaf.reverse {  /* the cell with the leaf content (rowspan=2) */
 
table.clade td.clade-leaf.reverse {  /* the cell with the leaf content (rowspan=2) */
 
     text-align:right;
 
     text-align:right;
 +
}
 +
 +
table.clade:hover span.linkA {
 +
    background-color: yellow;
 +
}
 +
table.clade:hover span.linkB {
 +
    background-color: green;
 
}
 
}

Revision as of 12:47, 29 December 2019

/* {{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%;
}

table.clade td.clade-label {  /* the cell with the label */
    width:0.7em; /* was only used for first leaf but shouldn't matter for others */
    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;
    overflow:hidden;
    text-overflow:ellipsis;
}
table.clade td.clade-label: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.2em;
    vertical-align:top;
    text-align:center;
    border-left: 1px solid;
    white-space:nowrap;
}

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;
}