marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-11-08 06:44:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

#1542 Making sure user overrides from directives ocerrides properly

Browse Source
This commit is contained in:
Knut Sveidqvist
2020-07-19 15:02:53 +02:00
parent 8a018aa0f2
commit 4d280ff010
11 changed files with 561 additions and 273 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
src/themes/theme-forest.js Normal file
View File

@@ -0,0 +1,123 @@
import { rgba } from 'khroma';
class Theme {
constructor() {
/* Base vales */
this.mainBkg = '#cde498';
this.secondBkg = '#cdffb2';
this.lineColor = 'green';
this.border1 = '#13540c';
this.border2 = '#6eaa49';
this.arrowheadColor = 'green';
this.fontFamily = '"trebuchet ms", verdana, arial';
this.fontSize = '16px';
/* Flowchart variables */
this.nodeBkg = 'calculated';
this.nodeBorder = 'calculated';
this.clusterBkg = 'calculated';
this.clusterBorder = 'calculated';
this.defaultLinkColor = 'calculated';
this.titleColor = '#333';
this.edgeLabelBackground = '#e8e8e8';
/* Sequence Diagram variables */
this.actorBorder = 'calculated';
this.actorBkg = 'calculated';
this.actorTextColor = 'black';
this.actorLineColor = 'grey';
this.signalColor = '#333';
this.signalTextColor = '#333';
this.labelBoxBkgColor = 'calculated';
this.labelBoxBorderColor = '#326932';
this.labelTextColor = 'calculated';
this.loopTextColor = 'calculated';
this.noteBorderColor = 'calculated';
this.noteBkgColor = '#fff5ad';
this.noteTextColor = 'calculated';
this.activationBorderColor = '#666';
this.activationBkgColor = '#f4f4f4';
this.sequenceNumberColor = 'white';
/* Gantt chart variables */
this.sectionBkgColor = '#6eaa49';
this.altSectionBkgColor = 'white';
this.sectionBkgColor2 = '#6eaa49';
this.taskBorderColor = 'calculated';
this.taskBkgColor = '#487e3a';
this.taskTextLightColor = 'white';
this.taskTextColor = 'calculated';
this.taskTextDarkColor = 'black';
this.taskTextOutsideColor = 'calculated';
this.taskTextClickableColor = '#003163';
this.activeTaskBorderColor = 'calculated';
this.activeTaskBkgColor = 'calculated';
this.gridColor = 'lightgrey';
this.doneTaskBkgColor = 'lightgrey';
this.doneTaskBorderColor = 'grey';
this.critBorderColor = '#ff8888';
this.critBkgColor = 'red';
this.todayLineColor = 'red';
/* state colors */
this.labelColor = 'black';
this.errorBkgColor = '#552222';
this.errorTextColor = '#552222';
}
updateColors() {
/* Flowchart variables */
this.nodeBkg = this.mainBkg;
this.nodeBorder = this.border1;
this.clusterBkg = this.secondBkg;
this.clusterBorder = this.border2;
this.defaultLinkColor = this.lineColor;
/* Sequence Diagram variables */
this.actorBorder = this.border1;
this.actorBkg = this.mainBkg;
this.labelBoxBkgColor = this.actorBkg;
this.labelTextColor = this.actorTextColor;
this.loopTextColor = this.actorTextColor;
this.noteBorderColor = this.border2;
this.noteTextColor = this.actorTextColor;
/* Gantt chart variables */
this.taskBorderColor = this.border1;
this.taskTextColor = this.taskTextLightColor;
this.taskTextOutsideColor = this.taskTextDarkColor;
this.activeTaskBorderColor = this.taskBorderColor;
this.activeTaskBkgColor = this.mainBkg;
/* state colors */
}
calculate(overrides) {
if (typeof overrides !== 'object') return;
const keys = Object.keys(overrides);
// Copy values from overrides, this is mainly for base colors
keys.forEach(k => {
this[k] = overrides[k];
});
// Calculate colors form base colors
this.updateColors();
// Copy values from overrides again in case of an override of derived value
keys.forEach(k => {
this[k] = overrides[k];
});
}
}
export const getThemeVariables = userOverrides => {
const theme = new Theme();
theme.calculate(userOverrides);
return theme;
};