.d3-tip { line-height: 1; padding: 2px; background: rgba(0, 0, 0, 0.8); color: #fff; border-radius: 2px; font-size: 6px; } /* Creates a small triangle extender for the tooltip */ .d3-tip:after { box-sizing: border-box; display: inline; font-size: 6px; width: 100%; line-height: 1; color: rgba(0, 0, 0, 0.8); content: "\25BC"; position: absolute; text-align: center; } /* Style northward tooltips differently */ .d3-tip.n:after { margin: -1px 0 0 0; top: 100%; left: 0; } /* SVG element */ /* Way to add borders in SVG - https://stackoverflow.com/questions/18330344/how-to-add-border-outline-stroke-to-svg-elements-in-css */ .frame { fill: none; stroke: rgba(255, 255, 255, 0.25); stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; } /* Transparency simulates sub pixel border https://stackoverflow.com/questions/13891177/css-border-less-than-1px */ .d3-flame-graph-label:hover { border: 1px dotted; border-color: rgba(255, 255, 255, 0.75); } /* .d3-flame-graph-label:hover { border: 1px solid; border-color: rgba(255, 255, 255, 0.75); } */