demos links

index.html

@@ -193,31 +193,42 @@ <h3>Examples / Tutorial</h3>
 <br>The example below shows how to use an orthographic projection.
 </ul>
 
-<iframe src="demos/5.html" width=850 height=380 frameBorder="0" loading="lazy"></iframe>
+<iframe src="demos/5.html" width=850 height=370 frameBorder="0" loading="lazy"></iframe>
 
+<a class=link href="https://codepen.io/xem/pen/jOaVWKR?editors=1010">Edit on Codepen</a>
+<br>
+<br>
 <ul>
 <li>You can set a custom transform matrix to any object with <pre class="inline language-js"><code class="language-js">W.move({n, M:[...]})</code></pre>.
 (animation is not possible in that case)
 <br>The example below shows how to perform asix-based rotations.
 </ul>
 
-<iframe src="demos/6.html" width=850 height=450 frameBorder="0" loading="lazy"></iframe>
+<iframe src="demos/6.html" width=850 height=400 frameBorder="0" loading="lazy"></iframe>
 
+<a class=link href="https://codepen.io/xem/pen/zYPorMq?editors=1010">Edit on Codepen</a>
+<br>
+<br>
 <ul>
 <li>All the scene's objects can be used as a group and have other objects attached to it. The camera can also be put in a group.
 <li>The camera itself can be used as a group (to create a HUD or a skybox), or put inside a group (to make a 1st or 3rd person view).
 <br>The example below shows how to attach the camera to a moving character and attach a plane (the ground) to the camera.
 </ul>
 
-<iframe src="demos/7.html" width=850 height=450 frameBorder="0" loading="lazy"></iframe>
-
-https://codepen.io/xem/pen/mdqrZpP
+<iframe src="demos/7.html" width=850 height=420 frameBorder="0" loading="lazy"></iframe>
 
+<a class=link href="https://codepen.io/xem/pen/mdqrZpP?editors=1010">Edit on Codepen</a>
+<br>
+<br>
 <ul>
 <li>Items can be attached or detached from a group anytime using <pre class="inline language-js"><code class="language-js">W.move({g /* group / null */ })</code></pre>.
 </ul>
 
-<iframe src="demos/8.html" width=850 height=340 frameBorder="0" loading="lazy"></iframe>
+<iframe src="demos/8.html" width=850 height=320 frameBorder="0" loading="lazy"></iframe>
+
+<a class=link href="https://codepen.io/xem/pen/OJObMro?editors=1010">Edit on Codepen</a>
+<br>
+<br>
 <!--
 <li>You can add per-vertex coloring by adding a <b>rgb</b> array in <pre class="inline language-js"><code class="language-js">W.add()</code></pre> (along with the vertices, uvs and indices)