chore(docs): fix missing image, app. order and link

Author: jeertmans

README.md

@@ -192,7 +192,7 @@ in *Settings*->*Display*.
 
 ## Contributing
 
-Contributions are more than welcome!
+Contributions are more than welcome! Please read through [our contributing section](https://eertmans.be/manim-slides/contributing/index.html).
 
 [pypi-version-badge]: https://img.shields.io/pypi/v/manim-slides?label=manim-slides
 [pypi-version-url]: https://pypi.org/project/manim-slides/

docs/source/index.md

@@ -2,7 +2,12 @@
 hide-toc: true
 ---
 
-<p align="center><img src="_static/logo.png" width="600px" alt="Manim Slides logo"></p>
+```{eval-rst}
+.. image:: _static/logo.png
+    :width: 600px
+    :align: center
+    :alt: Manim Slide logo
+```
 
 # Welcome to Manim Slide's documentation
 

docs/source/reference/examples.md

@@ -8,19 +8,21 @@ Do not forget to import Manim Slides and Manim or ManimGL.
 
 Basic example from quickstart.
 
+<div style="position:relative;padding-bottom:56.25%;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay" src="../_static/basic_example.html"></iframe></div>
+
 ```{eval-rst}
 .. literalinclude:: ../../../example.py
    :language: python
    :linenos:
    :pyobject: BasicExample
 ```
 
-<div style="position:relative;padding-bottom:56.25%;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay" src="../_static/basic_example.html"></iframe></div>
-
 ## 3D Example
 
 Example using 3D camera. As Manim and ManimGL handle 3D differently, definitions are slightly different.
 
+<div style="position:relative;padding-bottom:56.25%;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay" src="../_static/three_d_example.html"></iframe></div>
+
 ### With Manim
 
 ```{eval-rst}
@@ -32,8 +34,6 @@ Example using 3D camera. As Manim and ManimGL handle 3D differently, definitions
    :end-before: [manim-3d]
 ```
 
-<div style="position:relative;padding-bottom:56.25%;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay" src="../_static/three_d_example.html"></iframe></div>
-
 ### With ManimGL
 
 ```{eval-rst}
@@ -49,11 +49,11 @@ Example using 3D camera. As Manim and ManimGL handle 3D differently, definitions
 
 A more advanced example is `ConvertExample`, which is used as demo slide and tutorial.
 
+<div style="position:relative;padding-bottom:56.25%;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay" src="../_static/slides.html"></iframe></div>
+
 ```{eval-rst}
 .. literalinclude:: ../../../example.py
    :language: python
    :linenos:
    :pyobject: ConvertExample
 ```
-
-<div style="position:relative;padding-bottom:56.25%;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay" src="../_static/slides.html"></iframe></div>