esdoc-plugin-dependency-graphs/template/html/style.css

A plugin for ESDoc that adds interactive D3 powered dependency graphs for source code including linking JSPM / NPM managed code and packages.

body {
   background: #fff;
   padding:0;
   margin:0;
   font-family: 'Roboto', sans-serif;
   overflow: hidden;

   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   user-select: none;
}

.graph {
   position: fixed;
   top: 0;
   left: 0;
   width:100%;
   height: 100%;
   overflow: hidden;
}

svg {
   position: fixed;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   cursor: move;
}

g.dimmed  {
   stroke-opacity: 0.05;
}

g.dimmed text.shadow {
   stroke-opacity: 0;
}

circle {
   fill: #ccc;
   stroke: #333;
   stroke-width: 2px;
   cursor: hand;
}

circle.npm {
   fill: rgb(237,151,158);
}

circle.github {
   fill: rgb(255,210,87);
}

circle.selected {
   fill: #00ff00;
}

text {
   font: 10px sans-serif;
   pointer-events: none;
}

text.shadow {
   stroke: #fff;
   stroke-width: 3px;
   stroke-opacity: .8;
}

text.isAliased {
   fill: #ff0000;
}

path.link {
   fill: none;
   stroke: #666;
   stroke-width: 1.5px;
}

path.link.licensing {
   stroke: green;
}

path.link.resolved {
   stroke-dasharray: 0,2 1;
}

.control-button {
   position: relative;
   float: left;
   background: rgba(240, 240, 240, 0.9);
   padding: 5px;
   margin-top: 5px;
   margin-left: 10px;
   border-radius: 7px;
   z-index: 10;
}

.control-level {
   position: relative;
   float: left;
   width: 200px;
   background: rgba(240, 240, 240, 0.9);
   padding: 16px 5px 16px 5px;
   margin-top: 5px;
   margin-left: 10px;
   border-radius: 7px;
   z-index: 10;
}

.control-toggles {
   position: relative;
   float: left;
   background: rgba(240, 240, 240, 0.9);
   padding: 13px 18px 13px 18px;
   margin-top: 5px;
   margin-left: 10px;
   border-radius: 7px;
   z-index: 10;
}

.control-table {
   position: relative;
   clear: both;
   float: left;
   background: rgba(240, 240, 240, 0.9);
   padding: 8px;
   margin-top: 10px;
   margin-left: 10px;
   border-radius: 7px;
   z-index: 10;
}

.control-table-inner {
   position: relative;
   /*padding: 0 5px;*/
   overflow-x: hidden;
   overflow-y: auto;
}

.flex-center-left {
   display: flex;
   align-items: center;
   justify-content: left;
}

td.isAliased {
   color: #f00;
}

.material-icon-blue {
   color: #3f51b5;
}

.mdl-menu {
   padding: 0;
}

.mdl-menu__item {
   height: 32px;
   line-height: 32px;
   padding: 0 8px;
}

li.mdl-menu__item:hover
{
   background-color: #87cefa;
}

.mdl-data-table {
   background-color: rgba(255, 255, 255, 0.2);
}

.mdl-data-table tbody tr {
   height: 14px;
}

.mdl-data-table tbody tr:hover
{
   background-color: rgba(255, 255, 255, 0.8);
   cursor: pointer;
}

.mdl-data-table td
{
   height: 14px;
   line-height: 14px;
   padding: 4px 8px;
   vertical-align: bottom;
}

.mdl-data-table th {
   height: 14px;
   line-height: 14px;
   padding: 8px 4px 8px 16px;
   vertical-align: bottom;
}

.mdl-data-table thead th:hover
{
   background-color: rgba(255, 255, 255, 0.8);
   cursor: pointer;
}

.mdl-data-table th:first-of-type
{
   padding-left: 16px;
}

.mdl-data-table th:last-of-type
{
   padding-right: 8px;
}

.mdl-data-table td:first-of-type
{
   padding-left: 12px;
}

.mdl-data-table td:last-of-type
{
   padding-right: 12px;
}

.mdl-data-table td:not(:first-child), .mdl-data-table th:not(:first-child)
{
   border-left: 1px solid rgba(100, 100, 100, 0.1);
}

.tablesorter-stickyHeader {
   background-color: rgb(245, 245, 245);
}

th.tablesorter-header {
   background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
   font-weight: bold;
   background-repeat: no-repeat;
   background-position: center left;
   outline : none;
}

th.tablesorter-headerAsc {
   background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
   outline : none;
}

th.tablesorter-headerDesc {
   background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
   outline : none;
}

/**
 * Scrollbars
 */
::-webkit-scrollbar
{
   height: 10px !important;
   overflow: visible !important;
   width: 10px !important;
}

::-webkit-scrollbar-thumb
{
   background: -webkit-linear-gradient(left, rgba(225,225,225,0.9) 0%,rgba(240,240,240,0.9) 100%) !important;
   background-clip: padding-box !important;
   border: 2px solid transparent !important;
   border-image: initial !important;
   min-height: 28px !important;
   padding: 100px 0 0 !important;
   box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 0 inset, rgba(0, 0, 0, 0.0666667) 0 -1px 0 inset !important;

   -moz-border-radius: 5px !important;    /* Firefox 3.6-, removed in Firefox 13 */
   -webkit-border-radius: 5px !important; /* Safari 4-, Chrome 3- */
   border-radius: 5px !important;         /* Firefox 4+, Safari 5+, Chrome 4+, Opera 10.5+, IE9+ */
}

::-webkit-scrollbar-thumb:hover
{
   background: -webkit-linear-gradient(left, rgba(235,235,235,0.9) 0%,rgba(250,250,250,0.9) 100%) !important;
   background-clip: padding-box !important;

   -moz-border-radius: 5px !important;    /* Firefox 3.6-, removed in Firefox 13 */
   -webkit-border-radius: 5px !important; /* Safari 4-, Chrome 3- */
   border-radius: 5px !important;         /* Firefox 4+, Safari 5+, Chrome 4+, Opera 10.5+, IE9+ */
}

::-webkit-scrollbar-thumb:window-inactive
{
   background: -webkit-linear-gradient(left, rgba(225,225,225,0.9) 0%,rgba(240,240,240,0.9) 100%) !important;
   background-clip: padding-box !important;

   -moz-border-radius: 5px !important;    /* Firefox 3.6-, removed in Firefox 13 */
   -webkit-border-radius: 5px !important; /* Safari 4-, Chrome 3- */
   border-radius: 5px !important;         /* Firefox 4+, Safari 5+, Chrome 4+, Opera 10.5+, IE9+ */
}

::-webkit-scrollbar-button
{
   height: 0 !important;
   width: 0 !important;
}

::-webkit-scrollbar-track
{
   background-color: rgba(32, 90, 112, 0.3);

   /*background: rgba(0, 0, 0, 0.1) !important;*/
   -moz-border-radius: 5px !important;    /* Firefox 3.6-, removed in Firefox 13 */
   -webkit-border-radius: 5px !important; /* Safari 4-, Chrome 3- */
   border-radius: 5px !important;         /* Firefox 4+, Safari 5+, Chrome 4+, Opera 10.5+, IE9+ */
}

::-webkit-scrollbar-corner
{
   background: transparent !important;
}