.node { font: 300 11px "Helvetica Neue", Helvetica, Arial, sans-serif; fill: #bbb; fill-opacity: 0.2; } .node--sys-pri { font: 300 11px "Helvetica Neue", Helvetica, Arial, sans-serif; fill: #ffaaaa; fill-opacity: 0.2; } .node--sys-pub { font: 300 11px "Helvetica Neue", Helvetica, Arial, sans-serif; fill: #aaffaa; fill-opacity: 0.2; } .node--source { fill: #2ca02c; fill-opacity: 1; } .node--target { fill: #d62728; fill-opacity: 1; } .node--selected { fill: #ff7000; fill-opacity: 1; font-weight: 700; } .node:hover, .node--sys-pri:hover, .node--sys-pub:hover { fill: #000; fill-opacity: 1; } .node:hover, .node--sys-pri:hover, .node--sys-pub:hover, .node--source, .node--target { font-weight: 700; } .link { stroke: steelblue; stroke-opacity: 0.01; fill: none; pointer-events: none; } .link--violate { stroke: crimson; stroke-opacity: 0.1; stroke-width: 1.0px; fill: none; pointer-events: none; } .link--source, .link--target { stroke-opacity: 1; stroke-width: 2.5px; } .link--source { stroke: orange; } .link--target { stroke: #2ca02c; } button.violate { background-color: white; color: #333; cursor: pointer; padding: 5px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px; transition: 0.4s; } button.violate.active, button.violate:hover { background-color: #bb0000; } button.violate-list { background-color: #ffdddd; color: #333; cursor: pointer; padding: 5px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px; transition: 0.4s; } button.violate-list.active, button.violate-list:hover { background-color: #ff6666; } .violate-list-sym { background-color: #ffaaaa; padding: 3px; width: 100%; border: none; text-align: left; font-size: 14px; } span.cplusplus-sym { background-color: #ffffff; top: 10px; left: 20px; width: auto; height: auto; border: solid 1px blue; font-size: 18px; position: absolute; } #violate_list_column { width: 20%; height: 99vh; float: left; overflow: scroll; } #dep_graph_column { width: 80%; height: 99vh; float: right; overflow: scroll; } #reset_btn { position: absolute; margin: 20px; }