From 9859491381c79c812d47723b486b2a5f6cea219e Mon Sep 17 00:00:00 2001 From: Josh Bouganim <97702138+josh-bouganim-avant@users.noreply.github.com> Date: Tue, 25 Apr 2023 11:01:09 -0700 Subject: [PATCH 1/3] Clarify FontAwesome support --- packages/mermaid/src/docs/syntax/flowchart.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/docs/syntax/flowchart.md b/packages/mermaid/src/docs/syntax/flowchart.md index bdc4a2fa0b..97cbb4fe35 100644 --- a/packages/mermaid/src/docs/syntax/flowchart.md +++ b/packages/mermaid/src/docs/syntax/flowchart.md @@ -683,7 +683,7 @@ flowchart TD B-->E(A fa:fa-camera-retro perhaps?) ``` -?> Mermaid is now only compatible with Font Awesome versions 4 and 5. Check that you are using the correct version of Font Awesome. +Mermaid is compatible with Font Awesome up to verion 5, Free icons only. Check that the icons you use are from the [supported set of icons](https://fontawesome.com/v5/search?o=r&m=free). ## Graph declarations with spaces between vertices and link and without semicolon From 284d032d261e5761bca4c685e19b2a60a4b4f9f6 Mon Sep 17 00:00:00 2001 From: Josh Bouganim <97702138+josh-bouganim-avant@users.noreply.github.com> Date: Tue, 25 Apr 2023 11:06:43 -0700 Subject: [PATCH 2/3] update Font Awesome Version --- packages/mermaid/src/docs/syntax/mindmap.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mermaid/src/docs/syntax/mindmap.md b/packages/mermaid/src/docs/syntax/mindmap.md index 64a25821a6..e11f02207b 100644 --- a/packages/mermaid/src/docs/syntax/mindmap.md +++ b/packages/mermaid/src/docs/syntax/mindmap.md @@ -114,7 +114,7 @@ More shapes will be added, beginning with the shapes available in flowcharts. ## Icons -As with flowcharts you can add icons to your nodes but with an updated syntax. The styling for the font based icons are added during the integration so that they are available for the web page. _This is not something a diagram author can do but has to be done with the site administrator or the integrator_. Once the icon fonts are in place you add them to the mind map nodes using the `::icon()` syntax. You place the classes for the icon within the parenthesis like in the following example where icons for material design and fontawesome 4 are displayed. The intention is that this approach should be used for all diagrams supporting icons. **Experimental feature:** This wider scope is also the reason Mindmaps are experimental as this syntax and approach could change. +As with flowcharts you can add icons to your nodes but with an updated syntax. The styling for the font based icons are added during the integration so that they are available for the web page. _This is not something a diagram author can do but has to be done with the site administrator or the integrator_. Once the icon fonts are in place you add them to the mind map nodes using the `::icon()` syntax. You place the classes for the icon within the parenthesis like in the following example where icons for material design and [Font Awesome 5](https://fontawesome.com/v5/search?o=r&m=free) are displayed. The intention is that this approach should be used for all diagrams supporting icons. **Experimental feature:** This wider scope is also the reason Mindmaps are experimental as this syntax and approach could change. ```mermaid-example mindmap From 41969c434f553388a2703860809f09fcc942b6ee Mon Sep 17 00:00:00 2001 From: Josh Bouganim <97702138+josh-bouganim-avant@users.noreply.github.com> Date: Tue, 25 Apr 2023 20:35:45 +0000 Subject: [PATCH 3/3] submit built docs --- docs/syntax/flowchart.md | 2 +- docs/syntax/mindmap.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/syntax/flowchart.md b/docs/syntax/flowchart.md index d10b2c6c52..31c8643be7 100644 --- a/docs/syntax/flowchart.md +++ b/docs/syntax/flowchart.md @@ -1003,7 +1003,7 @@ flowchart TD B-->E(A fa:fa-camera-retro perhaps?) ``` -?> Mermaid is now only compatible with Font Awesome versions 4 and 5. Check that you are using the correct version of Font Awesome. +Mermaid is compatible with Font Awesome up to verion 5, Free icons only. Check that the icons you use are from the [supported set of icons](https://fontawesome.com/v5/search?o=r&m=free). ## Graph declarations with spaces between vertices and link and without semicolon diff --git a/docs/syntax/mindmap.md b/docs/syntax/mindmap.md index 9687bbef77..982790332e 100644 --- a/docs/syntax/mindmap.md +++ b/docs/syntax/mindmap.md @@ -182,7 +182,7 @@ More shapes will be added, beginning with the shapes available in flowcharts. ## Icons -As with flowcharts you can add icons to your nodes but with an updated syntax. The styling for the font based icons are added during the integration so that they are available for the web page. _This is not something a diagram author can do but has to be done with the site administrator or the integrator_. Once the icon fonts are in place you add them to the mind map nodes using the `::icon()` syntax. You place the classes for the icon within the parenthesis like in the following example where icons for material design and fontawesome 4 are displayed. The intention is that this approach should be used for all diagrams supporting icons. **Experimental feature:** This wider scope is also the reason Mindmaps are experimental as this syntax and approach could change. +As with flowcharts you can add icons to your nodes but with an updated syntax. The styling for the font based icons are added during the integration so that they are available for the web page. _This is not something a diagram author can do but has to be done with the site administrator or the integrator_. Once the icon fonts are in place you add them to the mind map nodes using the `::icon()` syntax. You place the classes for the icon within the parenthesis like in the following example where icons for material design and [Font Awesome 5](https://fontawesome.com/v5/search?o=r&m=free) are displayed. The intention is that this approach should be used for all diagrams supporting icons. **Experimental feature:** This wider scope is also the reason Mindmaps are experimental as this syntax and approach could change. ```mermaid-example mindmap