summaryrefslogtreecommitdiffstats
path: root/dox-sequence-diagram-ui/src/main/webapp/res/ecomp/asdc/sequencer/sequencer-diagram-svg.scss
blob: 310c4d0c405d7928548de2338f4fe51231b05ad1 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
// Separate to allow for SVG-only styles, for application by Batik
// to exported SVG on the service-side.

svg {

    text {
        text-anchor: middle;
        color: $asdcsTextColor;
        stroke: none;
    }

    g.asdcs-diagram-title {
        text {
            font-size: 40pt;
        }
    }

    rect.asdcs-diagram-occurrence {
        stroke: $asdcsSVGStrokeColor;
        stroke-width: $asdcsSVGStrokeWidth;
        fill: $asdcsColorWhite;
    }

    g.asdcs-diagram-message-container {

        text.asdcs-diagram-message-label {
            fill: $asdcsSVGTextColorMessage;
            pointer-events: none;
            font-size: 28pt;
        }

        rect.asdcs-diagram-message-label-bg {
            pointer-events: none;
            stroke: none;
            fill: $asdcsColorWhite;
            fill-opacity: 0.75;
        }

        path.asdcs-diagram-message-selectable {
            stroke: $asdcsSVGSelectableColor;
            stroke-width: $asdcsSVGSelectableWidth;
            fill: none;
            opacity: $asdcsSVGSelectableOpacity;
            cursor: pointer;
        }

        path.asdcs-diagram-message {
            pointer-events: none;
            stroke: $asdcsSVGStrokeColorMessage;
            stroke-width: $asdcsSVGStrokeWidth;
            fill: none;
            &.asdcs-diagram-message-response {
                stroke-dasharray: 30, 10;
            }
        }

        rect.asdcs-diagram-message-bg {
            stroke: none;
            fill: $asdcsColorWhite;
        }

        &.asdcs-active {
            path.asdcs-diagram-message {
                stroke: $asdcsSVGStrokeActiveColor;
                stroke-width: $asdcsSVGStrokeActiveWidth;
            }
            rect.asdcs-diagram-message-bg {
                // Not FF:
                // filter: url(#asdcsSvgHighlight);
            }
            rect.asdcs-diagram-message-label-bg {
                fill: #fafafa;
            }
        }

        .asdcs-diagram-notes-container {
            display: none;
            path {
                fill:none;
                stroke: $asdcsSVGStrokeColor;
                stroke-width: 6px;
            }
            text {
                font-weight: bold;
                font-size: 40px;
                text-anchor: start;
            }
        }

        &.asdcs-active {
            .asdcs-diagram-notes-container {
                display: block;
            }
        }

    }

    g.asdcs-diagram-lifeline-container {

        rect.asdcs-diagram-lifeline-heading-box {
            stroke: $asdcsColorThree;
            stroke-width: $asdcsSVGStrokeWidth;
            fill: $asdcsColorWhite;
            cursor: pointer;
        }

        text.asdcs-diagram-lifeline-heading-label {
            font-size: 36px;
            pointer-events: none;
        }

        path.asdcs-diagram-lifeline-selectable {
            stroke: $asdcsSVGSelectableColor;
            stroke-width: $asdcsSVGSelectableWidth;
            opacity: $asdcsSVGSelectableOpacity;
            cursor: pointer;
        }

        path.asdcs-diagram-lifeline {
            pointer-events: none;
            fill: $asdcsSVGStrokeColor;
            stroke: $asdcsSVGStrokeColorLifeline;
            stroke-width: $asdcsSVGStrokeWidth;
            stroke-dasharray: 40, 10;
        }

        rect.asdcs-diagram-lifeline-bg {
            stroke: none;
            fill:white;
        }

        &.asdcs-active {
            rect.asdcs-diagram-lifeline-heading-box, path.asdcs-diagram-lifeline {
                stroke: $asdcsSVGStrokeActiveColor;
                stroke-width: $asdcsSVGStrokeActiveWidth;
            }
            rect {
                // Not supported by FF:
                // filter:url(#asdcsSvgHighlight);
            }
        }
    }

    .asdcs-diagram-fragment {

        rect {
            stroke: $asdcsSVGStrokeColorFragment;
            stroke-width: $asdcsSVGStrokeWidth;
            fill: none;
        }

        rect.asdcs-diagram-fragment-guard-bg {
            pointer-events: none;
            stroke: none;
            fill: $asdcsColorWhite;
            fill-opacity: 0.75;
        }

        text {
            font-size: 28pt;
            text-anchor: start;
            &.asdcs-diagram-fragment-guard {
                fill: #888;
            }
        }

        path {
            stroke: $asdcsSVGStrokeColor;
            stroke-width: $asdcsSVGStrokeWidth;
            fill: none;
        }
    }

    #asdcsDiagramArrowOpen, #asdcsDiagramArrowClosed, #asdcsDiagramArrowSolid {
        stroke: $asdcsSVGStrokeColor;
    }

    #asdcsDiagramArrowOpen {
        fill:none;
    }

    #asdcsDiagramArrowClosed {
        fill:white;
    }

    #asdcsDiagramArrowSolid {
        fill:$asdcsSVGStrokeColor;
    }
}