Consolidate prose classes

app/config/sculpin_site.yml

@@ -299,6 +299,9 @@ testimonials:
         title: Digital Strategy Consultant
         tags: [subscription]
 
+prose_classes: |
+    prose marker:text-black prose-a:font-light prose-a:text-blue-primary prose-blockquote:border-blue-primary prose-code:after:content-[''] prose-code:before:content-[''] prose-code:font-normal prose-figcaption:text-white prose-h2:mb-4 prose-h2:text-xl prose-li:my-1 prose-li:text-black prose-li:text-lg prose-p:text-black prose-p:text-lg prose-ul:my-3 hover:prose-a:no-underline dark:marker:text-white dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-hr:border-grey-400 dark:prose-invert dark:prose-li:text-white dark:prose-p:text-white
+
 transistor:
     feed:
         url: https://feeds.transistor.fm/beyond-blocks

source/_includes/about-me.html.twig

@@ -9,7 +9,7 @@
         <img src="{{ site.assets.url }}/assets/images/social-avatar.jpg" alt="Picture of Oliver" class="my-0 w-16 h-16 rounded-full ring-2 ring-gray dark:ring-white">
       </div>
 
-      <div class="prose prose-p:text-black prose-a:font-light prose-a:text-blue-primary prose-p:text-lg prose-blockquote:border-blue-primary dark:marker:text-white prose-li:my-1 prose-li:text-lg prose-figcaption:text-white prose-li:text-black marker:text-black dark:prose-p:text-white dark:prose-invert dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-li:text-white hover:prose-a:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-grey-400 prose-code:before:content-[''] prose-code:after:content-['']">
+      <div class="{{ site.prose_classes }}">
         <p>I'm an Acquia-certified Drupal Triple Expert with {{ macros.yearsExperience }} years of experience, an open-source software maintainer and Drupal core contributor, <a href="/talks">public speaker</a>, <a href="{{ site.youtube.channel.url }}/streams">live streamer</a>, and host of the <a href="/podcast">Beyond Blocks podcast</a>.</p>
       </div>
     </div>

source/_includes/banner.html.twig

@@ -1,7 +1,7 @@
 {% if site.banner_text %}
   <div class="p-3 bg-[#ffc82c] text-black text-base mb-4 dark:text-white dark:bg-[#856200]">
     <div class="min-w-full mx-auto px-6">
-      <div class="mx-auto max-w-xl prose prose-p:text-black prose:a:font-normal prose-p:text-sm prose-p:leading-normal dark:prose-p:text-white dark:prose-a:text-white text-center">
+      <div class="mx-auto max-w-xl text-center {{ site.prose_classes }}">
         {{ site.banner_text|markdown }}
       </div>
     </div>

source/_includes/button.html.twig

@@ -1,5 +1,5 @@
-<div class="not-prose {{ position == 'centre' ? 'flex justify-center' }}">
+<div class="my-4 not-prose {{ position == 'centre' ? 'flex justify-center' }}">
-  <a class="inline-flex justify-center items-center py-3 px-6 w-full text-base font-medium text-white no-underline rounded-md duration-200 ease-in-out md:w-auto hover:bg-white focus:bg-white bg-blue-primary transition-color hover:text-blue-primary focus:text-blue-primary "href="{{ url }}">
+  <a class="inline-flex justify-center items-center py-3 px-6 w-full text-base font-medium text-white no-underline rounded-md duration-200 ease-in-out md:w-auto hover:bg-white focus:bg-white bg-blue-primary transition-color hover:text-blue-primary focus:text-blue-primary"href="{{ url }}">
     {{ text|raw }}
   </a>
 </div>

source/_includes/daily-email-form.html.twig

@@ -119,13 +119,9 @@
         </div>
 
         <footer class="px-4 mt-4 text-center">
-          <Markdown>
+          <div class="{{ site.prose_classes }}">
-            <p>
+            <p>Not sure? <a href="/archive">Browse the archive &rarr;</a></p>
-              Not sure? <a class="link" href="/archive"
+          </div>
-                >Browse the archive &rarr;</a
-              >
-            </p>
-          </Markdown>
         </footer>
 
         <style>

source/_includes/message.html.twig

@@ -1,6 +1,6 @@
 <div class="mb-10 border border-grey-800 dark:border-grey-600">
