Use Dart to get the safe-area-insets on Web platform.
It is recommended to add this line in index.html to prevent flickering during loading.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">Use WebSafeAreaInsets to handle safe area, See example for more detail.
Widget build(BuildContext context) {
return MaterialApp(
home: const HomePage(),
builder: (context, child) {
child ??= const SizedBox();
return kIsWeb ? WebSafeAreaInsets(child: child) : child;
},
);
}