From b6b4a562b92ecd9bfc56ed3a5e27deee65577cd2 Mon Sep 17 00:00:00 2001
From: Johnpaul <polymenjohn1@gmail.com>
Date: Tue, 23 Sep 2025 06:30:07 +0100
Subject: [PATCH] fix: refactor containerClasses and containerStyle to use cn()
 and prevent undefined behaviour

---
 src/components/card/CardBottom.vue    | 6 ++++--
 src/components/card/CardContainer.vue | 4 ++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/card/CardBottom.vue b/src/components/card/CardBottom.vue
index 687301baa..4a0ae1047 100644
--- a/src/components/card/CardBottom.vue
+++ b/src/components/card/CardBottom.vue
@@ -7,11 +7,13 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 
+import { cn } from '@/utils/tailwindUtil'
+
 const { fullHeight = true } = defineProps<{
   fullHeight?: boolean
 }>()
 
-const containerClasses = computed(
-  () => `flex-1 w-full${fullHeight ? ' h-full' : ''}`
+const containerClasses = computed(() =>
+  cn('flex-1 w-full', fullHeight && 'h-full')
 )
 </script>
diff --git a/src/components/card/CardContainer.vue b/src/components/card/CardContainer.vue
index bf5ca62b5..014739d7b 100644
--- a/src/components/card/CardContainer.vue
+++ b/src/components/card/CardContainer.vue
@@ -35,8 +35,8 @@ const containerClasses = computed(() => {
 const containerStyle = computed(() =>
   maxWidth || minWidth
     ? {
-        maxWidth: `${maxWidth}px`,
-        minWidth: `${minWidth}px`
+        maxWidth: maxWidth ? `${maxWidth}px` : undefined,
+        minWidth: minWidth ? `${minWidth}px` : undefined
       }
     : {}
 )