Merge pull request #563 from nature-of-code/notion-update-docs

[Notion] Update docs

content/03_oscillation.html

@@ -703,10 +703,12 @@ <h3 id="exercise-312">Exercise 3.12</h3>
 <h2 id="spring-forces">Spring Forces</h2>
 <p>It’s been lovely exploring the mathematics of triangles and waves, but perhaps you’re starting to miss Newton’s laws of motion and vectors. After all, the core of this book is about simulating the physics of moving bodies. In the “Properties of Oscillation” section, I modeled simple harmonic motion by mapping a sine wave to a range of pixels on a canvas. <a href="#exercise-37">Exercise 3.6</a> asked you to use this technique to create a simulation of a bob hanging from a spring with the <code>sin()</code> function. That kind of quick-and-dirty, one-line-of-code solution won’t do, however, if what you really want is a bob hanging from a spring that responds to other forces in the environment (wind, gravity, and so on). To achieve a simulation like that, you need to model the force of the spring using vectors.</p>
 <p>I’ll consider a spring to be a connection between a movable<em> </em>bob (or weight) and a fixed anchor point (see Figure 3.11).</p>
-<figure>
-  <img src="images/03_oscillation/03_oscillation_11.png" alt="Figure 3.11: A spring with an anchor and bob.">
-  <figcaption>Figure 3.11: A spring with an anchor and bob.</figcaption>
-</figure>
+<div class="half-width-right">
+  <figure>
+    <img src="images/03_oscillation/03_oscillation_11.png" alt="Figure 3.11: A spring with an anchor and bob.">
+    <figcaption>Figure 3.11: A spring with an anchor and bob.</figcaption>
+  </figure>
+</div>
 <p>The force of the spring is a vector calculated according to Hooke’s law, named for Robert Hooke, a British physicist who developed the formula in 1660. Hooke originally stated the law in Latin: “<em>Ut tensio, sic vis</em>,” or “As the extension, so the force.” Think of it this way:</p>
 <p><span class="highlight">The force of the spring is directly proportional to the extension of the spring.</span></p>
 <div class="half-width-right">
@@ -909,10 +911,12 @@ <h2 id="the-pendulum">The Pendulum</h2>
 <p>Solving for <span data-type="equation">F_{gx}</span>, I get:</p>
 <div data-type="equation">F_{gx} = F_g \times \sin(\theta)</div>
 <p>I’ll now rename this force <span data-type="equation">F_p</span> for “force of the pendulum.” In Figure 3.18, I’ve restored the diagram to its original orientation and relabeled the components. I’ve also moved the starting point of <span data-type="equation">F_p</span> from the bottom of the right triangle to the bob’s center, to clarify how this force moves the bob.</p>
-<figure>
-  <img src="images/03_oscillation/03_oscillation_18.png" alt="Figure 3.18: F_{gx} is now labeled F_p, the net force in the direction of motion.">
-  <figcaption>Figure 3.18: <span data-type="equation">F_{gx}</span> is now labeled <span data-type="equation">F_p</span>, the net force in the direction of motion.</figcaption>
-</figure>
+<div class="half-width-right">
+  <figure>
+    <img src="images/03_oscillation/03_oscillation_18.png" alt="Figure 3.18: F_{gx} is now labeled F_p, the net force in the direction of motion.">
+    <figcaption>Figure 3.18: <span data-type="equation">F_{gx}</span> is now labeled <span data-type="equation">F_p</span>, the net force in the direction of motion.</figcaption>
+  </figure>
+</div>
 <p>There it is. The net force of the pendulum that causes the rotation is calculated as follows:</p>
 <div data-type="equation">F_p = F_g \times \sin(\theta)</div>
 <p>Lest you forget, however, my goal is to determine the angular acceleration of the pendulum. Once I have that, I’ll be able to apply the rules of motion to find a new angle <span data-type="equation">\theta</span> for each frame of the animation:</p>
