Fix web background image (#459)

* Fixes display of background_image in web * Fixes black color in light mode
jonbhanson · Nov 27, 2022 · c44509f · c44509f
1 parent b662516
commit c44509f
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/lib/templates.dart b/lib/templates.dart
@@ -406,9 +406,13 @@ const String _iOSBrandingRightBottomConstraints = '''
 
 /// Web related templates
 const String _webCss = '''
+html {
+  height: 100%
+}
+
 body {
-  margin:0;
-  height:100%;
+  margin: 0;
+  min-height: 100%;
   background-color: [LIGHTBACKGROUNDCOLOR];
   [LIGHTBACKGROUNDIMAGE]
   background-size: 100% 100%;
@@ -465,11 +469,8 @@ const String _webCssDark = '''
 
 @media (prefers-color-scheme: dark) {
   body {
-    margin:0;
-    height:100%;
     background-color: [DARKBACKGROUNDCOLOR];
     [DARKBACKGROUNDIMAGE]
-    background-size: 100% 100%;
   }
 }
 ''';

diff --git a/lib/web.dart b/lib/web.dart
@@ -4,6 +4,7 @@ part of flutter_native_splash_cli;
 class _WebLaunchImageTemplate {
   final String fileName;
   final double pixelDensity;
+
   _WebLaunchImageTemplate({required this.fileName, required this.pixelDensity});
 }
 
@@ -171,10 +172,10 @@ void _createSplashCss({
   required bool hasDarkImage,
 }) {
   print('[Web] Creating CSS');
-  color ??= '000000';
+  color ??= 'ffffff';
   var cssContent = _webCss.replaceFirst('[LIGHTBACKGROUNDCOLOR]', '#$color');
   if (darkColor != null || darkBackgroundImage != null || hasDarkImage) {
-    darkColor ??= color;
+    darkColor ??= '000000';
     cssContent +=
         _webCssDark.replaceFirst('[DARKBACKGROUNDCOLOR]', '#$darkColor');
   }