-  <div class="py-4 px-4 border-l-4 prose prose-p:first:mt-0 prose-strong:text-current border-blue-primary">
+  <div class="py-4 px-4 border-l-4 border-blue-primary">
-    <div class="prose prose-p:text-black prose-a:font-light prose-a:text-blue-primary prose-p:text-lg prose-blockquote:border-blue-primary dark:marker:text-white prose-li:my-1 prose-li:text-lg prose-figcaption:text-white prose-li:text-black marker:text-black dark:prose-p:text-white dark:prose-invert dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-li:text-white hover:prose-a:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-grey-400 prose-code:before:content-[''] prose-code:after:content-['']">
+    <div class="{{ site.prose_classes }}">
       <p>
         <strong>Work with me and support the Drupal project.</strong> 5% from any Drupal-related product or service is donated to the <a href="https://www.drupal.org/association">Drupal Association</a>.
       </p>

source/_includes/testimonials.html.twig

@@ -17,31 +17,27 @@
   <div class="mt-4 space-y-12">
     {% for testimonial in testimonials %}
       <div>
-        <div class="italic prose prose-p:text-black prose-a:font-light prose-a:text-blue-primary prose-p:text-lg prose-blockquote:border-blue-primary dark:marker:text-white prose-li:my-1 prose-li:text-lg prose-figcaption:text-white prose-li:text-black marker:text-black dark:prose-p:text-white dark:prose-invert dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-li:text-white hover:prose-a:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-grey-400 prose-code:before:content-[''] prose-code:after:content-['']">
+      <div class="{{ site.prose_classes }}">
         <blockquote>
             {{ testimonial.text|markdown }}
           </blockquote>
 
-          <div class="not-prose">
+          <div>
             <footer class="mt-8 flex items-center space-x-4 space-x-reverse">
               <span class="text-base">
                 {% if testimonial.url %}
-                  <a href="{{ testimonial.url }}">
+                  <a href="{{ testimonial.url }}">{{ testimonial.name }}</a>
-                    {{ testimonial.name }}
-                    {% if testimonial.title %}
-                      - {{ testimonial.title }}
-                    {% endif %}
-                  </a>
                 {% else %}
                   {{ testimonial.name }}
-                  {% if testimonial.title %}
+                {% endif %}
-                    - {{ testimonial.title }}
+
-                  {% endif %}
+                {% if testimonial.title %}
+                  - {{ testimonial.title }}
                 {% endif %}
               </span>
 
               {% if testimonial.image %}
-                <span class="order-first flex-shrink-0">
+                <span class="not-prose order-first flex-shrink-0">
                   <img class="size-16 rounded-full ring-2 ring-gray-500 dark:ring-white" alt="Photo of {{ testimonial.name }}" src="{{ testimonial.image.url }}" />
                 </span>
               {% endif %}

source/_layouts/default.html.twig

@@ -19,7 +19,7 @@
             {% block page_title %}{{ page.title }}{% endblock %}
           </h1>
 
-          <div class="prose prose-p:text-black prose-a:font-light prose-a:text-blue-primary prose-p:text-lg prose-blockquote:border-blue-primary dark:marker:text-white prose-li:my-1 prose-li:text-lg prose-figcaption:text-white prose-li:text-black marker:text-black dark:prose-p:text-white dark:prose-invert dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-li:text-white hover:prose-a:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-grey-400 prose-code:before:content-[''] prose-code:after:content-['']">
+          <div class="{{ site.prose_classes }}">
             {% block content_wrapper %}
               {% block content %}{% endblock %}
             {% endblock %}

source/_pages/index.md

@@ -44,7 +44,7 @@ Here are [all my products and services][pricing]. If you still can't find what y
   <section>
       <h2 class="font-bold text-xl">Get in touch</h2>
       <div class="mt-4 grid gap-4">
-        <div class="prose prose-p:text-black prose-a:font-light prose-a:text-blue-primary prose-p:text-lg prose-blockquote:border-blue-primary dark:marker:text-white prose-li:my-1 prose-li:text-lg prose-figcaption:text-white prose-li:text-black marker:text-black dark:prose-p:text-white dark:prose-invert dark:prose-a:text-blue-400 dark:prose-blockquote:border-blue-400 dark:prose-li:text-white hover:prose-a:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-grey-400 prose-code:before:content-[''] prose-code:after:content-['']">
+        <div class="{{ site.prose_classes }}">
             <p>There's no reason to wait. Send me an email and I'll get back to you ASAP.</p>
         </div>
         <div>