sBubshait/wesal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Navigation bar a bit higher for better rendering on IOS

Browse Source
This commit is contained in:
sBubshait 2025-08-03 10:45:27 +03:00
parent 325eec7c8f
commit 8295e5bf03
3 changed files with 346 additions and 326 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

618
frontend/lib/main.dart
View File

@ -54,15 +54,13 @@ class _SplashScreenState extends State<SplashScreen> {
final userResult = await UserService.getCurrentUser(); final userResult = await UserService.getCurrentUser();
if (userResult['success'] == true) { if (userResult['success'] == true) {
final userData = userResult['data']; final userData = userResult['data'];
// Check if user needs onboarding (activated = 0) // Check if user needs onboarding (activated = 0)
if (userData['activated'] == 0) { if (userData['activated'] == 0) {
Navigator.of(context).pushReplacement( Navigator.of(context).pushReplacement(
MaterialPageRoute( MaterialPageRoute(
builder: (context) => EditProfileScreen( builder: (context) =>
userData: userData, EditProfileScreen(userData: userData, isOnboarding: true),
isOnboarding: true,
),
), ),
); );
} else { } else {
@ -146,110 +144,110 @@ class _LandingPageState extends State<LandingPage> {
return PopScope( return PopScope(
canPop: false, // Prevent back navigation from landing page canPop: false, // Prevent back navigation from landing page
child: Scaffold( child: Scaffold(
body: Stack( body: Stack(
children: [ children: [
// Background gradient // Background gradient
Container( Container(
decoration: BoxDecoration( decoration: BoxDecoration(
gradient: LinearGradient( gradient: LinearGradient(
begin: Alignment.topCenter, begin: Alignment.topCenter,
end: Alignment.bottomCenter, end: Alignment.bottomCenter,
colors: [ colors: [
Color(0xFF32B0A5), // Teal Color(0xFF32B0A5), // Teal
Color(0xFF4600B9), // Purple Color(0xFF4600B9), // Purple
], ],
stops: [0.0, 0.5], stops: [0.0, 0.5],
),
), ),
), ),
),
// Main content // Main content
SafeArea( SafeArea(
child: Column( child: Column(
children: [ children: [
Expanded( Expanded(
child: Center( child: Center(
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
// Logo // Logo
Container( Container(
padding: EdgeInsets.all(40), padding: EdgeInsets.all(40),
child: Text( child: Text(
'وصال', 'وصال',
style: TextStyle( style: TextStyle(
fontSize: 160, fontSize: 160,
fontWeight: FontWeight.w200, fontWeight: FontWeight.w200,
fontFamily: 'Blaka', fontFamily: 'Blaka',
color: Colors.white, color: Colors.white,
shadows: [ shadows: [
Shadow( Shadow(
offset: Offset(2, 2), offset: Offset(2, 2),
blurRadius: 4, blurRadius: 4,
color: Colors.black.withOpacity(0.3), color: Colors.black.withOpacity(0.3),
),
],
),
),
),
SizedBox(height: 60),
// Subtitle
Text(
'Connections, Made\nEasier!',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 32,
fontWeight: FontWeight.w600,
color: Colors.white,
height: 1.2,
),
),
SizedBox(height: 80),
// Get Started Button
Container(
width: 280,
height: 56,
child: ElevatedButton(
onPressed: _navigateDirectlyToLogin,
style: ElevatedButton.styleFrom(
backgroundColor: Color(0xFF6A4C93),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(28),
),
elevation: 8,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Get Started',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
), ),
), ],
SizedBox(width: 8), ),
Icon(Icons.arrow_forward, size: 20),
],
), ),
), ),
),
SizedBox(height: 24), SizedBox(height: 60),
],
// Subtitle
Text(
'Connections, Made\nEasier!',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 32,
fontWeight: FontWeight.w600,
color: Colors.white,
height: 1.2,
),
),
SizedBox(height: 80),
// Get Started Button
Container(
width: 280,
height: 56,
child: ElevatedButton(
onPressed: _navigateDirectlyToLogin,
style: ElevatedButton.styleFrom(
backgroundColor: Color(0xFF6A4C93),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(28),
),
elevation: 8,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Get Started',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
SizedBox(width: 8),
Icon(Icons.arrow_forward, size: 20),
],
),
),
),
SizedBox(height: 24),
],
),
), ),
), ),
), ],
], ),
), ),
), ],
], ),
),
), ),
); );
} }
@ -360,15 +358,13 @@ class _SignInPageState extends State<SignInPage> {
if (userResult['success'] == true) { if (userResult['success'] == true) {
final userData = userResult['data']; final userData = userResult['data'];
// Check if user needs onboarding (activated = 0) // Check if user needs onboarding (activated = 0)
if (userData['activated'] == 0) { if (userData['activated'] == 0) {
Navigator.of(context).pushReplacement( Navigator.of(context).pushReplacement(
MaterialPageRoute( MaterialPageRoute(
builder: (context) => EditProfileScreen( builder: (context) =>
userData: userData, EditProfileScreen(userData: userData, isOnboarding: true),
isOnboarding: true,
),
), ),
); );
} else { } else {
@ -412,247 +408,251 @@ class _SignInPageState extends State<SignInPage> {
canPop: false, // Prevent back navigation from sign in page canPop: false, // Prevent back navigation from sign in page
child: Scaffold( child: Scaffold(
body: Container( body: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
gradient: LinearGradient( gradient: LinearGradient(
begin: Alignment.topCenter, begin: Alignment.topCenter,
end: Alignment.bottomCenter, end: Alignment.bottomCenter,
colors: [Color(0xFF32B0A5), Color(0xFF4600B9)], colors: [Color(0xFF32B0A5), Color(0xFF4600B9)],
stops: [0.0, 0.5], stops: [0.0, 0.5],
),
), ),
), child: SafeArea(
child: SafeArea( child: Column(
child: Column( children: [
children: [ // App bar
// App bar Padding(
Padding( padding: EdgeInsets.all(16),
padding: EdgeInsets.all(16), child: Row(
child: Row( children: [
children: [ IconButton(
IconButton( onPressed: () => Navigator.of(context).pop(),
onPressed: () => Navigator.of(context).pop(), icon: Icon(Icons.arrow_back, color: Colors.white),
icon: Icon(Icons.arrow_back, color: Colors.white),
),
Text(
'Sign In',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w600,
color: Colors.white,
), ),
), Text(
], 'Sign In',
), style: TextStyle(
), fontSize: 20,
fontWeight: FontWeight.w600,
// Content color: Colors.white,
Expanded( ),
child: Container(
margin: EdgeInsets.all(16),
padding: EdgeInsets.all(24),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.1),
blurRadius: 20,
offset: Offset(0, 5),
), ),
], ],
), ),
child: Form( ),
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
SizedBox(height: 20),
// Logo // Content
Center( Expanded(
child: Text( child: Container(
'وصال', margin: EdgeInsets.all(16),
style: TextStyle( padding: EdgeInsets.all(24),
fontSize: 48, decoration: BoxDecoration(
fontWeight: FontWeight.w200, color: Colors.white,
fontFamily: 'Blaka', borderRadius: BorderRadius.circular(16),
color: Color(0xFF6A4C93), boxShadow: [
), BoxShadow(
), color: Colors.black.withOpacity(0.1),
blurRadius: 20,
offset: Offset(0, 5),
), ),
],
),
child: Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
SizedBox(height: 20),
SizedBox(height: 40), // Logo
Center(
// Welcome text
Text(
'Welcome Back!',
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
color: Colors.black87,
),
textAlign: TextAlign.center,
),
SizedBox(height: 8),
Text(
'Sign in to socialize with your colleagues\nand transform your social life!',
style: TextStyle(
fontSize: 16,
color: Colors.grey[600],
),
textAlign: TextAlign.center,
),
SizedBox(height: 40),
// Email field
TextFormField(
controller: _emailController,
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
labelText: 'Email',
prefixIcon: Icon(Icons.email_outlined),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: Color(0xFF6A4C93)),
),
),
validator: (value) {
if (value == null || value.isEmpty) {
return 'Please enter your email';
}
if (!value.contains('@')) {
return 'Please enter a valid email';
}
return null;
},
),
SizedBox(height: 20),
// Password field
TextFormField(
controller: _passwordController,
obscureText: !_isPasswordVisible,
decoration: InputDecoration(
labelText: 'Password',
prefixIcon: Icon(Icons.lock_outline),
suffixIcon: IconButton(
icon: Icon(
_isPasswordVisible
? Icons.visibility_off
: Icons.visibility,
),
onPressed: () {
setState(() {
_isPasswordVisible = !_isPasswordVisible;
});
},
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: Color(0xFF6A4C93)),
),
),
validator: (value) {
if (value == null || value.isEmpty) {
return 'Please enter your password';
}
if (value.length < 6) {
return 'Password must be at least 6 characters';
}
return null;
},
),
SizedBox(height: 12),
// Forgot password
Align(
alignment: Alignment.centerRight,
child: TextButton(
onPressed: _showHelpBottomSheet,
child: Text( child: Text(
'Forgot Password?', 'وصال',
style: TextStyle( style: TextStyle(
fontSize: 48,
fontWeight: FontWeight.w200,
fontFamily: 'Blaka',
color: Color(0xFF6A4C93), color: Color(0xFF6A4C93),
fontWeight: FontWeight.w600,
), ),
), ),
), ),
),
SizedBox(height: 30), SizedBox(height: 40),
// Sign in button // Welcome text
Container( Text(
height: 56, 'Welcome Back!',
child: ElevatedButton( style: TextStyle(
onPressed: _isLoading ? null : _handleSignIn, fontSize: 24,
style: ElevatedButton.styleFrom( fontWeight: FontWeight.bold,
backgroundColor: Color(0xFF6A4C93), color: Colors.black87,
foregroundColor: Colors.white, ),
shape: RoundedRectangleBorder( textAlign: TextAlign.center,
),
SizedBox(height: 8),
Text(
'Sign in to socialize with your colleagues\nand transform your social life!',
style: TextStyle(
fontSize: 16,
color: Colors.grey[600],
),
textAlign: TextAlign.center,
),
SizedBox(height: 40),
// Email field
TextFormField(
controller: _emailController,
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
labelText: 'Email',
prefixIcon: Icon(Icons.email_outlined),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
), ),
elevation: 2, focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(
color: Color(0xFF6A4C93),
),
),
), ),
child: _isLoading validator: (value) {
? CircularProgressIndicator( if (value == null || value.isEmpty) {
valueColor: AlwaysStoppedAnimation<Color>( return 'Please enter your email';
Colors.white, }
), if (!value.contains('@')) {
) return 'Please enter a valid email';
: Text( }
'Sign In', return null;
style: TextStyle( },
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
), ),
),
SizedBox(height: 20), SizedBox(height: 20),
// Contact link for new accounts // Password field
Row( TextFormField(
mainAxisAlignment: MainAxisAlignment.center, controller: _passwordController,
children: [ obscureText: !_isPasswordVisible,
Text( decoration: InputDecoration(
"Don't have an account? ", labelText: 'Password',
style: TextStyle(color: Colors.grey[600]), prefixIcon: Icon(Icons.lock_outline),
suffixIcon: IconButton(
icon: Icon(
_isPasswordVisible
? Icons.visibility_off
: Icons.visibility,
),
onPressed: () {
setState(() {
_isPasswordVisible = !_isPasswordVisible;
});
},
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(
color: Color(0xFF6A4C93),
),
),
), ),
GestureDetector( validator: (value) {
onTap: _showHelpBottomSheet, if (value == null || value.isEmpty) {
return 'Please enter your password';
}
if (value.length < 6) {
return 'Password must be at least 6 characters';
}
return null;
},
),
SizedBox(height: 12),
// Forgot password
Align(
alignment: Alignment.centerRight,
child: TextButton(
onPressed: _showHelpBottomSheet,
child: Text( child: Text(
'Contact Support', 'Forgot Password?',
style: TextStyle( style: TextStyle(
color: Color(0xFF6A4C93), color: Color(0xFF6A4C93),
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),
), ),
), ),
], ),
),
Spacer(), SizedBox(height: 30),
],
// Sign in button
Container(
height: 56,
child: ElevatedButton(
onPressed: _isLoading ? null : _handleSignIn,
style: ElevatedButton.styleFrom(
backgroundColor: Color(0xFF6A4C93),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
elevation: 2,
),
child: _isLoading
? CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(
Colors.white,
),
)
: Text(
'Sign In',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
),
),
SizedBox(height: 20),
// Contact link for new accounts
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Don't have an account? ",
style: TextStyle(color: Colors.grey[600]),
),
GestureDetector(
onTap: _showHelpBottomSheet,
child: Text(
'Contact Support',
style: TextStyle(
color: Color(0xFF6A4C93),
fontWeight: FontWeight.w600,
),
),
),
],
),
Spacer(),
],
),
), ),
), ),
), ),
), ],
], ),
), ),
), ),
),
), ),
); );
} }

