Added section images

[jspaaks]

To separate the content a bit better, I added section images. Hope you like it!

PS
When making these changes, I noticed that perhaps it's good to

1. put the Swagger web service before the Flask app
2. make the first part of the webassembly section result in a service instead of a HTML page

[sverhoeven]

I like the flow diagram style.

The text between the 2 arrows is not consistent.

For JS you use emscripten in image, for Python we should add pybind11 in image.

[sverhoeven]

Could you remove two way we are just calling C++ from Python and we are not calling Python from C++.

Suggested change

style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.33333588px;font-family:'Roboto Condensed';-inkscape-font-specification:'Roboto Condensed, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#333333">two-way C++ to Python bindings</flowPara></flowRoot> <flowRoot

style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:53.33333588px;font-family:'Roboto Condensed';-inkscape-font-specification:'Roboto Condensed, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#333333">C++ to Python bindings</flowPara></flowRoot> <flowRoot

Same goes for other occurences

[jspaaks]

'two way" removed in next commit

[sverhoeven]

Typo

Suggested change

	id="flowPara1006-5">Emscriptem</flowPara></flowRoot> <flowRoot
	id="flowPara1006-5">Emscripten</flowPara></flowRoot> <flowRoot

[jspaaks]

typo corrected in next commit

[sverhoeven]

Typo

Suggested change

	id="flowPara1006-5">Emscriptem</flowPara></flowRoot> </g>
	id="flowPara1006-5">Emscripten</flowPara></flowRoot> </g>

[jspaaks]

typo corrected in next commit

[jspaaks]

for Python we should add pybind11 in image.

I thought "Python bindings" was a bit more generic, therefore I left it like this. Let me know if you'd still like to see it changed.

[sverhoeven]

for Python we should add pybind11 in image.

I thought "Python bindings" was a bit more generic, therefore I left it like this. Let me know if you'd still like to see it changed.

For consistencies sake we should have the flavor of bindings and the bindings library in both JS and Python diagrams. Or just have the flavor of bindings.

[sverhoeven]

I think you don't need the png you can use the svg directly in Markdown

[jspaaks]

I think it's OK to sacrifice some consistency across the document if that makes an individual section image easier to understand. The purpose of the images is not to accurately capture all the details that are discussed in the corresponding text; rather, they provide an anchor for readers to recognize. In that role, I thought that "C++ to Python bindings" will be recognized by more readers than "pybind11".

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!

0 Bugs
0 Vulnerabilities (and 0 Security Hotspots to review)
0 Code Smells

No Coverage information
No Duplication information

[jspaaks]

On svg v png: On GitHub everything works ok, but at least my editor (Atom) struggles with rendering order of layers, e.g. text on top of areas. png is a bit more rebust in that sense.

[sverhoeven]

OK, let's keep using png for editor support. I noticed with a dark theme in VS code the center text was unreadable aswell.

Let's also keep the text as is, after the reshuffling in #66, we will need to add and maybe update the section images.

[jspaaks]

dark theme in VS code

Same in atom. I'll add a white bg in the next round of edits after #66