marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-21 08:19:43 +02:00
Code Issues Packages Projects Releases Wiki Activity

updated drop shadow styling for small shapes

Browse Source
This commit is contained in:
omkarht
2025-01-23 12:27:47 +05:30
parent 7425430b80
commit 7fbc873fd0
4 changed files with 25 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
packages/mermaid/src/rendering-util/render.ts
View File

@@ -72,6 +72,19 @@ export const render = async (data4Layout: LayoutData, svg: SVG, positions?: any)
.attr('flood-opacity', '0.06') .attr('flood-opacity', '0.06')
.attr('flood-color', '#000000'); .attr('flood-color', '#000000');
svg
.append('defs')
.append('filter')
.attr('id', 'drop-shadow-small')
.attr('height', '150%')
.attr('width', '150%')
.append('feDropShadow')
.attr('dx', '2')
.attr('dy', '2')
.attr('stdDeviation', 0)
.attr('flood-opacity', '0.06')
.attr('flood-color', '#000000');
if (useGradient) { if (useGradient) {
const gradient = svg const gradient = svg
.append('linearGradient') .append('linearGradient')

4
packages/mermaid/src/rendering-util/rendering-elements/shapes/filledCircle.ts
View File

@@ -61,6 +61,10 @@ export function filledCircle<T extends SVGGraphicsElement>(
filledCircle.attr('class', 'outer-path'); filledCircle.attr('class', 'outer-path');
} }
if (node.width < 25) {
filledCircle.attr('style', 'filter:url(#drop-shadow-small)');
}
if (cssStyles && cssStyles.length > 0 && node.look !== 'handDrawn') { if (cssStyles && cssStyles.length > 0 && node.look !== 'handDrawn') {
filledCircle.selectAll('path').attr('style', cssStyles); filledCircle.selectAll('path').attr('style', cssStyles);
} }

4
packages/mermaid/src/rendering-util/rendering-elements/shapes/stateEnd.ts
View File

@@ -80,6 +80,10 @@ export function stateEnd<T extends SVGGraphicsElement>(
circle.selectAll('path').attr('style', nodeStyles); circle.selectAll('path').attr('style', nodeStyles);
} }
if (node.width < 25) {
circle.attr('style', 'filter:url(#drop-shadow-small)');
}
updateNodeBounds(node, circle); updateNodeBounds(node, circle);
node.intersect = function (point) { node.intersect = function (point) {

4
packages/mermaid/src/rendering-util/rendering-elements/shapes/stateStart.ts
View File

@@ -62,6 +62,10 @@ export function stateStart<T extends SVGGraphicsElement>(
.attr('height', node.height ?? 14); .attr('height', node.height ?? 14);
} }
if (node.width < 25) {
circle.attr('style', 'filter:url(#drop-shadow-small)');
}
updateNodeBounds(node, circle); updateNodeBounds(node, circle);
node.intersect = function (point) { node.intersect = function (point) {