From 359239b67a1a0fe300bcdcb877bcb908141b1410 Mon Sep 17 00:00:00 2001
From: ogzCode <oguzguc44@gmail.com>
Date: Sun, 11 May 2025 09:45:11 +0300
Subject: [PATCH 1/3] fix: update card component classes for consistent minimum
 width

Adjusted card classes in useCardClasses to use min-w-sm and min-w-xl for better layout consistency across variants.
---
 src/components/FwbCard/composables/useCardClasses.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/FwbCard/composables/useCardClasses.ts b/src/components/FwbCard/composables/useCardClasses.ts
index 2881bfba..3657e148 100644
--- a/src/components/FwbCard/composables/useCardClasses.ts
+++ b/src/components/FwbCard/composables/useCardClasses.ts
@@ -14,13 +14,13 @@ export function useCardsClasses (props: UseCardsClassesProps): {
   const cardClasses = computed(() => {
     let computedClasses = ''
     if (props.variant.value === 'image') {
-      computedClasses = 'max-w-sm bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700'
+      computedClasses = 'min-w-sm bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700'
     }
 
     if (props.variant.value === 'default') {
-      computedClasses = 'block max-w-sm bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700 '
+      computedClasses = 'block min-w-sm bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700 '
     } else if (props.variant.value === 'horizontal') {
-      computedClasses = 'flex flex-col items-center bg-white rounded-lg border shadow-md md:flex-row md:max-w-xl dark:border-gray-700 dark:bg-gray-800'
+      computedClasses = 'flex flex-col items-center bg-white rounded-lg border shadow-md md:flex-row md:min-w-xl dark:border-gray-700 dark:bg-gray-800'
     }
 
     if (props.href?.value) {

From 9ccffc4459005f55674ac3a6c7b9412bfad43ca0 Mon Sep 17 00:00:00 2001
From: ogzCode <oguzguc44@gmail.com>
Date: Sun, 11 May 2025 09:45:17 +0300
Subject: [PATCH 2/3] fix: update card component classes for improved
 responsiveness

Added responsive width classes to card components for better layout across different screen sizes.
---
 docs/components/card.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/components/card.md b/docs/components/card.md
index 8c7d6bde..d8854c2f 100644
--- a/docs/components/card.md
+++ b/docs/components/card.md
@@ -20,7 +20,7 @@ Use these responsive card components to show data entries and information to you
 <fwb-card-example />
 ```vue
 <template>
-    <fwb-card href="#">
+    <fwb-card href="#" class="w-sm">
       <div class="p-5">
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
           Noteworthy technology acquisitions 2021
@@ -46,6 +46,7 @@ import { FwbCard } from 'flowbite-vue'
       img-alt="Desk"
       img-src="https://flowbite.com/docs/images/blog/image-1.jpg"
       variant="image"
+      class="w-md"
     >
       <div class="p-5">
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
@@ -72,6 +73,7 @@ import { FwbCard } from 'flowbite-vue'
       img-alt="Desk"
       img-src="https://flowbite.com/docs/images/blog/image-4.jpg"
       variant="horizontal"
+      class="w-lg"
     >
       <div class="p-5">
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">

From e380eef19b8a9b186bb089c27c420054a33bba33 Mon Sep 17 00:00:00 2001
From: ogzCode <oguzguc44@gmail.com>
Date: Sun, 11 May 2025 09:45:28 +0300
Subject: [PATCH 3/3] fix: enhance card component classes for better
 responsiveness

Added specific width classes to card examples to improve layout adaptability across various screen sizes.
---
 docs/components/card/examples/FwbCardExample.vue           | 2 +-
 docs/components/card/examples/FwbCardExampleHorizontal.vue | 1 +
 docs/components/card/examples/FwbCardExampleImage.vue      | 1 +
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/components/card/examples/FwbCardExample.vue b/docs/components/card/examples/FwbCardExample.vue
index ec46ea36..9f31dcf7 100644
--- a/docs/components/card/examples/FwbCardExample.vue
+++ b/docs/components/card/examples/FwbCardExample.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="vp-raw inline-flex flex-wrap gap-2">
-    <fwb-card href="#">
+    <fwb-card href="#" class="w-sm">
       <div class="p-5">
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
           Noteworthy technology acquisitions 2021
diff --git a/docs/components/card/examples/FwbCardExampleHorizontal.vue b/docs/components/card/examples/FwbCardExampleHorizontal.vue
index f7093f23..0c9aa848 100644
--- a/docs/components/card/examples/FwbCardExampleHorizontal.vue
+++ b/docs/components/card/examples/FwbCardExampleHorizontal.vue
@@ -4,6 +4,7 @@
       img-alt="Desk"
       img-src="https://flowbite.com/docs/images/blog/image-4.jpg"
       variant="horizontal"
+      class="w-lg"
     >
       <div class="p-5">
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
diff --git a/docs/components/card/examples/FwbCardExampleImage.vue b/docs/components/card/examples/FwbCardExampleImage.vue
index 3abbb0fa..87883b1f 100644
--- a/docs/components/card/examples/FwbCardExampleImage.vue
+++ b/docs/components/card/examples/FwbCardExampleImage.vue
@@ -4,6 +4,7 @@
       img-alt="Desk"
       img-src="https://flowbite.com/docs/images/blog/image-1.jpg"
       variant="image"
+      class="w-md"
     >
       <div class="p-5">
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">