Update CaptionedTextWidget

lib/ui/advanced_settings_screen.dart

@@ -66,22 +66,21 @@ class _AdvancedSettingsScreenState extends State<AdvancedSettingsScreen> {
                                 _showPhotoGridSizePicker();
                               },
                               child: MenuItemWidget(
-                                captionedTextWidget: const CaptionedTextWidget(
-                                  title: "Photo grid size",
+                                captionedTextWidget: Expanded(
+                                  child: Row(
+                                    mainAxisAlignment: MainAxisAlignment.start,
+                                    children: [
+                                      CaptionedTextWidget(
+                                        title: "Photo grid size",
+                                        subTitle: _photoGridSize.toString(),
+                                      ),
+                                    ],
+                                  ),
                                 ),
                                 menuItemColor: colorScheme.fillFaint,
-                                trailingWidget: Row(
-                                  mainAxisAlignment: MainAxisAlignment.center,
-                                  crossAxisAlignment: CrossAxisAlignment.center,
-                                  children: [
-                                    Text(
-                                      _photoGridSize.toString(),
-                                    ),
-                                    Icon(
-                                      Icons.chevron_right,
-                                      color: colorScheme.strokeMuted,
-                                    ),
-                                  ],
+                                trailingWidget: Icon(
+                                  Icons.chevron_right,
+                                  color: colorScheme.strokeMuted,
                                 ),
                                 borderRadius: 8,
                                 alignCaptionedTextToLeft: true,

lib/ui/components/captioned_text_widget.dart

@@ -21,35 +21,42 @@ class CaptionedTextWidget extends StatelessWidget {
     final enteColorScheme = Theme.of(context).colorScheme.enteTheme.colorScheme;
     final enteTextTheme = Theme.of(context).colorScheme.enteTheme.textTheme;
 
+    final List<Widget> children = [
+      Flexible(
+        child: Text(
+          title,
+          style: textStyle ??
+              (makeTextBold
+                  ? enteTextTheme.bodyBold.copyWith(color: textColor)
+                  : enteTextTheme.body.copyWith(color: textColor)),
+        ),
+      ),
+    ];
+    if (subTitle != null) {
+      children.add(const SizedBox(width: 4));
+      children.add(
+        Text(
+          '\u2022',
+          style: enteTextTheme.small.copyWith(
+            color: enteColorScheme.textMuted,
+          ),
+        ),
+      );
+      children.add(const SizedBox(width: 4));
+      children.add(
+        Text(
+          subTitle!,
+          style: enteTextTheme.small.copyWith(
+            color: enteColorScheme.textMuted,
+          ),
+        ),
+      );
+    }
     return Flexible(
       child: Padding(
         padding: const EdgeInsets.symmetric(vertical: 14, horizontal: 2),
         child: Row(
-          children: [
-            Flexible(
-              child: RichText(
-                text: TextSpan(
-                  style: textStyle ??
-                      (makeTextBold
-                          ? enteTextTheme.bodyBold.copyWith(color: textColor)
-                          : enteTextTheme.body.copyWith(color: textColor)),
-                  children: [
-                    TextSpan(
-                      text: title,
-                    ),
-                    subTitle != null
-                        ? TextSpan(
-                            text: ' \u2022 $subTitle',
-                            style: enteTextTheme.small.copyWith(
-                              color: enteColorScheme.textMuted,
-                            ),
-                          )
-                        : const TextSpan(text: ''),
-                  ],
-                ),
-              ),
-            )
-          ],
+          children: children,
         ),
       ),
     );