fixes for maths page

_pages/creative-coding/animations.md

@@ -82,7 +82,7 @@ We now have a simple, infinite, animation using our `draw()` loop.
 
 ## More Animation Dimensions
 
-Both the `mod(%)` operator and `map()` function that we looked at [here](../../p5/math/) can be really useful when doing animation.
+Both the `mod(%)` operator and `map()` function that we looked at [here](../maths/) can be really useful when doing animation.
 
 We can use the `map()` function to create an animation based on time. In this example we map the seconds that have passed in the current minute of time to the diameter of a circle. We know seconds has a range $$[0, 59]$$, so it's just a matter of choosing the smallest and largest values for the diameter.
 

_pages/creative-coding/data.md

@@ -47,7 +47,7 @@ Some things to note about the above sketch:
 
 2. We first load the JSON into a variable called `dataObject` and then in `setup()` use that variable and some JavaScript functions to actually put the contents of the file into an array that we can iterate. This is not necessary all the time, only when our file specifies an array and we want to work with an array. If we look at the p5.js documentation for [`loadJSON()`](https://p5js.org/reference/#/p5/loadJSON), it says: *Note that even if the JSON file contains an Array, an Object will be returned*. We use: `Object.values(dataObject)` to turn the Object into an array.
 
-3. During `setup()` we are iterating through all of the data points in our dataset to determine the minimum and maximum values for $$2$$ properties (`price` and `points`). This is needed so we can use [`map()`](https://p5js.org/reference/#/p5/map) later in `draw()` to scale these values and use the whole canvas to visualize the data (a detailed explanation of `map()` can be found [here](../../creative-coding/maths/)).
+3. During `setup()` we are iterating through all of the data points in our dataset to determine the minimum and maximum values for $$2$$ properties (`price` and `points`). This is needed so we can use [`map()`](https://p5js.org/reference/#/p5/map) later in `draw()` to scale these values and use the whole canvas to visualize the data (a detailed explanation of `map()` can be found [here](../maths/)).
 
 One more thing about parameters/fields from a JSON: sometimes the field names will have spaces ("final price", "CRASH TIME") or special characters ("pm2.5", "U$D") and accessing them with just the dot notation won't work:
 ```js

_pages/index.md

@@ -35,8 +35,8 @@ permalink: /
 {% capture topics %}
   transformations
   interactions
-  animations
   maths
+  animations
   cycles
   sincos
   data

css/main.scss

@@ -19,6 +19,7 @@ body {
   --text-color-a-h: #6da0dc;
   --bgnd-color: #fff;
   --bgnd-color-h: #eaeaea;
+  --banner-color: #2e7bcf;
   --mobile-max: $mobile-max;
   --desktop-max: 800px;
 
@@ -76,7 +77,7 @@ th {
 
   .nav-container {
     color: var(--bgnd-color);
-    background: #2e7bcf url("{{ '/assets/images/header-bg.jpg' | relative_url }}") 0 0 repeat-x;
+    background: var(--banner-color) url("{{ '/assets/images/header-bg.jpg' | relative_url }}") 0 0 repeat-x;
 
     a.nav-home-link {
       color: var(--bgnd-color);
@@ -152,7 +153,7 @@ th {
 
   .p5-editor-wrapper {
     --editor-height: 640px;
-    --editor-y-offset: -45px;
+    --editor-y-offset: -69px;
     --editor-x-offset: -18px;
   }