184 lines
No EOL
2.8 KiB
CSS
184 lines
No EOL
2.8 KiB
CSS
.svgCanvas {
|
|
cursor: crosshair;
|
|
background-color: #eee;
|
|
}
|
|
|
|
.svgCanvas.dragging {
|
|
cursor: grabbing !important;
|
|
}
|
|
|
|
/* do not render helpers while dragging something */
|
|
.svgCanvas.dragging .helper:hover {
|
|
visibility: hidden !important;
|
|
}
|
|
|
|
.svgCanvas.active {
|
|
/* background-color: rgb(255, 140, 0, 0.2); */
|
|
}
|
|
|
|
.svgCanvas text {
|
|
user-select: none;
|
|
}
|
|
|
|
/* rectangle drawn while a selection is being made */
|
|
.selecting {
|
|
fill: blue;
|
|
fill-opacity: 0.2;
|
|
stroke-width: 1px;
|
|
stroke:black;
|
|
stroke-dasharray: 7 6;
|
|
}
|
|
|
|
.rountangle {
|
|
fill: white;
|
|
stroke: black;
|
|
stroke-width: 2px;
|
|
}
|
|
|
|
.rountangle.selected {
|
|
/* fill: rgba(0, 0, 255, 0.2); */
|
|
}
|
|
.rountangle.error {
|
|
stroke: var(--error-color);
|
|
}
|
|
.rountangle.active {
|
|
stroke: rgb(192, 125, 0);
|
|
fill:rgb(255, 251, 244);
|
|
filter: drop-shadow( 0px 0px 3px rgba(192, 125, 0, 0.85));
|
|
}
|
|
|
|
.selected:hover:not(:active) {
|
|
cursor: grab;
|
|
}
|
|
|
|
line.helper {
|
|
stroke: rgba(0, 0, 0, 0);
|
|
stroke-width: 16px;
|
|
}
|
|
line.helper:hover:not(:active) {
|
|
stroke: blue;
|
|
stroke-opacity: 0.2;
|
|
cursor: grab;
|
|
}
|
|
|
|
path.helper {
|
|
fill: none;
|
|
stroke: rgba(0, 0, 0, 0);
|
|
stroke-width: 16px;
|
|
}
|
|
path.helper:hover:not(:active) {
|
|
stroke: blue;
|
|
stroke-opacity: 0.2;
|
|
cursor: grab;
|
|
}
|
|
|
|
circle.helper {
|
|
fill: rgba(0, 0, 0, 0);
|
|
}
|
|
circle.helper:hover:not(:active) {
|
|
fill: blue;
|
|
fill-opacity: 0.2;
|
|
cursor: grab;
|
|
}
|
|
|
|
.rountangle.or {
|
|
stroke-dasharray: 7 6;
|
|
fill: #eee;
|
|
}
|
|
|
|
.arrow {
|
|
fill: none;
|
|
stroke: black;
|
|
stroke-width: 2px;
|
|
}
|
|
.arrow.selected {
|
|
stroke: blue;
|
|
stroke-width: 3px;
|
|
}
|
|
|
|
.arrow::marker {
|
|
fill: content-stroke;
|
|
}
|
|
|
|
#arrowEnd {
|
|
fill: context-stroke;
|
|
}
|
|
#initialMarker {
|
|
fill: context-stroke;
|
|
}
|
|
|
|
.arrow:hover {
|
|
cursor: grab;
|
|
}
|
|
|
|
line.selected, circle.selected {
|
|
fill: rgba(0, 0, 255, 0.2);
|
|
/* stroke-dasharray: 7 6; */
|
|
stroke: blue;
|
|
stroke-width: 4px;
|
|
}
|
|
|
|
.draggableText.selected, .draggableText.selected:hover {
|
|
fill: blue;
|
|
font-weight: 600;
|
|
}
|
|
.draggableText:hover:not(:active) {
|
|
/* fill: blue; */
|
|
/* cursor: grab; */
|
|
}
|
|
text.helper {
|
|
fill: rgba(0,0,0,0);
|
|
stroke: rgba(0,0,0,0);
|
|
stroke-width: 16px;
|
|
}
|
|
text.helper:hover {
|
|
stroke: blue;
|
|
stroke-opacity: 0.2;
|
|
cursor: grab;
|
|
}
|
|
|
|
.draggableText, .draggableText.highlight {
|
|
paint-order: stroke;
|
|
stroke: white;
|
|
stroke-width: 4px;
|
|
stroke-linecap: butt;
|
|
stroke-linejoin: miter;
|
|
stroke-opacity: 1;
|
|
fill-opacity:1;
|
|
}
|
|
|
|
.draggableText.highlight:not(.selected) {
|
|
fill: green;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.highlight:not(.selected):not(text) {
|
|
stroke: green;
|
|
stroke-width: 3px;
|
|
fill: none;
|
|
}
|
|
|
|
.arrow.error {
|
|
stroke: var(--error-color);
|
|
}
|
|
.arrow.fired {
|
|
stroke: rgb(192, 125, 0);
|
|
stroke-width: 3px;
|
|
}
|
|
|
|
text.error, tspan.error {
|
|
fill: var(--error-color);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.errorHover {
|
|
display: none;
|
|
}
|
|
|
|
g:hover > .errorHover {
|
|
display: inline;
|
|
}
|
|
|
|
text.uid {
|
|
fill: lightgrey;
|
|
} |