mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-09-25 10:20:06 +02:00
Merge branch '1614_fontFamily' of https://github.com/knsv/mermaid into 1542_take_two
This commit is contained in:
@@ -11,13 +11,13 @@ describe('Class diagram', () => {
|
||||
classA -- classC : link
|
||||
classC -- classD : link
|
||||
classB -- classD
|
||||
|
||||
|
||||
`,
|
||||
{logLevel : 1}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
|
||||
|
||||
it('1: should render a simple class diagram', () => {
|
||||
imgSnapshotTest(
|
||||
`
|
||||
@@ -47,7 +47,7 @@ describe('Class diagram', () => {
|
||||
test()
|
||||
}
|
||||
`,
|
||||
{logLevel : 1}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -76,7 +76,8 @@ describe('Class diagram', () => {
|
||||
test()
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -94,7 +95,7 @@ describe('Class diagram', () => {
|
||||
Class01 : +int publicGorilla
|
||||
Class01 : #int protectedMarmoset
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -147,7 +148,7 @@ describe('Class diagram', () => {
|
||||
}
|
||||
`,
|
||||
],
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -177,7 +178,7 @@ describe('Class diagram', () => {
|
||||
test()
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -189,7 +190,7 @@ describe('Class diagram', () => {
|
||||
Class01 <|-- AveryLongClass : Cool
|
||||
Class01 : someMethod()*
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -201,7 +202,7 @@ describe('Class diagram', () => {
|
||||
Class01 <|-- AveryLongClass : Cool
|
||||
Class01 : someMethod()$
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -221,7 +222,7 @@ describe('Class diagram', () => {
|
||||
test()
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -242,7 +243,7 @@ describe('Class diagram', () => {
|
||||
test()
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -264,7 +265,7 @@ describe('Class diagram', () => {
|
||||
}
|
||||
link class01 "google.com" "A Tooltip"
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -286,7 +287,7 @@ describe('Class diagram', () => {
|
||||
}
|
||||
callback class01 "functionCall" "A Tooltip"
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -301,7 +302,7 @@ describe('Class diagram', () => {
|
||||
testArray() bool[]
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -317,7 +318,7 @@ describe('Class diagram', () => {
|
||||
testArray() bool[]
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -335,7 +336,7 @@ describe('Class diagram', () => {
|
||||
|
||||
cssClass "Class10" exClass
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -351,7 +352,7 @@ describe('Class diagram', () => {
|
||||
testArray() bool[]
|
||||
}
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
@@ -365,7 +366,7 @@ describe('Class diagram', () => {
|
||||
|
||||
cssClass "Class10, class20" exClass
|
||||
`,
|
||||
{}
|
||||
{logLevel : 1, flowchart: { "htmlLabels": false },}
|
||||
);
|
||||
cy.get('svg');
|
||||
});
|
||||
|
@@ -20,6 +20,15 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>info below</h1>
|
||||
<div class="mermaid" style="width: 100%; height: 20%;">
|
||||
%%{init: {'theme': 'base', 'fontFamily': 'arial', 'themeVariables': { 'primaryColor': '#ff0000'}}}%%
|
||||
classDiagram-v2
|
||||
|
||||
classApa -- classB : Inheritance
|
||||
classA -- classC : link
|
||||
classC -- classD : link
|
||||
classB -- classD
|
||||
</div>
|
||||
<div class="mermaid2" style="width: 100%; height: 20%;">
|
||||
classDiagram-v2
|
||||
class BankAccount{
|
||||
@@ -43,7 +52,7 @@
|
||||
classB : method2() int
|
||||
</div>
|
||||
|
||||
<div class="mermaid" style="width: 100%; height: 20%;">
|
||||
<div class="mermaid2" style="width: 100%; height: 20%;">
|
||||
classDiagram-v2
|
||||
|
||||
classA -- classB : Inheritance
|
||||
@@ -71,7 +80,10 @@
|
||||
// gantt: { axisFormat: '%m/%d/%Y' },
|
||||
sequence: { actorMargin: 50, showSequenceNumbers: true },
|
||||
// sequenceDiagram: { actorMargin: 300 } // deprecated
|
||||
fontFamily: '"arial", sans-serif',
|
||||
// fontFamily: '"arial", sans-serif',
|
||||
// themeVariables: {
|
||||
// fontFamily: '"arial", sans-serif',
|
||||
// },
|
||||
curve: 'linear',
|
||||
securityLevel: 'loose'
|
||||
});
|
||||
|
@@ -49,7 +49,6 @@ export const updateCurrentConfig = (siteCfg, _directives) => {
|
||||
* @returns {*} - the siteConfig
|
||||
*/
|
||||
export const setSiteConfig = conf => {
|
||||
console.warn('Setting site config');
|
||||
siteConfig = assignWithDepth({}, defaultConfig);
|
||||
siteConfig = assignWithDepth(siteConfig, conf);
|
||||
|
||||
@@ -138,6 +137,15 @@ export const sanitize = options => {
|
||||
};
|
||||
|
||||
export const addDirective = directive => {
|
||||
if (directive.fontFamily) {
|
||||
if (!directive.themeVariables) {
|
||||
directive.themeVariables = { fontFamily: directive.fontFamily };
|
||||
} else {
|
||||
if (!directive.themeVariables.fontFamily) {
|
||||
directive.themeVariables = { fontFamily: directive.fontFamily };
|
||||
}
|
||||
}
|
||||
}
|
||||
directives.push(directive);
|
||||
updateCurrentConfig(siteConfig, directives);
|
||||
};
|
||||
|
@@ -220,7 +220,7 @@ const render = function(id, _txt, cb, container) {
|
||||
// console.warn('Render fetching config');
|
||||
|
||||
const cnf = configApi.getConfig();
|
||||
console.warn('Render with config after adding new directives', cnf.themeVariables.primaryColor);
|
||||
console.warn('Render with config after adding new directives', cnf.fontFamily);
|
||||
// Check the maximum allowed text size
|
||||
if (_txt.length > cnf.maxTextSize) {
|
||||
txt = 'graph TB;a[Maximum text size in diagram exceeded];style a fill:#faa';
|
||||
@@ -553,6 +553,18 @@ function reinitialize() {
|
||||
|
||||
function initialize(options) {
|
||||
console.warn(`mermaidAPI.initialize: v${pkg.version} `, options);
|
||||
|
||||
// Handle legacy location of font-family configuration
|
||||
// console.warn('Conf - ', options.themeVariables.fontFamily);
|
||||
if (options.fontFamily) {
|
||||
if (!options.themeVariables) {
|
||||
options.themeVariables = { fontFamily: options.fontFamily };
|
||||
} else {
|
||||
if (!options.themeVariables.fontFamily) {
|
||||
options.themeVariables = { fontFamily: options.fontFamily };
|
||||
}
|
||||
}
|
||||
}
|
||||
// Set default options
|
||||
|
||||
if (options && options.theme && theme[options.theme]) {
|
||||
|
@@ -29,6 +29,7 @@ const themes = {
|
||||
export const calcThemeVariables = (theme, userOverRides) => theme.calcColors(userOverRides);
|
||||
|
||||
const getStyles = (type, userStyles, options) => {
|
||||
console.warn('options in styles: ', options);
|
||||
return ` {
|
||||
font-family: ${options.fontFamily};
|
||||
font-size: ${options.fontSize};
|
||||
|
Reference in New Issue
Block a user