Update button as well

Author: handotdev

snippets/color-generator.mdx

@@ -25,7 +25,7 @@ export const ColorGenerator = () => {
   }
 
   return (
-    <div className="p-4 border dark:border-white/20 rounded-xl bg-white dark:bg-white/5 shadow-sm not-prose">
+    <div className="p-4 border dark:border-white/20 rounded-xl bg-white dark:bg-white/5 not-prose">
       <p className="text-xl mb-4 font-semibold text-zinc-950/80 dark:text-white">HSL Color Generator</p>
 
       <div className="space-y-4">

snippets/counter.mdx

@@ -6,22 +6,22 @@ export const Counter = () => {
 
   return (
   <div className="flex items-center justify-center">
-      <div className="flex items-center rounded-lg overflow-hidden border border-gray-200 dark:border-gray-700 shadow-sm">
+      <div className="flex items-center rounded-lg overflow-hidden border border-zinc-950/20 dark:border-white/20">
         <button
           onClick={decrement}
-          className="flex items-center justify-center h-8 w-8 bg-white hover:bg-gray-100 text-gray-800 dark:bg-gray-900 dark:hover:bg-gray-800 dark:text-gray-200 border-r border-gray-200 dark:border-gray-700"
+          className="flex items-center justify-center h-8 w-8 bg-white hover:bg-zinc-950/10 text-zinc-950/80 dark:bg-zinc-950 dark:hover:bg-white/10 dark:text-white/80 border-r border-zinc-950/20 dark:border-white/20"
           aria-label="Decrease"
         >
           -
         </button>
 
-        <div className="flex text-sm items-center justify-center h-8 px-6 bg-white dark:bg-gray-900 text-gray-900 dark:text-gray-100 font-medium min-w-[4rem] text-center">
+        <div className="flex text-sm items-center justify-center h-8 px-6 bg-white dark:bg-zinc-950/90 text-zinc-950/80 dark:text-white/80 font-medium min-w-[4rem] text-center">
           {count}
         </div>
 
         <button
           onClick={increment}
-          className="flex items-center justify-center h-8 w-8 bg-white hover:bg-gray-100 text-gray-800 dark:bg-gray-900 dark:hover:bg-gray-800 dark:text-gray-200 border-l border-gray-200 dark:border-gray-700"
+          className="flex items-center justify-center h-8 w-8 bg-white hover:bg-zinc-950/10 text-zinc-950/80 dark:bg-zinc-950 dark:hover:bg-white/10 dark:text-white/80 border-l border-zinc-950/20 dark:border-white/20"
           aria-label="Increase"
         >
           +