update theme
This commit is contained in:
Phuoc Nguyen
@@ -14,7 +14,7 @@ import 'package:go_router/go_router.dart';
|
||||
|
||||
import 'package:worker/core/constants/ui_constants.dart';
|
||||
import 'package:worker/core/router/app_router.dart';
|
||||
import 'package:worker/core/theme/colors.dart';
|
||||
import 'package:worker/core/theme/colors.dart'; // Keep for status colors and brand gradients
|
||||
|
||||
/// OTP Verification Page
|
||||
///
|
||||
@@ -237,19 +237,21 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final colorScheme = Theme.of(context).colorScheme;
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: AppColors.grey50,
|
||||
backgroundColor: colorScheme.surfaceContainerLowest,
|
||||
appBar: AppBar(
|
||||
backgroundColor: AppColors.white,
|
||||
backgroundColor: colorScheme.surface,
|
||||
elevation: AppBarSpecs.elevation,
|
||||
leading: IconButton(
|
||||
icon: const FaIcon(FontAwesomeIcons.arrowLeft, color: Colors.black, size: 20),
|
||||
icon: FaIcon(FontAwesomeIcons.arrowLeft, color: colorScheme.onSurface, size: 20),
|
||||
onPressed: () => context.pop(),
|
||||
),
|
||||
title: const Text(
|
||||
title: Text(
|
||||
'Xác thực OTP',
|
||||
style: TextStyle(
|
||||
color: Colors.black,
|
||||
color: colorScheme.onSurface,
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
@@ -276,14 +278,14 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [AppColors.primaryBlue, AppColors.lightBlue],
|
||||
colors: [AppColors.primaryBlue, AppColors.lightBlue], // Keep brand colors
|
||||
),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: const Icon(
|
||||
child: Icon(
|
||||
FontAwesomeIcons.shieldHalved,
|
||||
size: 36,
|
||||
color: AppColors.white,
|
||||
color: colorScheme.onPrimary,
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -291,24 +293,24 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
const SizedBox(height: AppSpacing.lg),
|
||||
|
||||
// Instructions
|
||||
const Text(
|
||||
Text(
|
||||
'Nhập mã xác thực',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColors.grey900,
|
||||
color: colorScheme.onSurface,
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 12),
|
||||
|
||||
const Text(
|
||||
Text(
|
||||
'Mã OTP đã được gửi đến số điện thoại',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
color: AppColors.grey500,
|
||||
color: colorScheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
|
||||
@@ -317,10 +319,10 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
Text(
|
||||
_formatPhoneNumber(widget.phoneNumber),
|
||||
textAlign: TextAlign.center,
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColors.primaryBlue,
|
||||
color: colorScheme.primary,
|
||||
),
|
||||
),
|
||||
|
||||
@@ -329,7 +331,7 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
// OTP Input Card
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.white,
|
||||
color: colorScheme.surface,
|
||||
borderRadius: BorderRadius.circular(AppRadius.card),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
@@ -351,7 +353,7 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
padding: EdgeInsets.only(
|
||||
left: index > 0 ? 8 : 0,
|
||||
),
|
||||
child: _buildOtpInput(index),
|
||||
child: _buildOtpInput(index, colorScheme),
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -365,8 +367,8 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
child: ElevatedButton(
|
||||
onPressed: _isLoading ? null : _handleVerifyOtp,
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: AppColors.primaryBlue,
|
||||
foregroundColor: AppColors.white,
|
||||
backgroundColor: colorScheme.primary,
|
||||
foregroundColor: colorScheme.onPrimary,
|
||||
elevation: 0,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(
|
||||
@@ -375,13 +377,13 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
),
|
||||
),
|
||||
child: _isLoading
|
||||
? const SizedBox(
|
||||
? SizedBox(
|
||||
height: 20,
|
||||
width: 20,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(
|
||||
AppColors.white,
|
||||
colorScheme.onPrimary,
|
||||
),
|
||||
),
|
||||
)
|
||||
@@ -405,9 +407,9 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
child: Text.rich(
|
||||
TextSpan(
|
||||
text: 'Không nhận được mã? ',
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: AppColors.grey500,
|
||||
color: colorScheme.onSurfaceVariant,
|
||||
),
|
||||
children: [
|
||||
WidgetSpan(
|
||||
@@ -421,8 +423,8 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: _countdown > 0
|
||||
? AppColors.grey500
|
||||
: AppColors.primaryBlue,
|
||||
? colorScheme.onSurfaceVariant
|
||||
: colorScheme.primary,
|
||||
decoration: _countdown == 0
|
||||
? TextDecoration.none
|
||||
: TextDecoration.none,
|
||||
@@ -445,7 +447,7 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
}
|
||||
|
||||
/// Build single OTP input box
|
||||
Widget _buildOtpInput(int index) {
|
||||
Widget _buildOtpInput(int index, ColorScheme colorScheme) {
|
||||
return SizedBox(
|
||||
width: 48,
|
||||
height: 48,
|
||||
@@ -455,10 +457,10 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
textAlign: TextAlign.center,
|
||||
keyboardType: TextInputType.number,
|
||||
maxLength: 1,
|
||||
style: const TextStyle(
|
||||
style: TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColors.grey900,
|
||||
color: colorScheme.onSurface,
|
||||
),
|
||||
inputFormatters: [
|
||||
FilteringTextInputFormatter.digitsOnly,
|
||||
@@ -468,20 +470,20 @@ class _OtpVerificationPageState extends ConsumerState<OtpVerificationPage> {
|
||||
contentPadding: EdgeInsets.zero,
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.grey100,
|
||||
borderSide: BorderSide(
|
||||
color: colorScheme.surfaceContainerHighest,
|
||||
width: 2,
|
||||
),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
borderSide: const BorderSide(
|
||||
color: AppColors.primaryBlue,
|
||||
borderSide: BorderSide(
|
||||
color: colorScheme.primary,
|
||||
width: 2,
|
||||
),
|
||||
),
|
||||
filled: false,
|
||||
fillColor: AppColors.white,
|
||||
fillColor: colorScheme.surface,
|
||||
),
|
||||
onChanged: (value) => _onOtpChanged(index, value),
|
||||
onTap: () {
|
||||
|
||||
Reference in New Issue
Block a user