src/lib/cwl-svg/assets/styles/style.css

   1 svg.cwl-workflow {
   2   background: white;
   3   color: #333;
   4   font-family: sans-serif;
   5   padding: 0;
   6   width: 100%;
   7   display: block;
   8   transform: translateZ(0); }
   9   svg.cwl-workflow [tabindex]:active, svg.cwl-workflow [tabindex]:focus {
  10     outline: none; }
  11   svg.cwl-workflow .hidden {
  12     display: none; }
  13   svg.cwl-workflow .workflow {
  14     user-select: none; }
  15   svg.cwl-workflow .pan-handle {
  16     fill: transparent; }
  17   svg.cwl-workflow .label {
  18     fill: #333;
  19     stroke: white;
  20     stroke-width: 4px;
  21     text-anchor: middle;
  22     paint-order: stroke;
  23     stroke-linecap: butt;
  24     stroke-linejoin: miter; }
  25   svg.cwl-workflow .node-icon {
  26     fill: #333;
  27     stroke: #333;
  28     stroke-width: 3px;
  29     stroke-linecap: round; }
  30   svg.cwl-workflow .node .outer {
  31     fill: white;
  32     stroke: #9a9a9a;
  33     stroke-width: 2px; }
  34   svg.cwl-workflow .node .inner {
  35     stroke: 0; }
  36   svg.cwl-workflow .node.input .inner {
  37     fill: #c3c3c3; }
  38   svg.cwl-workflow .node.output .inner {
  39     fill: #c3c3c3; }
  40   svg.cwl-workflow .node.step .inner {
  41     fill: #11a7a7; }
  42   svg.cwl-workflow .node .core .inner,
  43   svg.cwl-workflow .node .core .node-icon {
  44     pointer-events: none; }
  45   svg.cwl-workflow .node:hover .port .label {
  46     transition: all 0.1s;
  47     opacity: 1; }
  48   svg.cwl-workflow .node .port {
  49     fill: #9a9a9a; }
  50     svg.cwl-workflow .node .port:hover {
  51       stroke: #676767;
  52       stroke-width: 2px; }
  53     svg.cwl-workflow .node .port.output-port .label {
  54       text-anchor: start;
  55       transform: translate(10px, 0); }
  56     svg.cwl-workflow .node .port.input-port .label {
  57       text-anchor: end;
  58       transform: translate(-10px, 0); }
  59     svg.cwl-workflow .node .port .label {
  60       fill: #333;
  61       opacity: 0;
  62       font-size: .9em;
  63       user-select: none;
  64       transition: all .1s;
  65       pointer-events: none;
  66       alignment-baseline: middle; }
  67   svg.cwl-workflow .edge:hover .inner {
  68     stroke: #11a7a7; }
  69   svg.cwl-workflow .edge .inner, svg.cwl-workflow .edge .outer {
  70     fill: none;
  71     stroke-linecap: round; }
  72   svg.cwl-workflow .edge .inner {
  73     stroke-width: 2px;
  74     stroke: #9a9a9a; }
  75   svg.cwl-workflow .edge .outer {
  76     stroke-width: 5px;
  77     stroke: white; }
  78   svg.cwl-workflow .unselectable {
  79     user-select: none;
  80     cursor: pointer; }