GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-28 07:03:17 +08:00
Code Issues Projects Releases Wiki Activity

refactor: Separate default options in styles

Browse Source
This commit is contained in:
Sidharth Vinod 2023-11-15 00:52:56 +05:30
parent 9925b9b455
commit 1a8743ec11
No known key found for this signature in database
GPG Key ID: FB5CCD378D3907CD
1 changed files with 27 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
packages/mermaid/src/diagrams/packet/styles.ts
View File

@ -1,31 +1,45 @@
import type { DiagramStylesProvider } from '../../diagram-api/types.js';
import { log } from '../../logger.js';
import { cleanAndMerge } from '../../utils.js';
import type { PacketStyleOptions } from './types.js';
export const styles: DiagramStylesProvider = (options: { packet?: PacketStyleOptions } = {}) => {
log.debug({ options });
const defaultPacketStyleOptions: PacketStyleOptions = {
byteFontSize: '10px',
startByteColor: 'black',
endByteColor: 'black',
labelColor: 'black',
labelFontSize: '12px',
titleColor: 'black',
titleFontSize: '14px',
blockStrokeColor: 'black',
blockStrokeWidth: '1',
blockFillColor: '#efefef',
};
export const styles: DiagramStylesProvider = ({ packet }: { packet?: PacketStyleOptions } = {}) => {
const options = cleanAndMerge(defaultPacketStyleOptions, packet);
return `
.packetByte {
font-size: ${options.packet?.byteFontSize ?? '10px'};
font-size: ${options.byteFontSize};
}
.packetByte.start {
fill: ${options.packet?.startByteColor ?? 'black'};
fill: ${options.startByteColor};
}
.packetByte.end {
fill: ${options.packet?.endByteColor ?? 'black'};
fill: ${options.endByteColor};
}
.packetLabel {
fill: ${options.packet?.labelColor ?? 'black'};
font-size: ${options.packet?.labelFontSize ?? '12px'};
fill: ${options.labelColor};
font-size: ${options.labelFontSize};
}
.packetTitle {
fill: ${options.packet?.titleColor ?? 'black'};
font-size: ${options.packet?.titleFontSize ?? '14px'};
fill: ${options.titleColor};
font-size: ${options.titleFontSize};
}
.packetBlock {
stroke: ${options.packet?.blockStrokeColor ?? 'black'};
stroke-width: ${options.packet?.blockStrokeWidth ?? '1'};
fill: ${options.packet?.blockFillColor ?? '#efefef'};
stroke: ${options.blockStrokeColor};
stroke-width: ${options.blockStrokeWidth};
fill: ${options.blockFillColor};
}
`;
};