Improve dark mode in demo

Author: reinink

src/pages/blog/tailwindcss-v3-3/index.mdx

@@ -173,21 +173,15 @@ We released our [official line-clamp plugin](https://tailwindcss.com/blog/multi-
 
 <Example p="none">
   <div class="px-4 sm:px-0">
-    <div class="mx-auto max-w-sm bg-white p-8 text-sm leading-6 text-slate-700 shadow-xl dark:bg-slate-800 dark:text-slate-400 sm:text-base sm:leading-7">
-      <article>
-        <div class="max-w-xl">
-          <time datetime="2020-03-16" class="block text-sm leading-6 text-gray-600">Mar 10, 2020</time>
-          <h2 class="mt-2 text-lg font-semibold text-gray-900">
-            Boost your conversion rate
-          </h2>
-          <p class="line-clamp-3 mt-4 text-sm leading-6 text-gray-600">Nulla dolor velit adipisicing duis excepteur esse in duis nostrud occaecat mollit incididunt deserunt sunt. Ut ut sunt laborum ex occaecat eu tempor labore enim adipisicing minim ad. Est in quis eu dolore occaecat excepteur fugiat dolore nisi aliqua fugiat enim ut cillum. Labore enim duis nostrud eu. Est ut eiusmod consequat irure quis deserunt ex. Enim laboris dolor magna pariatur. Dolor et ad sint voluptate sunt elit mollit officia ad enim sit consectetur enim.</p>
-        </div>
-        <div class="mt-4 flex gap-x-2.5 text-sm font-semibold leading-6 text-gray-900">
-          <img src="https://images.unsplash.com/photo-1517841905240-472988babdf9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="" class="h-6 w-6 flex-none rounded-full bg-gray-50" />
-          Lindsay Walton
-        </div>
-      </article>
-    </div>
+    <article class="mx-auto max-w-sm bg-white p-8 text-sm leading-6 text-slate-700 shadow-xl dark:bg-slate-800 dark:text-slate-400 sm:text-base sm:leading-7">
+      <time datetime="2020-03-16" class="block text-sm leading-6 text-slate-500 dark:text-slate-400">Mar 10, 2020</time>
+      <h2 class="mt-2 text-lg font-semibold text-slate-900 dark:text-slate-200">Boost your conversion rate</h2>
+      <p class="line-clamp-3 mt-4 text-sm leading-6 text-slate-500 dark:text-slate-400">Nulla dolor velit adipisicing duis excepteur esse in duis nostrud occaecat mollit incididunt deserunt sunt. Ut ut sunt laborum ex occaecat eu tempor labore enim adipisicing minim ad. Est in quis eu dolore occaecat excepteur fugiat dolore nisi aliqua fugiat enim ut cillum. Labore enim duis nostrud eu. Est ut eiusmod consequat irure quis deserunt ex. Enim laboris dolor magna pariatur. Dolor et ad sint voluptate sunt elit mollit officia ad enim sit consectetur enim.</p>
+      <div class="mt-4 flex gap-x-2.5 text-sm font-semibold leading-6 text-slate-900 dark:text-slate-200">
+        <img class="h-6 w-6 flex-none rounded-full bg-slate-50 dark:bg-slate-900" src="https://images.unsplash.com/photo-1517841905240-472988babdf9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="" />
+        Lindsay Walton
+      </div>
+    </article>
   </div>
 </Example>