[FEAT] Add an "halo" in the 2022 theme of the Hacktoberfest demo

[tbouffard]

Check if we can add a "halo" on the background of the pool for the dark theme, as it is done in the Hacktoberfest website

Past experiments

As far as I (@tbouffard) remember, here is what I did

• using a static page displaying the diagram with the them (I copied the content of the bpmn-container for the Hacktoberfest 2022 dark theme)
• generate without fill color for pool and lane
• create a SVG rectangle or a path matching the boundaries of the pool (the same dimensions as the pool), without stroke
• fill it with SVG filters inspired by the web design found on Figma about Hacktoberfest 2022
• I remember that it was a painful task
• as it was done in a static page, I didn't validate that changing the project name (which triggers a mxGraph model refresh) keep the halo in the background. If not, we could repaint the halo after calling the refresh
• The opacity of the halo may be reduced (no tested)
• unfortunately, I haven't yet managed to find my experiments in my archives. I'll share them if I find them.

What I had in mind for the final implementation

• dynamically compute the size of the SVG group storing the halo based on the pool dimension
• remove the gradient color in the gateway and don't use any fill color everywhere (except for event). The black is darker than the halo.
• use a lib if this can help
• validate all use cases. The solution would probably fail with diagram navigation because of https://github.com/process-analytics/bpmn-visualization-js/pull/2199, but we don't enable navigation here, so this should be OK

SVG resources for the filters

• https://drafts.fxtf.org/filter-effects/#FilterPrimitivesOverview
• https://www.w3schools.com/graphics/svg_grad_linear.asp
• https://docs.aspose.com/svg/net/drawing-basics/filters-and-gradients/ the most useful here
• https://www.npmjs.com/package/parse-svg-path may be used to get the details about the SVG elements of the pool. I managed this manually in my experiments