[pve-devel] [PATCH pve_flutter_frontend v2] ui: replace use of `background` property

* [pve-devel] [PATCH pve_flutter_frontend v2] ui: replace use of `background` property
@ 2025-05-05 12:03 Shan Shaji
  2025-05-07  7:50 ` [pve-devel] applied: " Thomas Lamprecht
  0 siblings, 1 reply; 2+ messages in thread
From: Shan Shaji @ 2025-05-05 12:03 UTC (permalink / raw)
  To: pve-devel; +Cc: Shan Shaji

As of flutter v3.22 the `background` property is
deprecated. The material guidelines suggest
using the surface color for backgrounds.

https://m3.material.io/styles/color/roles#8562cf18-5cc0-44ae-b783-2e38bdb39585

Due to the difference between the current background color and surface
color, this patch assigns the colors `supportGreyTint75`(light theme)
and `grey`(dark theme) to the `surfaceContainer` property,
replacing all instances of `background` with `surfaceContainer`.

Signed-off-by: Shan Shaji <s.shaji@proxmox.com>
---

changes since v1:
* fixed commit message line length

 lib/main.dart                                      | 4 ++--
 lib/widgets/pve_lxc_overview.dart                  | 2 +-
 lib/widgets/pve_node_overview.dart                 | 3 +--
 lib/widgets/pve_qemu_overview.dart                 | 3 ++-
 lib/widgets/pve_task_log_expansiontile_widget.dart | 2 +-
 5 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/lib/main.dart b/lib/main.dart
index a985e3a..d966a17 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -108,7 +108,7 @@ class MyApp extends StatelessWidget {
             secondaryContainer: ProxmoxColors.supportLightOrange,
             surface: ProxmoxColors.supportGreyTint50,
             onSurface: Colors.black,
-            background: ProxmoxColors.supportGreyTint75,
+            surfaceContainer: ProxmoxColors.supportGreyTint75,
             onBackground: Colors.black,
           ),
           indicatorColor: ProxmoxColors.orange,
@@ -147,7 +147,7 @@ class MyApp extends StatelessWidget {
             onSurface: Colors.white,
             secondary: ProxmoxColors.orange,
             secondaryContainer: ProxmoxColors.supportLightOrange,
-            background: ProxmoxColors.grey,
+            surfaceContainer: ProxmoxColors.grey,
             onBackground: ProxmoxColors.supportGreyTint75,
           ),
           indicatorColor: ProxmoxColors.orange,
diff --git a/lib/widgets/pve_lxc_overview.dart b/lib/widgets/pve_lxc_overview.dart
index 3c6808d..e8e6edb 100644
--- a/lib/widgets/pve_lxc_overview.dart
+++ b/lib/widgets/pve_lxc_overview.dart
@@ -76,7 +76,7 @@ class PveLxcOverview extends StatelessWidget {
                   elevation: 0,
                   title: Text(config?.hostname ?? 'CT $guestID'),
                 ),
-                backgroundColor: Theme.of(context).colorScheme.background,
+                backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
                 body: SingleChildScrollView(
                   child: Column(
                     children: <Widget>[
diff --git a/lib/widgets/pve_node_overview.dart b/lib/widgets/pve_node_overview.dart
index 23f0edc..179f6b7 100644
--- a/lib/widgets/pve_node_overview.dart
+++ b/lib/widgets/pve_node_overview.dart
@@ -63,8 +63,7 @@ class PveNodeOverview extends StatelessWidget {
                 overflow: TextOverflow.ellipsis,
               ),
             ),
-            //backgroundColor: Theme.of(context).colorScheme.primary,
-            backgroundColor: Theme.of(context).colorScheme.background,
+            backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
             body: SingleChildScrollView(
               child: Column(
                 children: <Widget>[
diff --git a/lib/widgets/pve_qemu_overview.dart b/lib/widgets/pve_qemu_overview.dart
index ac16d26..b019b0f 100644
--- a/lib/widgets/pve_qemu_overview.dart
+++ b/lib/widgets/pve_qemu_overview.dart
@@ -78,7 +78,8 @@ class PveQemuOverview extends StatelessWidget {
                     elevation: 0,
                     title: Text(config?.name ?? 'VM $guestID'),
                   ),
-                  backgroundColor: Theme.of(context).colorScheme.background,
+                  backgroundColor:
+                      Theme.of(context).colorScheme.surfaceContainer,
                   body: SingleChildScrollView(
                       child: Column(
                     children: <Widget>[
diff --git a/lib/widgets/pve_task_log_expansiontile_widget.dart b/lib/widgets/pve_task_log_expansiontile_widget.dart
index 6491b6b..1d79c8f 100644
--- a/lib/widgets/pve_task_log_expansiontile_widget.dart
+++ b/lib/widgets/pve_task_log_expansiontile_widget.dart
@@ -64,7 +64,7 @@ class _PveTaskExpansionTileState extends State<PveTaskExpansionTile> {
         });
       },
       backgroundColor: Theme.of(context).colorScheme.surface,
-      collapsedBackgroundColor: Theme.of(context).colorScheme.background,
+      collapsedBackgroundColor: Theme.of(context).colorScheme.surfaceContainer,
       key: PageStorageKey<PveClusterTasksModel>(widget.task),
       leading: Icon(
         hasError
-- 
2.39.5



_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel


^ permalink raw reply	[flat|nested] 2+ messages in thread