Skip to content

Add feature: improved-readability #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Add feature: improved-readability #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions firebase-dart-admin-auth-sample-app/lib/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
# Larger font sizes and high contrast for improved readability

## Overview
Changes to the screens of the main app have been updated to have higher contrast and larger font sizes to improve readability for the users

## Installations
No additional setup is required. These are updates to only the visuals of the screens.

## Usage
run the basic sample app to see the changes
118 changes: 78 additions & 40 deletions firebase-dart-admin-auth-sample-app/lib/screens/home_screen/home_screen.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,52 +5,90 @@ import 'package:flutter/material.dart';
class HomeScreen extends StatelessWidget {
const HomeScreen({super.key});

@override
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text(
'Test App',
),
),
body: SingleChildScrollView(
padding: 20.horizontal,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
ActionTile(
onTap: () {},
title: "Verify Before Update Email",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Update Profile",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Update Password",
appBar: PreferredSize(
preferredSize: const Size.fromHeight(60), // Increased height
child: AppBar(
backgroundColor: const Color(0xFF6A0DAD), // Matches gradient start color
elevation: 0, // Flat app bar
centerTitle: true,
foregroundColor: Colors.white, // Centered title
title: const Text(
'Test App',
style: TextStyle(
fontSize: 24, // Larger font size
fontWeight: FontWeight.bold, // Bold text
color: Colors.white,
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Send Verification Email",
),
bottom: PreferredSize(
preferredSize: const Size.fromHeight(1), // Divider thickness
child: Container(
color: Colors.white.withOpacity(0.5), // Divider color
height: 1,
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Send Password Reset Email",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Sign Out",
),
),
),
body: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xFF6A0DAD), Color(0xFF4B0082)], // Purple gradient
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
child: SafeArea(
child: SingleChildScrollView(
physics: const BouncingScrollPhysics(), // Smooth scrolling
child: ConstrainedBox(
constraints: BoxConstraints(
minHeight: MediaQuery.of(context).size.height, // Full page height
),
child: Padding(
padding: const EdgeInsets.all(20), // Consistent padding
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
ActionTile(
onTap: () {},
title: "Verify Before Update Email",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Update Profile",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Update Password",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Send Verification Email",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Send Password Reset Email",
),
10.vSpace,
ActionTile(
onTap: () {},
title: "Sign Out",
),
10.vSpace,
],
),
),
),
10.vSpace,
],
),
),
),
);
}
}
}
28 changes: 22 additions & 6 deletions ...creens/sign_in_with_email_and_password_screen/sign_in_with_email_and_password_screen.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,18 @@ class _SignInWithEmailAndPasswordScreenState
create: (context) => SignInWithEmailAndPasswordViewModel(),
child: Consumer<SignInWithEmailAndPasswordViewModel>(
builder: (context, value, child) => Scaffold(
body: Center(
child: SingleChildScrollView(
padding: 20.horizontal,
body: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xFF6A0DAD), Color(0xFF4B0082)], // Purple gradient
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
child: SafeArea(
child: Center(
child: SingleChildScrollView(
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.center,
Expand Down Expand Up @@ -72,14 +81,21 @@ class _SignInWithEmailAndPasswordScreenState
child: const Text(
'Explore more sign in options',
textAlign: TextAlign.end,
),
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Colors.yellowAccent,
),
),
),
],
),
],
),
),
),
),
),
),
);
}
}
}
68 changes: 42 additions & 26 deletions ...sample-app/lib/screens/sign_in_with_email_link_screen/sign_in_with_email_link_screen.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,35 +22,51 @@ class _SignInWithEmailLinkScreenState extends State<SignInWithEmailLinkScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: SingleChildScrollView(
padding: 20.horizontal,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
InputField(
controller: _emailLinkController,
label: 'Email Link',
hint: '',
),
20.vSpace,
Button(
onTap: () {},
title: 'Sign In',
),
20.vSpace,
GestureDetector(
onTap: () => showSignMethodsBottomSheet(context),
child: const Text(
'Explore more sign in options',
textAlign: TextAlign.end,
),
body: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xFF6A0DAD), Color(0xFF4B0082)], // Purple gradient
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
child: SafeArea(
child: Center(
child: SingleChildScrollView(
padding: const EdgeInsets.all(20), // Consistent padding
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
InputField(
controller: _emailLinkController,
label: 'Email Link',
hint: '',
),
20.vSpace,
Button(
onTap: () {},
title: 'Sign In',
),
20.vSpace,
GestureDetector(
onTap: () => showSignMethodsBottomSheet(context),
child: const Text(
'Explore more sign in options',
textAlign: TextAlign.end,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Colors.yellowAccent, // Highlighted link color
),
),
),
],
),
],
),
),
),
),
);
}
}
}
70 changes: 43 additions & 27 deletions ...le-app/lib/screens/sign_in_with_phone_number_screen/sign_in_with_phone_number_screen.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,36 +23,52 @@ class _SignInWithPhoneNumberScreenState
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: SingleChildScrollView(
padding: 20.horizontal,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
InputField(
controller: _phonenumberController,
label: 'Phone number',
hint: '123456789',
textInputType: TextInputType.phone,
),
20.vSpace,
Button(
onTap: () {},
title: 'Sign In',
),
20.vSpace,
GestureDetector(
onTap: () => showSignMethodsBottomSheet(context),
child: const Text(
'Explore more sign in options',
textAlign: TextAlign.end,
),
body: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xFF6A0DAD), Color(0xFF4B0082)], // Purple gradient
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
child: SafeArea(
child: Center(
child: SingleChildScrollView(
padding: 20.horizontal,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
InputField(
controller: _phonenumberController,
label: 'Phone number',
hint: '123456789',
textInputType: TextInputType.phone,
),
20.vSpace,
Button(
onTap: () {},
title: 'Sign In',
),
20.vSpace,
GestureDetector(
onTap: () => showSignMethodsBottomSheet(context),
child: const Text(
'Explore more sign in options',
textAlign: TextAlign.end,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Colors.yellowAccent, // Highlighted link color
),
),
),
],
),
],
),
),
),
),
);
}
}
}
Loading