Change zinc to neutral

themes/opdavies/templates/email-signup-form.html.twig

@@ -77,7 +77,7 @@
         </div>
 
         <footer class="px-4 mt-4 text-center">
-          <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-['']
+          <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-['']
     ">
             <p>Not sure? <a href="/archive">Browse the archive →</a></p>
           </div>

themes/opdavies/templates/field--body.html.twig

@@ -45,7 +45,7 @@
 %}
 
 {%
-  set prose_classes = "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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-[''] prose-pre:bg-zinc-200 prose-pre:text-black prose-pre:rounded-none prose-code:bg-zinc-200"
+  set prose_classes = "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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-[''] prose-pre:bg-neutral-200 prose-pre:text-black prose-pre:rounded-none prose-code:bg-neutral-200"
 %}
 
 {% if label_hidden %}

themes/opdavies/templates/menu--main.html.twig

@@ -36,7 +36,7 @@
     {% for item in items %}
       <li{{ item.attributes }}>
         {{ link(item.title, item.url, {
-          class: 'mx-3 mb-3 text-base block underline md:text-lg dark:text-white hover:no-underline link dark:hover:text-blue-400 hover:text-zinc-900',
+          class: 'mx-3 mb-3 text-base block underline md:text-lg dark:text-white hover:no-underline link dark:hover:text-blue-400 hover:text-neutral-900',
         }) }}
 
         {% if item.below %}

themes/opdavies/templates/menu-local-task.html.twig

@@ -19,7 +19,7 @@
 {% set isActive = element['#active'] %}
 
 {% set classes = [
-  'inline-block px-4 py-3 border-b-2 rounded-t-lg hover:text-blue-primary hover:border-blue-primary dark:hover:text-zinc-300',
+  'inline-block px-4 py-3 border-b-2 rounded-t-lg hover:text-blue-primary hover:border-blue-primary dark:hover:text-neutral-300',
   isActive ? 'text-blue-primary border-blue-primary' : 'border-transparent',
 ] %}
 

themes/opdavies/templates/menu-local-tasks.html.twig

@@ -14,14 +14,14 @@
  */
 #}
 {% if primary %}
-  <div class="text-sm font-medium text-center text-zinc-500 border-b border-zinc-200 dark:text-zinc-400 dark:border-zinc-700">
+  <div class="text-sm font-medium text-center text-neutral-500 border-b border-neutral-200 dark:text-neutral-400 dark:border-neutral-700">
     <h2 class="visually-hidden">{{ 'Primary tabs'|t }}</h2>
     <ul class="flex flex-wrap -mb-px">{{ primary }}</ul>
   </div>
 {% endif %}
 
 {% if secondary %}
-  <div class="text-sm font-medium text-center text-zinc-500 border-b border-zinc-200 dark:text-zinc-400 dark:border-zinc-700">
+  <div class="text-sm font-medium text-center text-neutral-500 border-b border-neutral-200 dark:text-neutral-400 dark:border-neutral-700">
     <h2 class="visually-hidden">{{ 'Secondary tabs'|t }}</h2>
     <ul class="flex flex-wrap -mb-px">{{ secondary }}</ul>
   </div>

themes/opdavies/templates/node--podcast-episode--full.html.twig

@@ -69,7 +69,7 @@
   {% endif %}
   {{ title_suffix }}
 
-  <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-['']">
+  <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-['']">
     {% if display_submitted %}
       <div class="my-2 text-base">
         {% set created = node.getCreatedTime() %}

themes/opdavies/templates/node--podcast-episode.html.twig

@@ -69,7 +69,7 @@
   {% endif %}
   {{ title_suffix }}
 
-  <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-['']">
+  <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-['']">
     {% if display_submitted %}
       <div class="my-2 text-base">
         {% set created = node.getCreatedTime() %}

themes/opdavies/templates/page.html.twig

@@ -45,7 +45,7 @@
  * @ingroup themeable
  */
 #}
-<div class="min-h-screen font-sans text-base font-light md:text-xl dark:text-white text-zinc-900 selection:bg-blue-primary selection:text-white dark:bg-zinc-900 dark:selection:bg-blue-primary dark:selection:text-white">
+<div class="min-h-screen font-sans text-base font-light md:text-xl dark:text-white text-neutral-900 selection:bg-blue-primary selection:text-white dark:bg-neutral-900 dark:selection:bg-blue-primary dark:selection:text-white">
   <div class="wrapper py-4 px-4 mx-auto max-w-xl">
     <header class="flex flex-col justify-between items-center md:flex-row">
       <div class="flex flex-col justify-between items-center md:flex-row">
@@ -106,7 +106,7 @@
               <img src="/assets/images/social-avatar.jpg" alt="Picture of Oliver" class="my-0 w-16 h-16 rounded-full ring-[3px] ring-blue-primary 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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-['']">
+            <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-['']">
               <p>I'm an certified Drupal Triple Expert with 18 years of experience, a Drupal core contributor, <a href="/presentations">public speaker</a>, <a href="https://www.youtube.com/@opdavies/streams">live streamer</a>, and host of the <a href="/podcast">Beyond Blocks podcast</a>.</p>
             </div>
           </div>

themes/opdavies/templates/views-view--daily-email-archive.html.twig

@@ -42,7 +42,7 @@
   {{ title }}
   {{ title_suffix }}
 
-  <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-['']">
+  <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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-['']">
     {% if header %}
       <header>
         {{ header }}

themes/opdavies/templates/views-view--podcast-episodes.html.twig

@@ -44,7 +44,7 @@
 
   <div>
     {% if header %}
-      <header 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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-zinc-400 prose-code:before:content-[''] prose-code:after:content-['']">
+      <header 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 prose-a:hover:no-underline prose-h2:text-xl prose-code:font-normal prose-h2:mb-4 prose-ul:my-3 dark:prose-hr:border-neutral-400 prose-code:before:content-[''] prose-code:after:content-['']">
         {{ header }}
       </header>
     {% endif %}