New Settings (#3065)

* Update display_settings_page.dart

* Update settings_choices_cell.dart

* Update settings_theme_choice.dart

* Convert display_settings_page.dart to NewListSection

* Cleanup [skip ci]

* Minor

* Minor [skip ci]

* Add SizedBox to scroll view

* Upgrade receive_top_bar.dart with gradient and optional child content

* Adjust animations

* Add modal_page_wrapper.dart

* Add option to hide AppBar for BasePage [skip ci]

* New settings all final (#3067)

* Conflict

* ModalPageWrapper improved abstraction

* display_settings_page.dart minor update

* connection_sync_page.dart redesign

* Conflict

* manage_nodes_page.dart initial redesign

* other settings initial

* Conflict

* add optional subtitle to standard_list.dart

* add connection_sync_view_model.dart

* Add missing images

* Conflict

* Update list item widgets

* Conflict

* Conflict

* Conflict

* minor updates

* Conflict

* Fixes + move Mweb to privacy page

* Conflict

* Remove observer from modal_page_wrapper.dart

* Conflict

* Conflict

* Refactor settings_page.dart with suggestions

* Suggestion fixes

* Conflicts + fix About page

* Fix sync bar conflict

* Update Connections page title [skip ci]

* Trigger CI

* Fix Lightning and Payjoin log export

* Update MWEB node page

* Add FeatureFlag to AutomaticNodeSwitching

* Fix address text on privacy_page.dart

* Move WalletConnect from connection_sync_page.dart to settings_page.dart

* Add WalletConnect icon

* Fix settings icons

* Make text strings use S.of(context) and fix About string in settings_page.dart

* Display settings page fixes

* modal_page_wrapper.dart minor suggestions

* Missingimage

* Add spacing to list_item_selector_widget.dart

* Fix error on manage_nodes_page.dart

lib/src/widgets/new_list_row/list_Item_style_wrapper.dart

@@ -6,20 +6,21 @@ class ListItemStyleWrapper extends StatelessWidget {
     required this.isFirstInSection,
     required this.isLastInSection,
     required this.builder,
-    this.hasImage,
     this.onTap,
     this.height = 50,
+    this.iconPath,
   });
 
+  final String? iconPath;
   final bool isFirstInSection;
   final bool isLastInSection;
-  final bool ?hasImage;
   final double height;
   final VoidCallback? onTap;
   final Widget Function(BuildContext context, TextStyle textStyle, TextStyle labelStyle) builder;
 
   @override
   Widget build(BuildContext context) {
+
     final theme = Theme.of(context);
 
     final textStyle = TextStyle(
@@ -60,17 +61,17 @@ class ListItemStyleWrapper extends StatelessWidget {
                         child: Padding(
                             padding: const EdgeInsets.symmetric(horizontal: 12),
                             child: builder(context, textStyle, labelStyle))))),
-            if(hasImage == true && isLastInSection == false) Container(
+            if(iconPath != null && isLastInSection == false) Container(
               color: theme.colorScheme.surfaceContainer,
               child: Padding(
-                padding: const EdgeInsets.only(left: 48, right: 13),
+                padding: const EdgeInsets.only(left: 50, right: 13),
                 child: Container(height: 1, color: theme.colorScheme.outlineVariant),
               ),
             )
             else if(!isLastInSection) Container(
               color: theme.colorScheme.surfaceContainer,
               child: Padding(
-                padding: const EdgeInsets.symmetric(horizontal: 13),
+                padding: const EdgeInsets.symmetric(horizontal: 12),
                 child: Container(height: 1, color: theme.colorScheme.outlineVariant),
               ),
             )

lib/src/widgets/new_list_row/list_item_checkbox_widget.dart

@@ -37,6 +37,7 @@ class _ListItemCheckboxWidgetState extends State<ListItemCheckboxWidget> {
   @override
   Widget build(BuildContext context) {
     return ListItemStyleWrapper(
+      iconPath: widget.iconPath,
       onTap: widget.onTap ?? () {
         widget.onChanged(!widget.value);
       },
@@ -53,11 +54,11 @@ class _ListItemCheckboxWidgetState extends State<ListItemCheckboxWidget> {
                 children: [
                   if (widget.iconPath != null)
                     widget.iconPath!.toLowerCase().endsWith("svg")
-                        ? CakeImageWidget(imageUrl:widget.iconPath!, height: 24, width: 24)
+                        ? CakeImageWidget(imageUrl:widget.iconPath!, height: 26, width: 26)
                         : Image.asset(
                             widget.iconPath!,
-                            width: 24,
-                            height: 24,
+                            width: 26,
+                            height: 26,
                           ),
                   Expanded(
                     child: Column(

lib/src/widgets/new_list_row/list_item_regular_row_widget.dart

@@ -12,7 +12,6 @@ class ListItemRegularRowWidget extends StatelessWidget {
     this.trailingText,
     this.iconPath,
     this.onTap,
-    this.hasImage,
     this.isFirstInSection = false,
     this.isLastInSection = false,
     this.showArrow = true,
@@ -28,7 +27,6 @@ class ListItemRegularRowWidget extends StatelessWidget {
   final String? trailingText;
   final String? iconPath;
   final VoidCallback? onTap;
-  final bool? hasImage;
   final bool isFirstInSection;
   final bool isLastInSection;
   final bool showArrow;
@@ -46,7 +44,7 @@ class ListItemRegularRowWidget extends StatelessWidget {
 
     return ListItemStyleWrapper(
       onTap: onTap,
-        hasImage: iconPath != null ? true : false,
+        iconPath: iconPath,
         isFirstInSection: isFirstInSection,
         isLastInSection: isLastInSection,
         height: subtitle != null ? 64 : 50,

lib/src/widgets/new_list_row/list_item_selector_widget.dart

@@ -33,25 +33,25 @@ class ListItemSelectorWidget extends StatelessWidget {
         isLastInSection: isLastInSection,
         builder: (context, textStyle, labelStyle) {
           return Row(
-              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-              children: [
-                Flexible(child: Text(label, style: textStyle)),
-                Row(
-                  children: [
-                    Text(
-                      options[selectedIndex],
-                      style: labelStyle,
-                    ),
-                    CakeImageWidget(imageUrl:
-                      "assets/new-ui/chooser.svg",
-                      colorFilter:
-                          ColorFilter.mode(theme.colorScheme.onSurfaceVariant, BlendMode.srcIn),
-                    ),
-                    SizedBox(width: 8)
-                  ],
-                ),
-              ],
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: [
+              Flexible(child: Text(label, style: textStyle)),
+              Row(
+                spacing: 8,
+                children: [
+                  Text(
+                    options[selectedIndex],
+                    style: labelStyle,
+                  ),
+                  CakeImageWidget(imageUrl:
+                  "assets/new-ui/chooser.svg",
+                    colorFilter:
+                    ColorFilter.mode(theme.colorScheme.onSurfaceVariant, BlendMode.srcIn),
+                  ),
+                ],
+              ),
+            ],
             );
         });
   }
-}
+}

lib/src/widgets/standard_list.dart

@@ -6,12 +6,14 @@ class StandardListRow extends StatelessWidget {
   StandardListRow({
     required this.title,
     required this.isSelected,
+    this.subtitle,
     this.onTap,
     this.decoration,
     super.key,
   });
 
   final String title;
+  final String? subtitle;
   final bool isSelected;
   final void Function(BuildContext context)? onTap;
   final Decoration? decoration;
@@ -48,18 +50,52 @@ class StandardListRow extends StatelessWidget {
   Widget? buildLeading(BuildContext context) => null;
 
   Widget buildCenter(BuildContext context, {required bool hasLeftOffset}) {
+
     return Expanded(
       child: Row(
         mainAxisAlignment: MainAxisAlignment.start,
         children: [
           if (hasLeftOffset) SizedBox(width: 10),
           Expanded(
-            child: Text(
-              title,
-              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
-                    color: titleColor(context),
-                    fontWeight: isSelected ? FontWeight.w800 : FontWeight.w400,
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                if (subtitle != null && subtitle!.isNotEmpty)
+                  Align(
+                    alignment: Alignment.centerLeft,
+                    child: Text(
+                      textAlign: TextAlign.left,
+                      subtitle!,
+                      style: Theme.of(context).textTheme.labelMedium?.copyWith(
+                            color: titleColor(context),
+                            fontWeight: isSelected ? FontWeight.w800 : FontWeight.w400,
+                          ),
+                    ),
                   ),
+                if (subtitle != null && subtitle!.isNotEmpty)
+                  Align(
+                    alignment: Alignment.centerLeft,
+                    child: Text(
+                      textAlign: TextAlign.left,
+                      title,
+                      style: Theme.of(context).textTheme.labelSmall?.copyWith(
+                            color: Theme.of(context).colorScheme.onSurfaceVariant,
+                            fontWeight: isSelected ? FontWeight.w800 : FontWeight.w400,
+                          ),
+                    ),
+                  )
+               else
+                Align(
+                  alignment: Alignment.centerLeft,
+                  child: Text(
+                    title,
+                    style: Theme.of(context).textTheme.bodyMedium?.copyWith(
+                      color: titleColor(context),
+                      fontWeight: isSelected ? FontWeight.w800 : FontWeight.w400,
+                    ),
+                  ),
+                ),
+              ],
             ),
           )
         ],
@@ -138,6 +174,7 @@ class SectionStandardList extends StatelessWidget {
     this.hasTopSeparator = false,
     this.scrollController,
     this.physics,
+    this.shrinkWrap = false,
   }) : totalRows = [];
 
   final int sectionCount;
@@ -150,6 +187,7 @@ class SectionStandardList extends StatelessWidget {
   final EdgeInsets dividerPadding;
   final ScrollController? scrollController;
   final ScrollPhysics? physics;
+  final bool shrinkWrap;
 
   List<Widget> transform(
       bool hasTopSeparator,
@@ -208,6 +246,7 @@ class SectionStandardList extends StatelessWidget {
     return ListView.separated(
       controller: scrollController,
       physics: physics,
+      shrinkWrap: shrinkWrap,
       separatorBuilder: (_, index) {
         final row = totalRows[index];