fix(card-grid): update box-shadow properties to use CSS variables for consistency

ArhanAnsari · ArhanAnsari · commit baca1ecffffc · 2026-04-09T19:14:37.000+05:30
diff --git a/src/lib/components/cardGrid.svelte b/src/lib/components/cardGrid.svelte
@@ -44,17 +44,17 @@
         transition:
             transform 200ms cubic-bezier(0.4, 0, 0.2, 1),
             box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
-        will-change: transform, box-shadow;
     }
 
     .card-grid-wrapper :global(.card:hover) {
+        will-change: transform, box-shadow;
         transform: translateY(-2px);
-        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
+        box-shadow: var(--shadow-md, 0 8px 20px rgba(0, 0, 0, 0.12));
     }
 
     .card-grid-wrapper :global(.card:active) {
         transform: translateY(0);
-        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
+        box-shadow: var(--shadow-sm, 0 4px 10px rgba(0, 0, 0, 0.08));
     }
 
     .card-grid-content {

Original file line number	Diff line number	Diff line change
`@@ -44,17 +44,17 @@`
`44`	`44`	`transition:`
`45`	`45`	`transform 200ms cubic-bezier(0.4, 0, 0.2, 1),`
`46`	`46`	`box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);`
`47`		`- will-change: transform, box-shadow;`
`48`	`47`	`}`
`49`	`48`
`50`	`49`	`.card-grid-wrapper :global(.card:hover) {`
	`50`	`+ will-change: transform, box-shadow;`
`51`	`51`	`transform: translateY(-2px);`
`52`		`- box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);`
	`52`	`+ box-shadow: var(--shadow-md, 0 8px 20px rgba(0, 0, 0, 0.12));`
`53`	`53`	`}`
`54`	`54`
`55`	`55`	`.card-grid-wrapper :global(.card:active) {`
`56`	`56`	`transform: translateY(0);`
`57`		`- box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);`
	`57`	`+ box-shadow: var(--shadow-sm, 0 4px 10px rgba(0, 0, 0, 0.08));`
`58`	`58`	`}`
`59`	`59`
`60`	`60`	`.card-grid-content {`