html, body, .dependency_graph, .dependency_graph svg{ width: 100%; height: 100%; padding: 0px; margin: 0px; font: 10px sans-serif; } .loading{ position: absolute; top: 30px; left: 0px; text-align: center; width: 100%; font-size: 3rem; } .link { fill: none; stroke: #666; stroke-width: 1.5px; } circle { fill: #fff; stroke: #333; stroke-width: 1.5px; } .fixed circle { stroke-width: 3px; } text { font: 10px sans-serif; pointer-events: none; text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff; } text.type{ font: 7px sans-serif; } .downlighted, .name_ignored, .type_ignored{ opacity: 0.1; } .highlighted, .name_highlighted, .type_highlighted{ fill: #008ef3; } .highlighted circle, .name_highlighted circle, .type_highlighted circle{ stroke: #008ef3; } .hide_namespace .namespace, .link.hide_relation{ display: none; } /* ============================ */ /* Toolbox style */ /* ============================ */ .toolbox{ position: fixed; top: 0px; left: 0px; max-height: 100%; width: 200px; background: white; border-right: 1px solid #ddd; display: none; overflow: auto; } .panel .title{ padding: 10px; font-weight: bold; text-transform: uppercase; cursor: pointer; border-bottom: 1px solid #ddd; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; background: #eee; } .panel .title:hover{ background: #ddd; } .panel .content{ border-bottom: 1px solid #ddd; padding: 5px; } .panel label{ display: block; margin-top: 10px; margin-bottom: 5px; } .panel textarea{ display: block; width: 100%; max-width: 100%; height: 100px; padding: 0px; border: 1px solid #ddd } .panel input[type=button], .panel input[type=range], .panel button{ width: 100%; max-width: 100%; display: block; } ul, ol{ list-style-position: inside; white-space: nowrap; margin: 0px; padding-left: 0px; max-width: 100%; overflow: auto; }