Fix for issue #128 - flowchart - styling of edges via css overrides specific styles set in the graph definition

This commit is contained in:
knsv 2015-03-07 13:51:47 +01:00
parent 3fedc1263c
commit cbebf126ce
11 changed files with 58 additions and 52 deletions

44
dist/mermaid.css vendored
View File

@ -12,7 +12,7 @@
stroke-width: 1px;
}
.edgePath .path {
stroke: #333333 !important;
stroke: #333333;
}
.cluster rect {
fill: #ffffde;
@ -28,11 +28,11 @@
fill: #ececff;
}
text.actor {
fill: #000000;
fill: black;
stroke: none;
}
.actor-line {
stroke: #808080;
stroke: grey;
}
.messageLine0 {
stroke-width: 1.5;
@ -61,11 +61,11 @@ text.actor {
fill: #ececff;
}
.labelText {
fill: #000000;
fill: black;
stroke: none;
}
.loopText {
fill: #000000;
fill: black;
stroke: none;
}
.loopLine {
@ -97,7 +97,7 @@ text.actor {
}
.section1,
.section3 {
fill: #ffffff;
fill: white;
opacity: 0.2;
}
.sectionTitle0 {
@ -119,7 +119,7 @@ text.actor {
}
/* Grid and axis */
.grid .tick {
stroke: #d3d3d3;
stroke: lightgrey;
opacity: 0.3;
shape-rendering: crispEdges;
}
@ -129,7 +129,7 @@ text.actor {
/* Today line */
.today {
fill: none;
stroke: #ff0000;
stroke: red;
stroke-width: 2px;
}
/* Task styling */
@ -142,12 +142,12 @@ text.actor {
font-size: 11px;
}
.taskTextOutsideRight {
fill: #000000;
fill: black;
text-anchor: start;
font-size: 11px;
}
.taskTextOutsideLeft {
fill: #000000;
fill: black;
text-anchor: end;
font-size: 11px;
}
@ -156,7 +156,7 @@ text.actor {
.taskText1,
.taskText2,
.taskText3 {
fill: #ffffff;
fill: white;
}
.task0,
.task1,
@ -167,11 +167,11 @@ text.actor {
}
.taskTextOutside0,
.taskTextOutside2 {
fill: #000000;
fill: black;
}
.taskTextOutside1,
.taskTextOutside3 {
fill: #000000;
fill: black;
}
/* Active task */
.active0,
@ -185,22 +185,22 @@ text.actor {
.activeText1,
.activeText2,
.activeText3 {
fill: #000000 !important;
fill: black !important;
}
/* Completed task */
.done0,
.done1,
.done2,
.done3 {
stroke: #808080;
fill: #d3d3d3;
stroke: grey;
fill: lightgrey;
stroke-width: 2;
}
.doneText0,
.doneText1,
.doneText2,
.doneText3 {
fill: #000000 !important;
fill: black !important;
}
/* Tasks on the critical line */
.crit0,
@ -208,7 +208,7 @@ text.actor {
.crit2,
.crit3 {
stroke: #ff8888;
fill: #ff0000;
fill: red;
stroke-width: 2;
}
.activeCrit0,
@ -224,7 +224,7 @@ text.actor {
.doneCrit2,
.doneCrit3 {
stroke: #ff8888;
fill: #d3d3d3;
fill: lightgrey;
stroke-width: 2;
cursor: pointer;
shape-rendering: crispEdges;
@ -233,18 +233,18 @@ text.actor {
.doneCritText1,
.doneCritText2,
.doneCritText3 {
fill: #000000 !important;
fill: black !important;
}
.activeCritText0,
.activeCritText1,
.activeCritText2,
.activeCritText3 {
fill: #000000 !important;
fill: black !important;
}
.titleText {
text-anchor: middle;
font-size: 18px;
fill: #000000;
fill: black;
}
/*

View File

@ -12,7 +12,8 @@
stroke-width: 1px;
}
.edgePath .path {
stroke: #1a3318 !important;
stroke: green;
stroke-width: 1.5px;
}
.cluster rect {
fill: #cdffb2;
@ -28,11 +29,11 @@
fill: #cde498;
}
text.actor {
fill: #000000;
fill: black;
stroke: none;
}
.actor-line {
stroke: #808080;
stroke: grey;
}
.messageLine0 {
stroke-width: 1.5;
@ -61,11 +62,11 @@ text.actor {
fill: #cde498;
}
.labelText {
fill: #000000;
fill: black;
stroke: none;
}
.loopText {
fill: #000000;
fill: black;
stroke: none;
}
.loopLine {
@ -97,7 +98,7 @@ text.actor {
}
.section1,
.section3 {
fill: #ffffff;
fill: white;
opacity: 0.2;
}
.sectionTitle0 {
@ -119,7 +120,7 @@ text.actor {
}
/* Grid and axis */
.grid .tick {
stroke: #d3d3d3;
stroke: lightgrey;
opacity: 0.3;
shape-rendering: crispEdges;
}
@ -129,7 +130,7 @@ text.actor {
/* Today line */
.today {
fill: none;
stroke: #ff0000;
stroke: red;
stroke-width: 2px;
}
/* Task styling */
@ -142,12 +143,12 @@ text.actor {
font-size: 11px;
}
.taskTextOutsideRight {
fill: #000000;
fill: black;
text-anchor: start;
font-size: 11px;
}
.taskTextOutsideLeft {
fill: #000000;
fill: black;
text-anchor: end;
font-size: 11px;
}
@ -156,7 +157,7 @@ text.actor {
.taskText1,
.taskText2,
.taskText3 {
fill: #ffffff;
fill: white;
}
.task0,
.task1,
@ -167,11 +168,11 @@ text.actor {
}
.taskTextOutside0,
.taskTextOutside2 {
fill: #000000;
fill: black;
}
.taskTextOutside1,
.taskTextOutside3 {
fill: #000000;
fill: black;
}
/* Active task */
.active0,
@ -185,22 +186,22 @@ text.actor {
.activeText1,
.activeText2,
.activeText3 {
fill: #000000 !important;
fill: black !important;
}
/* Completed task */
.done0,
.done1,
.done2,
.done3 {
stroke: #808080;
fill: #d3d3d3;
stroke: grey;
fill: lightgrey;
stroke-width: 2;
}
.doneText0,
.doneText1,
.doneText2,
.doneText3 {
fill: #000000 !important;
fill: black !important;
}
/* Tasks on the critical line */
.crit0,
@ -208,7 +209,7 @@ text.actor {
.crit2,
.crit3 {
stroke: #ff8888;
fill: #ff0000;
fill: red;
stroke-width: 2;
}
.activeCrit0,
@ -224,7 +225,7 @@ text.actor {
.doneCrit2,
.doneCrit3 {
stroke: #ff8888;
fill: #d3d3d3;
fill: lightgrey;
stroke-width: 2;
cursor: pointer;
shape-rendering: crispEdges;
@ -233,18 +234,18 @@ text.actor {
.doneCritText1,
.doneCritText2,
.doneCritText3 {
fill: #000000 !important;
fill: black !important;
}
.activeCritText0,
.activeCritText1,
.activeCritText2,
.activeCritText3 {
fill: #000000 !important;
fill: black !important;
}
.titleText {
text-anchor: middle;
font-size: 18px;
fill: #000000;
fill: black;
}
/*

View File

@ -25734,6 +25734,7 @@ exports.addEdges = function (edges, g) {
var defaultStyle;
if(typeof edges.defaultStyle !== 'undefined'){
defaultStyle = edges.defaultStyle.toString().replace(/,/g , ';');
}
edges.forEach(function (edge) {
@ -25758,7 +25759,7 @@ exports.addEdges = function (edges, g) {
else{
switch(edge.stroke){
case 'normal':
style = 'stroke: #333; stroke-width: 1.5px;fill:none';
style = 'fill:none';
if(typeof defaultStyle !== 'undefined'){
style = defaultStyle;
}

File diff suppressed because one or more lines are too long

View File

@ -25702,6 +25702,7 @@ exports.addEdges = function (edges, g) {
var defaultStyle;
if(typeof edges.defaultStyle !== 'undefined'){
defaultStyle = edges.defaultStyle.toString().replace(/,/g , ';');
}
edges.forEach(function (edge) {
@ -25726,7 +25727,7 @@ exports.addEdges = function (edges, g) {
else{
switch(edge.stroke){
case 'normal':
style = 'stroke: #333; stroke-width: 1.5px;fill:none';
style = 'fill:none';
if(typeof defaultStyle !== 'undefined'){
style = defaultStyle;
}

File diff suppressed because one or more lines are too long

View File

@ -112,6 +112,7 @@ exports.addEdges = function (edges, g) {
var defaultStyle;
if(typeof edges.defaultStyle !== 'undefined'){
defaultStyle = edges.defaultStyle.toString().replace(/,/g , ';');
}
edges.forEach(function (edge) {
@ -136,7 +137,7 @@ exports.addEdges = function (edges, g) {
else{
switch(edge.stroke){
case 'normal':
style = 'stroke: #333; stroke-width: 1.5px;fill:none';
style = 'fill:none';
if(typeof defaultStyle !== 'undefined'){
style = defaultStyle;
}

View File

@ -7,7 +7,7 @@
}
.edgePath .path {
stroke: @lineColor !important;
stroke: @lineColor;
}
.cluster rect{

View File

@ -7,7 +7,8 @@
}
.edgePath .path {
stroke: @lineColor !important;
stroke: @lineColor;
stroke-width: 1.5px;
}
.cluster rect{

View File

@ -1,6 +1,7 @@
@mainBkg: #cde498;
@secondBkg: #cdffb2;
@lineColor: #1a3318;
@lineColor: green;
@border1: #13540c;
@border2: #6eaa49;

View File

@ -25,7 +25,7 @@
</style>
<link rel="stylesheet" href="seq.css"/>
<lnk rel="stylesheet" href="https://raw.githubusercontent.com/knsv/mermaid/master/dist/mermaid.forest.css"/>
<link rel="stylesheet" href="../dist/mermaid.forest.css"/>
<link rel="stylesheet" href="../dist/mermaid.css"/>
</head>
<body>
<div class="mermaid">