Make default background color grey to make buttons/inputs/containers …

…standout

lib/themes.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:nowu/assets/constants.dart';
+import 'package:nowu/ui/common/app_colors.dart';
 
 // TODO This apply doesn't seem to work
 final baseTextTheme =
@@ -117,6 +118,7 @@ final regularColorScheme = ColorScheme(
 );
 
 final regularTheme = ThemeData(
+  scaffoldBackgroundColor: greyLight1,
   primaryColor: CustomColors.brandColor,
   fontFamily: fontFamily,
   colorScheme: regularColorScheme,
@@ -146,7 +148,7 @@ final regularTheme = ThemeData(
   ),
   inputDecorationTheme: InputDecorationTheme(
     filled: true,
-    fillColor: const Color.fromRGBO(221, 221, 221, 0.2),
+    fillColor: Colors.white,
     contentPadding: const EdgeInsets.symmetric(vertical: 15.0, horizontal: 15),
     border: const OutlineInputBorder(),
     focusedBorder: UnderlineInputBorder(

lib/ui/views/login/components/social_media_buttons.dart

@@ -14,7 +14,7 @@ class SocialMediaLoginButtons extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) => Row(
-        mainAxisAlignment: MainAxisAlignment.spaceAround,
+        mainAxisSize: MainAxisSize.max,
         children: [
           !kIsWeb && Platform.isIOS
               ? _SocialMediaLoginButton(
@@ -27,6 +27,7 @@ class SocialMediaLoginButtons extends StatelessWidget {
                       _loginBloc.onLoginWithOAuth(AuthProvider.Facebook),
                   iconData: FontAwesomeIcons.facebookF,
                 ),
+          const SizedBox(width: 10),
           _SocialMediaLoginButton(
             onPressed: () => _loginBloc.onLoginWithOAuth(AuthProvider.Google),
             iconData: FontAwesomeIcons.google,
@@ -47,13 +48,14 @@ class _SocialMediaLoginButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return TextButton(
-      onPressed: onPressed,
-      child: Icon(iconData, color: Colors.orange),
-      style: ButtonStyle(
-        backgroundColor: WidgetStateProperty.all(Colors.white),
-        padding: const WidgetStatePropertyAll(
-          EdgeInsets.symmetric(vertical: 15, horizontal: 60),
+    return Expanded(
+      child: FilledButton(
+        onPressed: onPressed,
+        child: Icon(iconData, color: Colors.orange, size: 32),
+        style: ButtonStyle(
+          padding:
+              WidgetStateProperty.all(const EdgeInsets.symmetric(vertical: 20)),
+          backgroundColor: WidgetStateProperty.all(Colors.white),
         ),
       ),
     );