From f800f91190b8cc09176a5e049ec8b51f243194c4 Mon Sep 17 00:00:00 2001
From: jantunesmesias <jantunesmessias@gmail.com>
Date: Mon, 26 Aug 2024 17:36:58 -0300
Subject: [PATCH] WIP

---
 .../card_item_template_component_widget.dart  | 137 +++++++++---------
 1 file changed, 68 insertions(+), 69 deletions(-)

diff --git a/lib/components/templates_components/card_item_template_component/card_item_template_component_widget.dart b/lib/components/templates_components/card_item_template_component/card_item_template_component_widget.dart
index b6a3bfd0..12d77dfd 100644
--- a/lib/components/templates_components/card_item_template_component/card_item_template_component_widget.dart
+++ b/lib/components/templates_components/card_item_template_component/card_item_template_component_widget.dart
@@ -61,8 +61,8 @@ class _CardItemTemplateComponentWidgetState
       final key = entry.key;
       final text = entry.value.toString();
 
-      return Container(
-        color: FlutterFlowTheme.of(context).primary,
+      return Padding(
+        padding: const EdgeInsets.symmetric(vertical: 2.0),
         child: Row(
           children: [
             Text(
@@ -76,6 +76,7 @@ class _CardItemTemplateComponentWidgetState
                     color: FlutterFlowTheme.of(context).primaryText,
                   ),
             ),
+            const SizedBox(width: 8),
             Expanded(
               child: Text(
                 text,
@@ -89,27 +90,23 @@ class _CardItemTemplateComponentWidgetState
                           FlutterFlowTheme.of(context).bodyMediumFamily),
                     ),
               ),
-            )
-          ].divide(const Flexible(child: SizedBox(width: 25))),
+            ),
+          ],
         ),
       );
     }).toList();
   }
 
   Widget _generateImage() {
-    return Flexible(
-      child: SizedBox(
-        width: 100,
-        height: 100,
-        child: ClipRRect(
-          borderRadius: BorderRadius.circular(20),
-          child: CachedNetworkImage(
-            fadeInDuration: const Duration(milliseconds: 500),
-            fadeOutDuration: const Duration(milliseconds: 500),
-            imageUrl: widget.imagePath ?? '',
-            fit: BoxFit.cover,
-          ),
-        ),
+    return ClipRRect(
+      borderRadius: BorderRadius.circular(20),
+      child: CachedNetworkImage(
+        fadeInDuration: const Duration(milliseconds: 500),
+        fadeOutDuration: const Duration(milliseconds: 500),
+        imageUrl: widget.imagePath ?? '',
+        fit: BoxFit.cover,
+        width: 90,
+        height: 90,
       ),
     );
   }
@@ -141,59 +138,61 @@ class _CardItemTemplateComponentWidgetState
   }
 
   Widget _buildContent() {
-    final screenWidth = MediaQuery.of(context).size.width;
-
-    if (screenWidth > 360) {
-      return Row(
-        mainAxisSize: MainAxisSize.max,
-        mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        children: [
-          Expanded(
-            child: Container(
-              color: FlutterFlowTheme.of(context).error,
-              child: Column(
-                mainAxisSize: MainAxisSize.max,
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  ..._generateLabels(),
-                  const SizedBox(height: 5),
-                  Wrap(
-                    spacing: 8,
-                    runSpacing: 8,
-                    children: _generateStatus(),
-                  ),
-                ],
-              ),
-            ),
-          ),
-          _generateImage(),
-        ],
-      );
-    } else {
-      return Column(
-        mainAxisSize: MainAxisSize.max,
-        mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        children: [
-          _generateImage(),
-          const SizedBox(height: 5),
-          Expanded(
-            child: Column(
-              mainAxisSize: MainAxisSize.max,
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                ..._generateLabels(),
-                const SizedBox(height: 5),
-                Wrap(
-                  spacing: 8,
-                  runSpacing: 8,
-                  children: _generateStatus(),
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        if (constraints.maxWidth > 360) {
+          return Row(
+            mainAxisSize: MainAxisSize.max,
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: [
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    ..._generateLabels(),
+                    Wrap(
+                      spacing: 8,
+                      runSpacing: 4,
+                      children: _generateStatus(),
+                    ),
+                  ]
+                      .addToEnd(const Flexible(child: SizedBox(height: 5)))
+                      .divide(const Flexible(child: SizedBox(height: 1)))
+                      .addToStart(const Flexible(child: SizedBox(height: 5))),
                 ),
-              ],
-            ),
-          ),
-        ],
-      );
-    }
+              ),
+              _generateImage(),
+            ]
+                .addToEnd(const SizedBox(width: 10))
+                .addToStart(const SizedBox(width: 10)),
+          );
+        } else {
+          return Column(
+            mainAxisSize: MainAxisSize.max,
+            children: [
+              _generateImage(),
+              Container(
+                color: FlutterFlowTheme.of(context).error,
+                padding: const EdgeInsets.all(8),
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    ..._generateLabels(),
+                    Wrap(
+                      spacing: 8,
+                      runSpacing: 4,
+                      children: _generateStatus(),
+                    ),
+                  ].divide(const Flexible(child: SizedBox(height: 5))),
+                ),
+              ),
+            ].divide(const Flexible(child: SizedBox(height: 5))),
+          );
+        }
+      },
+    );
   }
 
   @override