fix: login screen not using safearea and no dialog bg-color found on …

…light mode in AdaptivePopupMenuButton
KRTirtho · Aug 7, 2022 · 92bc611 · 92bc611
1 parent 615d5ce
commit 92bc611
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 48 deletions.
diff --git a/lib/components/Login/Login.dart b/lib/components/Login/Login.dart
@@ -2,8 +2,6 @@ import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:spotube/components/Login/LoginForm.dart';
-import 'package:spotube/components/Shared/Hyperlink.dart';
-import 'package:spotube/components/Shared/LinkText.dart';
 import 'package:spotube/components/Shared/PageWindowTitleBar.dart';
 import 'package:spotube/hooks/useBreakpoints.dart';
 import 'package:spotube/models/Logger.dart';
@@ -18,48 +16,50 @@ class Login extends HookConsumerWidget {
 
     final textTheme = Theme.of(context).textTheme;
 
-    return Scaffold(
-      appBar: const PageWindowTitleBar(leading: BackButton()),
-      body: SingleChildScrollView(
-        child: Center(
-          child: Container(
-            margin: const EdgeInsets.symmetric(horizontal: 10),
-            child: Column(
-              children: [
-                Image.asset(
-                  "assets/spotube-logo.png",
-                  width: MediaQuery.of(context).size.width *
-                      (breakpoint <= Breakpoints.md ? .5 : .3),
-                ),
-                Text("Add your spotify credentials to get started",
-                    style: breakpoint <= Breakpoints.md
-                        ? textTheme.headline5
-                        : textTheme.headline4),
-                Text(
-                  "Don't worry, any of your credentials won't be collected or shared with anyone",
-                  style: Theme.of(context).textTheme.caption,
-                ),
-                const SizedBox(height: 10),
-                LoginForm(
-                  onDone: () => GoRouter.of(context).pop(),
-                ),
-                const SizedBox(height: 10),
-                Wrap(
-                  alignment: WrapAlignment.center,
-                  crossAxisAlignment: WrapCrossAlignment.center,
-                  children: [
-                    const Text("Don't know how to do this?"),
-                    TextButton(
-                      child: const Text(
-                        "Follow along the Step by Step guide",
+    return SafeArea(
+      child: Scaffold(
+        appBar: const PageWindowTitleBar(leading: BackButton()),
+        body: SingleChildScrollView(
+          child: Center(
+            child: Container(
+              margin: const EdgeInsets.symmetric(horizontal: 10),
+              child: Column(
+                children: [
+                  Image.asset(
+                    "assets/spotube-logo.png",
+                    width: MediaQuery.of(context).size.width *
+                        (breakpoint <= Breakpoints.md ? .5 : .3),
+                  ),
+                  Text("Add your spotify credentials to get started",
+                      style: breakpoint <= Breakpoints.md
+                          ? textTheme.headline5
+                          : textTheme.headline4),
+                  Text(
+                    "Don't worry, any of your credentials won't be collected or shared with anyone",
+                    style: Theme.of(context).textTheme.caption,
+                  ),
+                  const SizedBox(height: 10),
+                  LoginForm(
+                    onDone: () => GoRouter.of(context).pop(),
+                  ),
+                  const SizedBox(height: 10),
+                  Wrap(
+                    alignment: WrapAlignment.center,
+                    crossAxisAlignment: WrapCrossAlignment.center,
+                    children: [
+                      const Text("Don't know how to do this?"),
+                      TextButton(
+                        child: const Text(
+                          "Follow along the Step by Step guide",
+                        ),
+                        onPressed: () => GoRouter.of(context).push(
+                          "/login-tutorial",
+                        ),
                       ),
-                      onPressed: () => GoRouter.of(context).push(
-                        "/login-tutorial",
-                      ),
-                    ),
-                  ],
-                ),
-              ],
+                    ],
+                  ),
+                ],
+              ),
             ),
           ),
         ),

diff --git a/lib/components/Settings/Settings.dart b/lib/components/Settings/Settings.dart
@@ -213,10 +213,17 @@ class Settings extends HookConsumerWidget {
                       ),
                     ),
                     if (auth.isAnonymous)
-                      ListTile(
-                        leading: const Icon(Icons.login_rounded),
-                        title: const Text("Login with your Spotify account"),
-                        horizontalTitleGap: 10,
+                      AdaptiveListTile(
+                        leading: Icon(
+                          Icons.login_rounded,
+                          color: Theme.of(context).primaryColor,
+                        ),
+                        title: Text(
+                          "Login with your Spotify account",
+                          style: TextStyle(
+                            color: Theme.of(context).primaryColor,
+                          ),
+                        ),
                         trailing: ElevatedButton(
                           child: Text("Connect with Spotify".toUpperCase()),
                           onPressed: () {

diff --git a/lib/components/Shared/AdaptivePopupMenuButton.dart b/lib/components/Shared/AdaptivePopupMenuButton.dart
@@ -83,7 +83,7 @@ class AdaptiveActions extends HookWidget {
                     .toList(),
               );
             },
-            backgroundColor: Theme.of(context).dialogTheme.backgroundColor!,
+            backgroundColor: Theme.of(context).cardColor,
           );
         },
       );