From bcba8bd07cfa1783d9cb10bb55d15fc0aa3e9125 Mon Sep 17 00:00:00 2001
From: Tom van Woudenberg <t.r.vanwoudenberg@tudelft.nl>
Date: Wed, 14 May 2025 09:39:36 +0200
Subject: [PATCH] formatting fix

---
 book/basic-features/figures.md | 104 ++++++++++++++++-----------------
 1 file changed, 52 insertions(+), 52 deletions(-)

diff --git a/book/basic-features/figures.md b/book/basic-features/figures.md
index 8fcf942..97d82ee 100644
--- a/book/basic-features/figures.md
+++ b/book/basic-features/figures.md
@@ -2,29 +2,29 @@
 
 To add a figure, just copy the figure to the correct directory. Then, in your markdown file, include the figure as follows:
 
-````
-    ```{figure} <figurename>.png/.jpg
-    ---
-    height/width: <height or width in pixels>
-    name: <name of the figure>
-    align: left / center / right
-    figclass: left blank or "margin"
-    ---
-    <Figure caption>
-    ```
+````md
+```{figure} <figurename>.png/.jpg
+---
+height/width: <height or width in pixels>
+name: <name of the figure>
+align: left / center / right
+figclass: left blank or "margin"
+---
+<Figure caption>
+```
 ````
 
 For example: 
 
-````
-    ```{figure} ../images/TUDelft_logo_rgb.png
-    ---
-    width: 70%
-    name: demoexample1
-    align: center
-    ---
-    example 1: width (70%) as percentage, align center
-    ```
+````md
+```{figure} ../images/TUDelft_logo_rgb.png
+---
+width: 70%
+name: demoexample1
+align: center
+---
+example 1: width (70%) as percentage, align center
+```
 ````
 
 provides this output, which looks nice.
@@ -43,15 +43,15 @@ You can find more documentation on including figures [here](https://jupyterbook.
 
 There are many settings, for instance aligning right: 
 
-````
-    ```{figure} ../images/TUDelft_logo_rgb.png
-    ---
-    width: 50%
-    name: demoexample2
-    align: right
-    ---
-    example 2: width (50%) as percentage, align right
-    ```
+````md
+```{figure} ../images/TUDelft_logo_rgb.png
+---
+width: 50%
+name: demoexample2
+align: right
+---
+example 2: width (50%) as percentage, align right
+```
 ````
 
 with the result:
@@ -67,22 +67,22 @@ example 2: width (50%) as percentage, align right
 
 Aligning right can come with the potential downside (not always wanted) that text is wrapped around the figure. To avoid this one can use `<div>` elements, both before and after the text (make sure to leave an empty line after the `<div>`!):
 
-````
-    <div style="clear: both;">
-    and the output
-    </div>
-    <div style="clear: both;">
+````html
+<div style="clear: both;">
+and the output
+</div>
+<div style="clear: both;">
 
-    ```{figure} ../images/TUDelft_logo_rgb.png
-    ---
-    width: 50%
-    name: demoexample3
-    align: right
-    ---
-    example 3: width (50%) as percentage, align right with additional div style
-    ```
+```{figure} ../images/TUDelft_logo_rgb.png
+---
+width: 50%
+name: demoexample3
+align: right
+---
+example 3: width (50%) as percentage, align right with additional div style
+```
 
-    </div>
+</div>
 ````
 
 <div style="clear: both;">
@@ -108,16 +108,16 @@ including `figclass: margin` sets the figure to the column at the right.
 
 </div>
 
-````
-    ```{figure} demo97/demo97_figure1.jpg
-    ---
-    figclass: margin
-    width: 50%
-    name: demoexample2
-   
-    ---
-    example 2:including figclass: margin
-    ```
+````md
+```{figure} demo97/demo97_figure1.jpg
+---
+figclass: margin
+width: 50%
+name: demoexample2
+
+---
+example 2:including figclass: margin
+```
 ````
 
 <br>