174 lines
No EOL
2.7 KiB
CSS
174 lines
No EOL
2.7 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: rgb(230,0,0);
|
|
}
|
|
.rountangle.active {
|
|
fill: darkorange;
|
|
fill-opacity: 0.2;
|
|
/* filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7)); */
|
|
stroke-width: 3px;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
#arrowEnd {
|
|
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: 8px;
|
|
}
|
|
text.helper:hover {
|
|
stroke: blue;
|
|
stroke-opacity: 0.2;
|
|
}
|
|
|
|
.draggableText, .draggableText.highlight {
|
|
/* text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff, 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff; */
|
|
/* -webkit-text-stroke: 4px white; */
|
|
paint-order: stroke;
|
|
stroke: white;
|
|
stroke-width: 4px;
|
|
stroke-linecap: butt;
|
|
stroke-linejoin: miter;
|
|
stroke-opacity: 1;
|
|
fill-opacity:1;
|
|
/* font-weight: 800; */
|
|
}
|
|
|
|
.draggableText.highlight:not(.selected) {
|
|
fill: green;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.highlight:not(.selected) {
|
|
stroke: green;
|
|
stroke-width: 3px;
|
|
}
|
|
|
|
.arrow.error {
|
|
stroke: rgb(230,0,0);
|
|
}
|
|
text.error, tspan.error {
|
|
fill: rgb(230,0,0);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.errorHover {
|
|
display: none;
|
|
}
|
|
|
|
g:hover > .errorHover {
|
|
display: inline;
|
|
}
|
|
|
|
text.uid {
|
|
fill: lightgrey;
|
|
} |