53
frontend/lib/screens/home_screen.dart
View File

@ -81,24 +81,43 @@ class _HomeScreenState extends State<HomeScreen> {
canPop: false, // Prevent going back to authentication screens canPop: false, // Prevent going back to authentication screens
child: Scaffold( child: Scaffold(
body: _pages[_currentIndex], body: _pages[_currentIndex],
bottomNavigationBar: BottomNavigationBar( bottomNavigationBar: Container(
currentIndex: _currentIndex, decoration: BoxDecoration(
onTap: (index) { color: Colors.white,
setState(() { boxShadow: [
_currentIndex = index; BoxShadow(
}); color: Colors.black12,
}, blurRadius: 4,
type: BottomNavigationBarType.fixed, offset: Offset(0, -2),
selectedItemColor: Color(0xFF6A4C93), ),
unselectedItemColor: Colors.grey, ],
items: [ ),
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Feed'), child: SafeArea(
BottomNavigationBarItem( child: Container(
icon: _buildInvitationsBadge(), height: 80,
label: 'Invitations', child: BottomNavigationBar(
currentIndex: _currentIndex,
onTap: (index) {
setState(() {
_currentIndex = index;
});
},
type: BottomNavigationBarType.fixed,
selectedItemColor: Color(0xFF6A4C93),
unselectedItemColor: Colors.grey,
backgroundColor: Colors.transparent,
elevation: 0,
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Feed'),
BottomNavigationBarItem(
icon: _buildInvitationsBadge(),
label: 'Invitations',
),
BottomNavigationBarItem(icon: Icon(Icons.person), label: 'Profile'),
],
),
), ),
BottomNavigationBarItem(icon: Icon(Icons.person), label: 'Profile'), ),
],
), ),
), ),
); );

1
frontend/lib/screens/pages/profile_page.dart
View File

@ -200,6 +200,7 @@ class _ProfilePageState extends State<ProfilePage> {
backgroundColor: Colors.white, backgroundColor: Colors.white,
foregroundColor: Color(0xFF6A4C93), foregroundColor: Color(0xFF6A4C93),
elevation: 0, elevation: 0,
centerTitle: true,
actions: [ actions: [
if (userData != null) if (userData != null)
IconButton( IconButton(