dox-sequence-diagram-ui/src/main/webapp/res/ecomp/asdc/sequencer/sequencer-diagram-svg.scss

   1 // Separate to allow for SVG-only styles, for application by Batik
   2 // to exported SVG on the service-side.
   3
   4 svg {
   5
   6     text {
   7         text-anchor: middle;
   8         color: $asdcsTextColor;
   9         stroke: none;
  10     }
  11
  12     g.asdcs-diagram-title {
  13         text {
  14             font-size: 40pt;
  15         }
  16     }
  17
  18     rect.asdcs-diagram-occurrence {
  19         stroke: $asdcsSVGStrokeColor;
  20         stroke-width: $asdcsSVGStrokeWidth;
  21         fill: $asdcsColorWhite;
  22     }
  23
  24     g.asdcs-diagram-message-container {
  25
  26         text.asdcs-diagram-message-label {
  27             fill: $asdcsSVGTextColorMessage;
  28             pointer-events: none;
  29             font-size: 28pt;
  30         }
  31
  32         rect.asdcs-diagram-message-label-bg {
  33             pointer-events: none;
  34             stroke: none;
  35             fill: $asdcsColorWhite;
  36             fill-opacity: 0.75;
  37         }
  38
  39         path.asdcs-diagram-message-selectable {
  40             stroke: $asdcsSVGSelectableColor;
  41             stroke-width: $asdcsSVGSelectableWidth;
  42             fill: none;
  43             opacity: $asdcsSVGSelectableOpacity;
  44             cursor: pointer;
  45         }
  46
  47         path.asdcs-diagram-message {
  48             pointer-events: none;
  49             stroke: $asdcsSVGStrokeColorMessage;
  50             stroke-width: $asdcsSVGStrokeWidth;
  51             fill: none;
  52             &.asdcs-diagram-message-response {
  53                 stroke-dasharray: 30, 10;
  54             }
  55         }
  56
  57         rect.asdcs-diagram-message-bg {
  58             stroke: none;
  59             fill: $asdcsColorWhite;
  60         }
  61
  62         &.asdcs-active {
  63             path.asdcs-diagram-message {
  64                 stroke: $asdcsSVGStrokeActiveColor;
  65                 stroke-width: $asdcsSVGStrokeActiveWidth;
  66             }
  67             rect.asdcs-diagram-message-bg {
  68                 // Not FF:
  69                 // filter: url(#asdcsSvgHighlight);
  70             }
  71             rect.asdcs-diagram-message-label-bg {
  72                 fill: #fafafa;
  73             }
  74         }
  75
  76         .asdcs-diagram-notes-container {
  77             display: none;
  78             path {
  79                 fill:none;
  80                 stroke: $asdcsSVGStrokeColor;
  81                 stroke-width: 6px;
  82             }
  83             text {
  84                 font-weight: bold;
  85                 font-size: 40px;
  86                 text-anchor: start;
  87             }
  88         }
  89
  90         &.asdcs-active {
  91             .asdcs-diagram-notes-container {
  92                 display: block;
  93             }
  94         }
  95
  96     }
  97
  98     g.asdcs-diagram-lifeline-container {
  99
 100         rect.asdcs-diagram-lifeline-heading-box {
 101             stroke: $asdcsColorThree;
 102             stroke-width: $asdcsSVGStrokeWidth;
 103             fill: $asdcsColorWhite;
 104             cursor: pointer;
 105         }
 106
 107         text.asdcs-diagram-lifeline-heading-label {
 108             font-size: 36px;
 109             pointer-events: none;
 110         }
 111
 112         path.asdcs-diagram-lifeline-selectable {
 113             stroke: $asdcsSVGSelectableColor;
 114             stroke-width: $asdcsSVGSelectableWidth;
 115             opacity: $asdcsSVGSelectableOpacity;
 116             cursor: pointer;
 117         }
 118
 119         path.asdcs-diagram-lifeline {
 120             pointer-events: none;
 121             fill: $asdcsSVGStrokeColor;
 122             stroke: $asdcsSVGStrokeColorLifeline;
 123             stroke-width: $asdcsSVGStrokeWidth;
 124             stroke-dasharray: 40, 10;
 125         }
 126
 127         rect.asdcs-diagram-lifeline-bg {
 128             stroke: none;
 129             fill:white;
 130         }
 131
 132         &.asdcs-active {
 133             rect.asdcs-diagram-lifeline-heading-box, path.asdcs-diagram-lifeline {
 134                 stroke: $asdcsSVGStrokeActiveColor;
 135                 stroke-width: $asdcsSVGStrokeActiveWidth;
 136             }
 137             rect {
 138                 // Not supported by FF:
 139                 // filter:url(#asdcsSvgHighlight);
 140             }
 141         }
 142     }
 143
 144     .asdcs-diagram-fragment {
 145
 146         rect {
 147             stroke: $asdcsSVGStrokeColorFragment;
 148             stroke-width: $asdcsSVGStrokeWidth;
 149             fill: none;
 150         }
 151
 152         rect.asdcs-diagram-fragment-guard-bg {
 153             pointer-events: none;
 154             stroke: none;
 155             fill: $asdcsColorWhite;
 156             fill-opacity: 0.75;
 157         }
 158
 159         text {
 160             font-size: 28pt;
 161             text-anchor: start;
 162             &.asdcs-diagram-fragment-guard {
 163                 fill: #888;
 164             }
 165         }
 166
 167         path {
 168             stroke: $asdcsSVGStrokeColor;
 169             stroke-width: $asdcsSVGStrokeWidth;
 170             fill: none;
 171         }
 172     }
 173
 174     #asdcsDiagramArrowOpen, #asdcsDiagramArrowClosed, #asdcsDiagramArrowSolid {
 175         stroke: $asdcsSVGStrokeColor;
 176     }
 177
 178     #asdcsDiagramArrowOpen {
 179         fill:none;
 180     }
 181
 182     #asdcsDiagramArrowClosed {
 183         fill:white;
 184     }
 185
 186     #asdcsDiagramArrowSolid {
 187         fill:$asdcsSVGStrokeColor;
 188     }
 189 }