Merge pull request #47 from franklinogf/issue-dark-mode

animate all toggle text incorrect color when dark

.gitignore

@@ -1,3 +1,4 @@
 /node_modules
 pnpm-lock.yaml
-bun.lockb
+bun.lockb
+package-lock.json

web/src/pages/index.astro

@@ -82,10 +82,10 @@ export default {
       <label class='relative inline-flex cursor-pointer items-center'>
         <input type='checkbox' value='' class='peer sr-only' id='animate' />
         <div
-          class="rtl:peer-checked:after:-translate-x- peer h-8 w-16 rounded-full bg-gray-200 after:absolute after:start-[2px] after:top-[2px] after:h-7 after:w-7 after:rounded-full after:border after:border-gray-300 after:bg-white after:transition-all after:content-[''] peer-checked:bg-zinc-600 peer-checked:after:translate-x-[31px] peer-checked:after:border-white peer-focus:outline-none dark:bg-zinc-300"
+          class="rtl:peer-checked:after:-translate-x- peer h-8 w-16 rounded-full bg-gray-200 after:absolute after:start-[2px] after:top-[2px] after:size-7 after:rounded-full after:border after:border-gray-300 after:bg-white after:transition-all after:content-[''] peer-checked:bg-zinc-600 peer-checked:after:translate-x-[40px] peer-checked:after:border-white peer-focus:outline-none dark:bg-zinc-300"
         >
         </div>
-        <span class='ms-3 text-xl font-medium text-gray-900'>Animate all</span>
+        <span class='ms-3 text-xl font-medium text-gray-900 dark:text-gray-100'>Animate all</span>
       </label>
     </section>