change skeleton color

Author: maxaleks

components/SkeletonCard.tsx

@@ -2,20 +2,20 @@ export default function SkeletonCard() {
   return (
     <div className="bg-white p-6 flex flex-col border rounded-[20px] animate-pulse">
       <div className="flex justify-between items-start mb-6">
-        <div className="bg-gray-200 h-6 w-32 rounded"></div>
+        <div className="bg-[#f4f5f6] h-6 w-32 rounded"></div>
       </div>
       <div className="flex items-center mb-4 gap-3">
-        <div className="w-14 h-14 bg-gray-200 rounded-lg"></div>
-        <div className="h-8 bg-gray-200 rounded w-1/2"></div>
+        <div className="w-14 h-14 bg-[#f4f5f6] rounded-lg"></div>
+        <div className="h-8 bg-[#f4f5f6] rounded w-1/2"></div>
       </div>
       <div className="flex-1 flex flex-col justify-between">
         <div>
-          <div className="bg-gray-200 h-4 w-full mb-2 rounded"></div>
-          <div className="bg-gray-200 h-4 w-3/4 mb-[60px] rounded"></div>
+          <div className="bg-[#f4f5f6] h-4 w-full mb-2 rounded"></div>
+          <div className="bg-[#f4f5f6] h-4 w-3/4 mb-[60px] rounded"></div>
         </div>
         <div className="flex gap-2">
-          <div className="bg-gray-200 h-6 w-16 rounded"></div>
-          <div className="bg-gray-200 h-6 w-16 rounded"></div>
+          <div className="bg-[#f4f5f6] h-6 w-16 rounded"></div>
+          <div className="bg-[#f4f5f6] h-6 w-16 rounded"></div>
         </div>
       </div>
     </div>

components/SkeletonTable.tsx

@@ -5,11 +5,11 @@ export default function SkeletonTable() {
     <div className="w-full animate-pulse">
       <div className="min-w-[836px] rounded-t-lg bg-white">
         <div className="grid h-10 grid-cols-[280px_32px_200px_24px_minmax(0,1fr)_88px] items-center rounded-t-lg bg-[#F5F5F6] px-3">
-          <div className="h-4 w-12 rounded bg-gray-200" />
+          <div className="h-4 w-12 rounded bg-[#f4f5f6]" />
           <div aria-hidden="true" />
-          <div className="h-4 w-20 rounded bg-gray-200" />
+          <div className="h-4 w-20 rounded bg-[#f4f5f6]" />
           <div aria-hidden="true" />
-          <div className="h-4 w-10 rounded bg-gray-200" />
+          <div className="h-4 w-10 rounded bg-[#f4f5f6]" />
           <div aria-hidden="true" />
         </div>
         <div className="divide-y divide-[#F5F5F6]">
@@ -19,23 +19,23 @@ export default function SkeletonTable() {
               className="grid min-h-[76px] grid-cols-[280px_32px_200px_24px_minmax(0,1fr)_88px] items-center px-3 py-[14px]"
             >
               <div className="flex items-center gap-4">
-                <div className="h-8 w-8 rounded bg-gray-200" />
-                <div className="h-5 w-5 rounded bg-gray-200" />
+                <div className="h-8 w-8 rounded bg-[#f4f5f6]" />
+                <div className="h-5 w-5 rounded bg-[#f4f5f6]" />
                 <div className="flex items-center gap-2">
-                  <div className="h-5 w-5 rounded bg-gray-200" />
-                  <div className="h-4 w-28 rounded bg-gray-200" />
+                  <div className="h-5 w-5 rounded bg-[#f4f5f6]" />
+                  <div className="h-4 w-28 rounded bg-[#f4f5f6]" />
                 </div>
               </div>
               <div aria-hidden="true" />
-              <div className="h-6 w-40 rounded bg-gray-200" />
+              <div className="h-6 w-40 rounded bg-[#f4f5f6]" />
               <div aria-hidden="true" />
               <div className="flex gap-2">
-                <div className="h-6 w-8 rounded bg-gray-200" />
-                <div className="h-6 w-16 rounded bg-gray-200" />
-                <div className="h-6 w-20 rounded bg-gray-200" />
+                <div className="h-6 w-8 rounded bg-[#f4f5f6]" />
+                <div className="h-6 w-16 rounded bg-[#f4f5f6]" />
+                <div className="h-6 w-20 rounded bg-[#f4f5f6]" />
               </div>
               <div className="flex justify-end">
-                <div className="h-9 w-16 rounded bg-gray-200" />
+                <div className="h-9 w-16 rounded bg-[#f4f5f6]" />
               </div>
             </div>
           ))}