Implement husband-wife connection dialogue and theme support for learn articles

lib/widgets/quick_log_buttons.dart

@@ -1,54 +1,78 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:google_fonts/google_fonts.dart';
+import '../providers/user_provider.dart';
 import '../theme/app_theme.dart';
 import '../providers/navigation_provider.dart';
+import 'quick_log_dialog.dart';
 
 class QuickLogButtons extends ConsumerWidget {
   const QuickLogButtons({super.key});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return Row(
-      children: [
-        _buildQuickButton(
-          context,
-          icon: Icons.water_drop_outlined,
-          label: 'Period',
-          color: AppColors.menstrualPhase,
-          onTap: () => _navigateToLog(ref),
-        ),
-        const SizedBox(width: 12),
-        _buildQuickButton(
-          context,
-          icon: Icons.emoji_emotions_outlined,
-          label: 'Mood',
-          color: AppColors.softGold,
-          onTap: () => _navigateToLog(ref),
-        ),
-        const SizedBox(width: 12),
-        _buildQuickButton(
-          context,
-          icon: Icons.flash_on_outlined,
-          label: 'Energy',
-          color: AppColors.follicularPhase,
-          onTap: () => _navigateToLog(ref),
-        ),
-        const SizedBox(width: 12),
-        _buildQuickButton(
-          context,
-          icon: Icons.healing_outlined,
-          label: 'Symptoms',
-          color: AppColors.lavender,
-          onTap: () => _navigateToLog(ref),
-        ),
-      ],
+    final userProfile = ref.watch(userProfileProvider);
+    final isPadTrackingEnabled = userProfile?.isPadTrackingEnabled ?? false;
+
+    return Center(
+      child: Wrap(
+        spacing: 12,
+        runSpacing: 12,
+        alignment: WrapAlignment.center,
+        children: [
+          _buildQuickButton(
+            context,
+            icon: Icons.water_drop_outlined,
+            label: 'Period',
+            color: AppColors.menstrualPhase,
+            onTap: () => _showQuickLogDialog(context, 'period'),
+          ),
+          _buildQuickButton(
+            context,
+            icon: Icons.emoji_emotions_outlined,
+            label: 'Mood',
+            color: AppColors.softGold,
+            onTap: () => _showQuickLogDialog(context, 'mood'),
+          ),
+          _buildQuickButton(
+            context,
+            icon: Icons.flash_on_outlined,
+            label: 'Energy',
+            color: AppColors.follicularPhase,
+            onTap: () => _showQuickLogDialog(context, 'energy'),
+          ),
+          _buildQuickButton(
+            context,
+            icon: Icons.healing_outlined,
+            label: 'Symptoms',
+            color: AppColors.rose,
+            onTap: () => _showQuickLogDialog(context, 'symptoms'),
+          ),
+          _buildQuickButton(
+            context,
+            icon: Icons.fastfood_outlined,
+            label: 'Cravings',
+            color: AppColors.lavender,
+            onTap: () => _showQuickLogDialog(context, 'cravings'),
+          ),
+          if (isPadTrackingEnabled)
+            _buildQuickButton(
+              context,
+              icon: Icons.sanitizer_outlined,
+              label: 'Pads',
+              color: AppColors.lutealPhase,
+              onTap: () => _showQuickLogDialog(context, 'pads'),
+            ),
+        ],
+      ),
     );
   }
 
-  void _navigateToLog(WidgetRef ref) {
-    // Navigate to the Log tab (index 2)
-    ref.read(navigationProvider.notifier).setIndex(2);
+  void _showQuickLogDialog(BuildContext context, String logType) {
+    showDialog(
+      context: context,
+      builder: (context) => QuickLogDialog(logType: logType),
+    );
   }
 
   Widget _buildQuickButton(
@@ -60,7 +84,8 @@ class QuickLogButtons extends ConsumerWidget {
   }) {
     final isDark = Theme.of(context).brightness == Brightness.dark;
 
-    return Expanded(
+    return Container(
+      width: 100, // Fixed width for grid item
       child: Material(
         color: Colors.transparent,
         child: InkWell(
@@ -77,12 +102,13 @@ class QuickLogButtons extends ConsumerWidget {
             child: Column(
               mainAxisSize: MainAxisSize.min,
               children: [
-                Icon(icon, color: color, size: 24),
-                const SizedBox(height: 6),
+                Icon(icon, color: color, size: 28), // Slightly larger icon
+                const SizedBox(height: 8),
                 Text(
                   label,
+                  textAlign: TextAlign.center,
                   style: GoogleFonts.outfit(
-                    fontSize: 11,
+                    fontSize: 12, // Slightly larger text
                     fontWeight: FontWeight.w600,
                     color: isDark ? Colors.white.withOpacity(0.9) : color,
                   ),