2020-07-17 15:57:02 +02:00
|
|
|
const getStyles = options =>
|
|
|
|
`g.classGroup text {
|
|
|
|
fill: ${options.nodeBorder};
|
2020-07-20 14:13:05 +02:00
|
|
|
fill: ${options.classText};
|
2020-07-17 15:57:02 +02:00
|
|
|
stroke: none;
|
2020-07-20 14:13:05 +02:00
|
|
|
font-family: ${options.fontFamily};
|
2020-07-17 15:57:02 +02:00
|
|
|
font-size: 10px;
|
|
|
|
|
2020-08-27 20:43:37 +02:00
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.classTitle {
|
|
|
|
font-weight: bolder;
|
2020-07-17 15:57:02 +02:00
|
|
|
}
|
2020-07-22 21:25:01 +02:00
|
|
|
.node rect,
|
|
|
|
.node circle,
|
|
|
|
.node ellipse,
|
|
|
|
.node polygon,
|
|
|
|
.node path {
|
|
|
|
fill: ${options.mainBkg};
|
|
|
|
stroke: ${options.nodeBorder};
|
|
|
|
stroke-width: 1px;
|
|
|
|
}
|
|
|
|
|
2020-07-17 15:57:02 +02:00
|
|
|
|
2020-07-22 19:10:28 +02:00
|
|
|
.divider {
|
2020-07-22 19:25:26 +02:00
|
|
|
stroke: ${options.nodeBorder};
|
2020-07-22 19:10:28 +02:00
|
|
|
stroke: 1;
|
|
|
|
}
|
|
|
|
|
2020-07-17 15:57:02 +02:00
|
|
|
g.clickable {
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
g.classGroup rect {
|
2020-07-31 15:05:51 +02:00
|
|
|
fill: ${options.mainBkg};
|
2020-07-17 15:57:02 +02:00
|
|
|
stroke: ${options.nodeBorder};
|
|
|
|
}
|
|
|
|
|
|
|
|
g.classGroup line {
|
|
|
|
stroke: ${options.nodeBorder};
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
.classLabel .box {
|
|
|
|
stroke: none;
|
|
|
|
stroke-width: 0;
|
2020-07-31 15:05:51 +02:00
|
|
|
fill: ${options.mainBkg};
|
2020-07-17 15:57:02 +02:00
|
|
|
opacity: 0.5;
|
|
|
|
}
|
|
|
|
|
|
|
|
.classLabel .label {
|
|
|
|
fill: ${options.nodeBorder};
|
|
|
|
font-size: 10px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.relation {
|
2020-07-20 15:15:03 +02:00
|
|
|
stroke: ${options.lineColor};
|
2020-07-17 15:57:02 +02:00
|
|
|
stroke-width: 1;
|
|
|
|
fill: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.dashed-line{
|
|
|
|
stroke-dasharray: 3;
|
|
|
|
}
|
|
|
|
|
2020-07-22 19:10:28 +02:00
|
|
|
#compositionStart, .composition {
|
|
|
|
fill: ${options.lineColor} !important;
|
|
|
|
stroke: ${options.lineColor} !important;
|
2020-07-17 15:57:02 +02:00
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
2020-07-22 19:10:28 +02:00
|
|
|
#compositionEnd, .composition {
|
|
|
|
fill: ${options.lineColor} !important;
|
|
|
|
stroke: ${options.lineColor} !important;
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
#dependencyStart, .dependency {
|
|
|
|
fill: ${options.lineColor} !important;
|
|
|
|
stroke: ${options.lineColor} !important;
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
#dependencyStart, .dependency {
|
|
|
|
fill: ${options.lineColor} !important;
|
|
|
|
stroke: ${options.lineColor} !important;
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
#extensionStart, .extension {
|
|
|
|
fill: ${options.lineColor} !important;
|
|
|
|
stroke: ${options.lineColor} !important;
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
#extensionEnd, .extension {
|
|
|
|
fill: ${options.lineColor} !important;
|
|
|
|
stroke: ${options.lineColor} !important;
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
#aggregationStart, .aggregation {
|
2020-07-31 15:05:51 +02:00
|
|
|
fill: ${options.mainBkg} !important;
|
2020-07-22 19:10:28 +02:00
|
|
|
stroke: ${options.lineColor} !important;
|
|
|
|
stroke-width: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
#aggregationEnd, .aggregation {
|
2020-07-31 15:05:51 +02:00
|
|
|
fill: ${options.mainBkg} !important;
|
2020-07-22 19:10:28 +02:00
|
|
|
stroke: ${options.lineColor} !important;
|
2020-07-17 15:57:02 +02:00
|
|
|
stroke-width: 1;
|
|
|
|
}
|
2020-08-07 14:52:42 +02:00
|
|
|
|
|
|
|
.edgeTerminals {
|
|
|
|
font-size: 11px;
|
|
|
|
}
|
|
|
|
|
2020-07-17 15:57:02 +02:00
|
|
|
`;
|
|
|
|
|
|
|
|
export default getStyles;
|