docs: add quick jump list to some existing posts

website/source/_posts/drupal-body-classes-tailwind-css.md

@@ -5,6 +5,10 @@ date: 2022-07-02
 tags:
     - drupal
     - tailwind-css
+toc:
+    - Adding classes to a safelist
+    - Extracting the safelist to a file
+    - Creating a safelist file automatically with Drush
 ---
 
 I was recently [asked a question](https://www.drupal.org/project/tailwindcss/issues/3271487) in the issue queue for my [Tailwind starter kit Drupal theme](https://www.drupal.org/project/tailwindcss), about how to use classes within content with Tailwind CSS.
@@ -13,7 +17,7 @@ The 5.x version of the theme has the JIT (just in time) compiler enabled by defa
 
 This is something that I've needed to solve in some of my own projects before too so there are a few options but I'd not recommend turning off the JIT compiler or PurgeCSS.
 
-## Adding classes to a safelist
+{% include "post/heading-with-anchor" with { text: page.toc.0 } only %}
 
 The first option is to use the `safelist` option within the `tailwind.config.js` file:
 
@@ -36,7 +40,7 @@ This is refered to within the Tailwind CSS documentation for [safelisting classe
 
 > One example of where this can be useful is if your site displays user-generated content and you want users to be able to use a constrained set of Tailwind classes in their content that might not exist in your own site’s source files.
 
-## Extracting the safelist to a file
+{% include "post/heading-with-anchor" with { text: page.toc.1 } only %}
 
 In some projects, I found that I was adding a lot of classes to the safelist so I extracted the classes into a file instead.
 
@@ -59,7 +63,7 @@ module.exports = {
 }
 ```
 
-## Creating a safelist file automatically with Drush
+{% include "post/heading-with-anchor" with { text: page.toc.2 } only %}
 
 What we could also do is create the safelist file automatically based on the contents of the database using a custom Drush command.
 

website/source/_posts/feature-flags-sculpin.md

@@ -4,13 +4,18 @@ excerpt: |
     How I've started using feature flags within a client's Sculpin website.
 tags: [sculpin]
 date: "2022-01-09"
+toc:
+    - Background
+    - Introducing feature flags
+    - Feature flags in Sculpin
+    - Using the Facebook pixel feature flag
 ---
 
 <div class="flex justify-center">
   <img class="h-auto mb-4 w-[150px]" src="/images/sculpin-jackson.png" />
 </div>
 
-## Background
+{% include "post/heading-with-anchor" with { text: page.toc.0 } only %}
 
 I was asked last week to add a new feature, a Facebook pixel for measuring and
 building advertising campaigns, to a client's website which I built using the
@@ -36,7 +41,7 @@ facebook:
         id: ~
 ```
 
-## Introducing feature flags
+{% include "post/heading-with-anchor" with { text: page.toc.1 } only %}
 
 A technique that I like to use on other projects is using
 [feature flags](https://www.atlassian.com/continuous-delivery/principles/feature-flags)
@@ -47,7 +52,7 @@ toggling a feature - a static site will need to be re-generated and deployed -
 I thought that there was value in being able to easily toggle a feature without
 changing its configuration or removing code within the site's templates.
 
-## Feature flags in Sculpin
+{% include "post/heading-with-anchor" with { text: page.toc.2 } only %}
 
 My Sculpin feature flag implementation was to add a `feature_flags` key within
 `sculpin_site.yml`, with each feature's name as the key and a boolean value to
@@ -61,7 +66,7 @@ feature_flags:
     add_facebook_pixel: true
 ```
 
-## Using the Facebook pixel feature flag
+{% include "post/heading-with-anchor" with { text: page.toc.3 } only %}
 
 The Facebook pixel code is stored within it's own partial that I can include
 from my `source/_layouts/app.html.twig` layout, including the pixel ID and