Skip to content

Instantly share code, notes, and snippets.

@rayliverified
Created December 31, 2024 15:31
Show Gist options
  • Save rayliverified/2686dbdc053e7ce41f870c1d227e5a1e to your computer and use it in GitHub Desktop.
Save rayliverified/2686dbdc053e7ce41f870c1d227e5a1e to your computer and use it in GitHub Desktop.
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'MyApp Demo',
debugShowCheckedModeBanner: false,
home: Scaffold(
body: UserSignUp(),
),
);
}
}
class UserSignUp extends StatelessWidget {
const UserSignUp({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 428,
height: 1050,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Colors.white,
),
child: SizedBox(
width: double.infinity,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 428,
height: 1050,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Color(0xFFE9F0EA),
),
),
),
Positioned(
left: 37,
top: 726,
child: Container(
width: 350,
height: 51,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(
width: 2,
color: const Color(0xFF2A8132),
),
borderRadius: BorderRadius.circular(30),
),
),
),
Positioned(
left: 68,
top: 608,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2F1d323f6f-5e90-4c02-8f26-843b12a8b7a6.png',
width: 19,
height: 13,
fit: BoxFit.contain,
),
),
Positioned(
left: 68,
top: 543,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Fe69cbfd9-e751-42a9-b60c-8dfc89a19367.png',
width: 19,
height: 13,
fit: BoxFit.contain,
),
),
Positioned(
left: 251,
top: 603,
child: Text(
'تأكيد كلمة المرور',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
),
),
),
Positioned(
left: 38,
top: 588,
child: Container(
width: 350,
height: 51,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(
width: 2,
color: const Color(0xFF2A8132),
),
borderRadius: BorderRadius.circular(30),
),
),
),
Positioned(
left: 49,
top: 273,
child: SizedBox(
width: 158,
height: 25,
child: Text(
'إنشاء حساب جديد',
style: GoogleFonts.getFont(
'Almarai',
color: Colors.black,
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 45,
top: 302,
child: ClipRRect(
borderRadius: BorderRadius.circular(5),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Fbbb118a1-5fb9-402d-91dd-adac578cb4b6.png',
width: 169,
height: 2,
fit: BoxFit.contain,
),
),
),
Positioned(
left: 263,
top: 284,
child: SizedBox(
height: 20,
child: Text(
'تَسجيل الدخول',
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 37,
top: 332,
child: ClipRRect(
borderRadius: BorderRadius.circular(30),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Fa5832422-8e1a-4fda-a6c2-9afe6a390bbe.png',
width: 350,
height: 50,
fit: BoxFit.contain,
),
),
),
Positioned(
left: 37,
top: 397,
child: Container(
width: 350,
height: 49,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(
width: 2,
color: const Color(0xFF2A8132),
),
borderRadius: BorderRadius.circular(30),
),
),
),
Positioned(
left: 37,
top: 460,
child: Container(
width: 350,
height: 51,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(
width: 2,
color: const Color(0xFF2A8132),
),
borderRadius: BorderRadius.circular(30),
),
),
),
Positioned(
left: 38,
top: 522,
child: Container(
width: 350,
height: 51,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(
width: 2,
color: const Color(0xFF2A8132),
),
borderRadius: BorderRadius.circular(30),
),
),
),
Positioned(
left: 252,
top: 348,
child: Text(
'إسم المستخدم',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
),
),
),
Positioned(
left: 250,
top: 409,
child: Text(
'البريد الإلكتروني',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
),
),
),
Positioned(
left: 238,
top: 472,
child: Text(
'ادخل تاريخ الميلاد',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
),
),
),
Positioned(
left: 252,
top: 538,
child: Text(
'أختر كلمة المرور',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
),
),
),
Positioned(
left: 242,
top: 678,
child: Container(
width: 32,
height: 33,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF2A8132),
borderRadius: BorderRadius.circular(48),
),
),
),
Positioned(
left: 250,
top: 686,
child: Container(
width: 16,
height: 17,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(48),
),
),
),
Positioned(
left: 150,
top: 681,
child: Container(
width: 28,
height: 28,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(
width: 4,
color: const Color(0xFF49454E),
),
borderRadius: BorderRadius.circular(48),
),
),
),
Positioned(
left: 227,
top: 653,
child: Container(
width: 55,
height: 12,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 3,
top: -1,
child: SizedBox(
width: 57,
height: 14,
child: Text(
'ذكر',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF2F2E41),
fontSize: 14,
fontWeight: FontWeight.bold,
),
),
),
)
],
),
),
),
Positioned(
left: 136,
top: 655,
child: SizedBox(
width: 57,
height: 14,
child: Text(
'أُنثى',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF2F2E41),
fontSize: 14,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 296,
top: 682,
child: Container(
width: 55,
height: 12,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
),
),
),
Positioned(
left: 312,
top: 673,
child: SizedBox(
width: 58,
height: 14,
child: Text(
'النوع',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF2F2E41),
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 63,
top: 473,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Fa18eebd2-901b-4b5c-a980-c49d92c1b898.png',
width: 27,
height: 27,
fit: BoxFit.contain,
),
),
Positioned(
left: 57,
top: 743,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkZBkmF_lKAtrcXmXF2%2Ff38c079b2f4e4f6f78a97c55aac72adc00557553image%203.png?alt=media&token=027dd654-0e82-41cf-9ae2-08c1f8e2da00',
width: 16,
height: 16,
fit: BoxFit.cover,
),
),
Positioned(
left: 79,
top: 748,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Ff657a3c9-c35b-4fc9-8b79-4be362fb81c6.png',
width: 12,
height: 7,
fit: BoxFit.contain,
),
),
Positioned(
left: 97,
top: 746,
child: Text(
'+966',
style: GoogleFonts.getFont(
'Open Sans',
color: const Color(0xFF101010),
fontSize: 16,
height: 1.4,
),
),
),
Positioned(
left: 142,
top: 741,
child: Text(
'رقم الهاتف',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0x6B000000),
fontSize: 16,
),
),
),
Positioned(
left: 134,
top: 78,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkZBkmF_lKAtrcXmXF2%2Fbd1b913b4d97a6fcc837a15022dc4de7e8684c49NMU_Logo%202.png?alt=media&token=4dc9168e-bd63-40af-bafd-b59fb8719379',
width: 162,
height: 166,
fit: BoxFit.cover,
),
),
Positioned(
left: 0,
top: 0,
child: Container(
width: 428,
height: 42,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Color(0xFF525452),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 22,
top: 13,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2F191cd26e-0a12-42b2-a3bb-184ebfd2d8a2.png',
width: 383,
height: 15,
fit: BoxFit.contain,
),
)
],
),
),
),
Positioned(
left: 66,
top: 807,
child: ClipRRect(
borderRadius: BorderRadius.circular(1000),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2F14f7d4e2-11a4-4554-9a9a-ddb0e02fb459.png',
width: 281,
height: 51,
fit: BoxFit.contain,
),
),
),
Positioned(
left: 140,
top: 816,
child: SizedBox(
width: 137,
height: 32,
child: Text(
'التَسجيل',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Almarai',
color: Colors.white,
fontSize: 24,
fontWeight: FontWeight.w800,
),
),
),
),
Positioned(
left: 66,
top: 1002,
child: RichText(
textAlign: TextAlign.right,
text: TextSpan(
style: GoogleFonts.getFont(
'Almarai',
color: Colors.black,
fontSize: 12,
),
children: [
const TextSpan(text: 'بالتسجيل، أنت توافق على'),
const TextSpan(
text: ' ',
style: TextStyle(
color: Colors.white,
),
),
TextSpan(
text: 'الشروط والأحكام الخاصة بنا\n',
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF2A8132),
fontWeight: FontWeight.bold,
decoration: TextDecoration.underline,
),
)
],
),
),
),
Positioned(
left: 107,
top: 976,
child: SizedBox(
width: 184,
height: 26,
child: RichText(
textAlign: TextAlign.right,
text: TextSpan(
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF2F2E41),
fontSize: 12,
),
children: [
const TextSpan(text: 'لديك حساب بالفعل؟ '),
TextSpan(
text: 'سجل الدخول!\n',
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF2A8132),
fontWeight: FontWeight.bold,
decoration: TextDecoration.underline,
),
)
],
),
),
),
),
Positioned(
left: 124,
top: 903,
child: SizedBox.square(
dimension: 49,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 49,
height: 49,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0x1EEFEFEF),
borderRadius: BorderRadius.circular(25),
),
),
),
Positioned(
left: 10,
top: 10,
child: Container(
width: 28,
height: 29,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Ff00c0e37-6881-4593-9377-91da4fefe5a9.png',
width: 28,
height: 29,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 191,
top: 903,
child: Container(
width: 49,
height: 49,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0x1EEFEFEF),
borderRadius: BorderRadius.circular(25),
),
),
),
Positioned(
left: 201,
top: 913,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2F8ef66f97-6bc4-4483-b639-4dcde13df1ae.png',
width: 28,
height: 28,
fit: BoxFit.contain,
),
),
Positioned(
left: 40,
top: 888,
child: Container(
width: 107,
height: 3,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Color(0xFF2A8132),
),
),
),
Positioned(
left: 281,
top: 888,
child: Container(
width: 107,
height: 3,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Color(0xFF2A8132),
),
),
),
Positioned(
left: 148,
top: 877,
child: SizedBox(
width: 131,
height: 21,
child: Text(
'أو يمكنك الدخول عبر',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Almarai',
color: const Color(0xFF1B5A2F),
fontSize: 14,
letterSpacing: -0.3,
),
),
),
),
Positioned(
left: 257,
top: 903,
child: SizedBox.square(
dimension: 49,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: Container(
width: 49,
height: 49,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0x1EEFEFEF),
borderRadius: BorderRadius.circular(25),
),
),
),
Positioned(
left: 13,
top: 10,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Fb59cc7fd-57fe-44a8-8f87-6985535b775f.png',
width: 24,
height: 28,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment