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

[Notion] Update docs

content/02_forces.html

@@ -801,7 +801,7 @@ <h3 id="gravitational-attraction">Gravitational Attraction</h3>
 <pre class="codesplit" data-code-language="javascript">// Made-up force
 let force = createVector(0, 0.1);
 mover.applyForce(force);</pre>
-<p>I now have this:</p>
+<p>I now have the following.</p>
 <pre class="codesplit" data-code-language="javascript">//{!1} Attraction force between two objects
 <strong>let force = attractor.attract(mover);</strong>
 mover.applyForce(force);</pre>

content/03_oscillation.html

@@ -42,16 +42,16 @@ <h2 id="angles">Angles</h2>
 <p>The catch is that, by default, p5.js measures angles not in degrees but in <strong>radians</strong>. This alternative unit of measurement is defined by the ratio of the length of the arc of a circle (a segment of the circle’s circumference) to the radius of that circle. One radian is the angle at which that ratio equals 1 (see Figure 3.3). A full circle (360 degrees) is equivalent to <span data-type="equation">2\pi</span> radians, 180 degrees is equivalent to <span data-type="equation">\pi</span> radians, and 90 degrees is equivalent to <span data-type="equation">\pi/2</span> radians.</p>
 <p>The formula to convert from degrees to radians is as follows:</p>
 <div data-type="equation">\text{radians} = {2\pi \times \text{degrees} \over 360}</div>
-<div data-type="note">
-  <h3 id="what-is-pi">What Is Pi?</h3>
-  <p>The mathematical constant <strong>pi</strong> (or the Greek letter <span data-type="equation">\pi</span>) is a real number defined as the ratio of a circle’s circumference (the distance around the outside of the circle) to its diameter (a straight line that passes through the circle’s center). It’s equal to approximately 3.14159 and can be accessed in p5.js with the built-in <code>PI</code> variable.</p>
-</div>
 <p>Thankfully, if you prefer to think of angles in degrees, you can call <code>angleMode(DEGREES)</code>, or you can use the convenience function <code>radians()</code> to convert values from degrees to radians. The constants <code>PI</code>, <code>TWO_PI</code>, and <code>HALF_PI</code> are also available (equivalent to 180, 360, and 90 degrees, respectively). For example, here are two ways in p5.js to rotate a shape by 60 degrees:</p>
 <pre class="codesplit" data-code-language="javascript">let angle = 60;
 rotate(radians(angle));
 
 angleMode(DEGREES);
 rotate(angle);</pre>
+<div data-type="note">
+  <h3 id="what-is-pi">What Is Pi?</h3>
+  <p>The mathematical constant <strong>pi</strong> (or the Greek letter <span data-type="equation">\pi</span>) is a real number defined as the ratio of a circle’s circumference (the distance around the outside of the circle) to its diameter (a straight line that passes through the circle’s center). It’s equal to approximately 3.14159 and can be accessed in p5.js with the built-in <code>PI</code> variable.</p>
+</div>
 <p>While degrees can be useful, for the purposes of this book, I’ll be working with radians because they’re the standard unit of measurement across many programming languages and graphics environments. If they’re new to you, this is a good opportunity to practice! Additionally, if you aren’t familiar with the way rotation is implemented in p5.js, I recommend watching <a href="https://thecodingtrain.com/transformations">my Coding Train video series on transformations in p5.js</a>.</p>
 <div data-type="exercise">
   <h3 id="exercise-31">Exercise 3.1</h3>