@@ -1057,12 +1061,10 @@ <h3 id="exercise-315">Exercise 3.15</h3>
 </div>
 <div data-type="exercise">
   <h3 id="exercise-316">Exercise 3.16</h3>
-  <div class="half-width-right">
-    <figure>
-      <img src="images/03_oscillation/03_oscillation_20.png" alt="">
-      <figcaption></figcaption>
-    </figure>
-  </div>
+  <figure>
+    <img src="images/03_oscillation/03_oscillation_20.png" alt="">
+    <figcaption></figcaption>
+  </figure>
   <p>Using trigonometry, how do you calculate the magnitude of the <strong>normal force</strong> depicted here (the force perpendicular to the incline on which the sled rests)? You can consider the magnitude of <span data-type="equation">F_\text{gravity}</span> to be a known constant. Look for a right triangle to help get you started. After all, the normal force is equal and opposite to a component of the force of gravity. If it helps to draw over the diagram and make more right triangles, go for it!</p>
 </div>
 <div data-type="exercise">

content/08_fractals.html

@@ -14,8 +14,8 @@ <h1 id="chapter-8-fractals">Chapter 8. Fractals</h1>
 </div>
 <div class="chapter-opening-figure">
   <figure>
-    <img src="images/08_fractals/08_fractals_1.png" alt="photo by Saad Akhtar CC BY-SA 4.0">
-    <figcaption>photo by Saad Akhtar <a href="https://creativecommons.org/licenses/by/4.0/deed.en">CC BY-SA 4.0</a></figcaption>
+    <img src="images/08_fractals/08_fractals_1.png" alt="Photo by Saad Akhtar CC BY-SA 4.0">
+    <figcaption>Photo by Saad Akhtar <a href="https://creativecommons.org/licenses/by/4.0/deed.en">CC BY-SA 4.0</a></figcaption>
   </figure>
   <h3 id="chakri-maha-prasat-hall">Chakri Maha Prasat Hall</h3>
   <p>The Chakri Maha Prasat Hall, located within the Grand Palace in the heart of Bangkok, Thailand, is an architectural feat known for its intricate details and grandeur. Each level of the multilayered roof echoes a smaller or larger version of itself and represents the different levels of Mount Meru, the center of the Buddhist universe.</p>

content/10_nn.html

@@ -8,8 +8,8 @@ <h1 id="chapter-10-neural-networks">Chapter 10. Neural Networks</h1>
 </div>
 <div class="chapter-opening-figure">
   <figure>
-    <img src="images/10_nn/10_nn_1.jpg" alt="photo by Pi3.124, Museo Machu Picchu, Casa Concha, Cusco,  CC BY-SA 4.0">
-    <figcaption>photo by <a href="https://commons.wikimedia.org/wiki/User:Pi3.124">Pi3.124</a>, Museo Machu Picchu, Casa Concha, Cusco, <a href="https://creativecommons.org/licenses/by/4.0/deed.en">CC BY-SA 4.0</a></figcaption>
+    <img src="images/10_nn/10_nn_1.jpg" alt="Photo by Pi3.124, Museo Machu Picchu, Casa Concha, Cusco,  CC BY-SA 4.0">
+    <figcaption>Photo by <a href="https://commons.wikimedia.org/wiki/User:Pi3.124">Pi3.124</a>, Museo Machu Picchu, Casa Concha, Cusco, <a href="https://creativecommons.org/licenses/by/4.0/deed.en">CC BY-SA 4.0</a></figcaption>
   </figure>
   <h3 id="khipu">Khipu</h3>
   <p>The <em>khipu</em> (or <em>quipu</em>) is an ancient Incan device used for record-keeping and communication. It relied on a complex system of knotted cords to encode and transmit information. Made from colored threads and a variety of knots, each string and knot pattern represented specific data, such as census records or calendrical information. Interpreters, known as <em>quipucamayocs</em>, acted as a kind of accountant and decoded the stringed narrative into understandable information.</p>