Skip to content

Instantly share code, notes, and snippets.

@rayliverified

rayliverified/0RkkScLJf5CVZx0vikOa.dart

Created December 30, 2024 02:47
Show Gist options
  • Save rayliverified/4a411e5b64ae6886834fb80cbc1a7653 to your computer and use it in GitHub Desktop.
Save rayliverified/4a411e5b64ae6886834fb80cbc1a7653 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
0RkkScLJf5CVZx0vikOa.dart
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'dart:math';
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: LoginHeader(),
),
);
}
}
class LoginHeader extends StatelessWidget {
const LoginHeader({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 213,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: SizedBox(
width: 361,
child: Text(
'Login to your Account',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Lato',
color: const Color(0xFF333333),
fontSize: 21,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 0,
top: 49,
child: SizedBox(
width: 358,
height: 164,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 90,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class PlaceholderInput extends StatelessWidget {
const PlaceholderInput({super.key});
@override
Widget build(BuildContext context) {
return const SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
);
}
}
class LoginContant extends StatelessWidget {
const LoginContant({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 459,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 315,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 243,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 213,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: SizedBox(
width: 361,
child: Text(
'Login to your Account',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Lato',
color: const Color(0xFF333333),
fontSize: 21,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 0,
top: 49,
child: SizedBox(
width: 358,
height: 164,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style:
TextStyle(
color: Color(
0xFF333333),
fontSize:
16,
height:
1.5,
fontFamily:
'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration:
BoxDecoration(
border:
Border.all(
color: const Color(
0xFFE6E6E9),
),
borderRadius:
BorderRadius
.circular(
15),
),
child:
const Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child:
SizedBox(
width:
328,
child:
Text(
'[email protected]',
style:
TextStyle(
color:
Color(0xFF74747A),
fontSize:
16,
height:
1.5,
fontFamily:
'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 90,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style:
TextStyle(
color: Color(
0xFF333333),
fontSize:
16,
height:
1.5,
fontFamily:
'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration:
BoxDecoration(
border:
Border.all(
color: const Color(
0xFFE6E6E9),
),
borderRadius:
BorderRadius
.circular(
15),
),
child: Stack(
clipBehavior:
Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child:
SizedBox(
width:
294,
child:
Text(
'*******',
style:
TextStyle(
color:
Color(0xFF75757B),
fontSize:
16,
height:
1.5,
fontFamily:
'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child:
Container(
width: 24,
height:
24,
clipBehavior:
Clip.hardEdge,
decoration:
const BoxDecoration(),
child:
Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left:
2,
top:
5,
child:
Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 246,
top: 221,
child: Container(
width: 112,
height: 22,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Forgot password?',
style: TextStyle(
color: Color(0xFF66666E),
fontSize: 14,
height: 1.6,
decoration: TextDecoration.underline,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 267,
child: Container(
width: 358,
height: 48,
decoration: BoxDecoration(
color: const Color(0xFF7F00FF),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 153,
top: 10,
child: Text(
'Log in',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
height: 1.4,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 14,
top: 339,
child: SizedBox(
width: 330,
height: 120,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 80,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
),
const Positioned(
left: 115,
top: -1,
child: Text(
'OR log in with',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
Positioned(
left: 230,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
)
],
),
),
),
Positioned(
left: 87,
top: 36,
child: SizedBox(
width: 156,
height: 44,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2F000b5be92956113a6aca2b881f90c6d00a01c9c0google.png?alt=media&token=f362c9ea-2c0d-4621-ad53-b414f58a9f73',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 56,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fdabc2b816bb02bd2c6456ba37a32984ef44f7893apple.png?alt=media&token=b525d672-05fa-4633-9cfc-b0ee5de0605d',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 112,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fc2e3b2c674d9d4c3192a768e38e4b944c32be2f2facebook.png?alt=media&token=12b1d16d-d837-4c42-8a73-1b04549d7313',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 53,
top: 96,
child: Container(
width: 224,
height: 24,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: RichText(
text: TextSpan(
style: GoogleFonts.getFont(
'Roboto',
color: const Color(0xFF66666E),
fontSize: 16,
height: 1.5,
),
children: const [
TextSpan(text: 'Don’t Have an account? '),
TextSpan(
text: 'Sign up',
style: TextStyle(
color: Color(0xFF7F00FF),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class TertiaryButton extends StatelessWidget {
const TertiaryButton({super.key});
@override
Widget build(BuildContext context) {
return RichText(
text: TextSpan(
style: GoogleFonts.getFont(
'Roboto',
color: const Color(0xFF66666E),
fontSize: 16,
height: 1.5,
),
children: const [
TextSpan(text: 'Don’t Have an account? '),
TextSpan(
text: 'Sign up',
style: TextStyle(
color: Color(0xFF7F00FF),
),
)
],
),
);
}
}
class LoginOptions extends StatelessWidget {
const LoginOptions({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 156,
height: 44,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2F000b5be92956113a6aca2b881f90c6d00a01c9c0google.png?alt=media&token=f362c9ea-2c0d-4621-ad53-b414f58a9f73',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 56,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fdabc2b816bb02bd2c6456ba37a32984ef44f7893apple.png?alt=media&token=b525d672-05fa-4633-9cfc-b0ee5de0605d',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 112,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fc2e3b2c674d9d4c3192a768e38e4b944c32be2f2facebook.png?alt=media&token=12b1d16d-d837-4c42-8a73-1b04549d7313',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
)
],
),
);
}
}
class Cap extends StatelessWidget {
const Cap({super.key});
@override
Widget build(BuildContext context) {
return Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2Fe875623c-fc06-4318-9c2b-a79a0d6784da.png',
width: 1,
height: 4,
fit: BoxFit.contain,
);
}
}
class Rectangle3 extends StatelessWidget {
const Rectangle3({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
);
}
}
class ORLogInWith extends StatelessWidget {
const ORLogInWith({super.key});
@override
Widget build(BuildContext context) {
return const Text(
'OR log in with',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
);
}
}
class Group8 extends StatelessWidget {
const Group8({super.key});
@override
Widget build(BuildContext context) {
return Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F25991f0a-bd5f-4fdb-bd42-8e9ccb757089.png',
width: 55,
height: 48,
fit: BoxFit.contain,
);
}
}
class Buttons extends StatelessWidget {
const Buttons({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 112,
height: 22,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Forgot password?',
style: TextStyle(
color: Color(0xFF66666E),
fontSize: 14,
height: 1.6,
decoration: TextDecoration.underline,
fontFamily: 'Roboto',
),
),
)
],
),
);
}
}
class Subtract extends StatelessWidget {
const Subtract({super.key});
@override
Widget build(BuildContext context) {
return Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F5b9dd344-be5a-4f57-867e-0d80a2ebadae.png',
width: 80,
height: 80,
fit: BoxFit.contain,
);
}
}
class Border extends StatelessWidget {
const Border({super.key});
@override
Widget build(BuildContext context) {
return Opacity(
opacity: 0.3,
child: Container(
width: 25,
height: 13,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(),
borderRadius: BorderRadius.circular(4),
),
),
);
}
}
class B2W extends StatelessWidget {
const B2W({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 29,
height: 43,
child: Text(
'B2W',
style: GoogleFonts.getFont(
'Agbalumo',
color: Colors.white,
fontSize: 12,
),
),
);
}
}
class HomeIndicator extends StatelessWidget {
const HomeIndicator({super.key});
@override
Widget build(BuildContext context) {
return Transform.rotate(
angle: 180 * pi / 180,
child: Container(
width: 144,
height: 5,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(100),
),
),
);
}
}
class CellularConnectionWifi extends StatelessWidget {
const CellularConnectionWifi({super.key});
@override
Widget build(BuildContext context) {
return Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F1003e96d-b47a-4544-a2a4-b91c285c29e6.png',
width: 43,
height: 12,
fit: BoxFit.contain,
);
}
}
class Buttons extends StatelessWidget {
const Buttons({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 358,
height: 48,
decoration: BoxDecoration(
color: const Color(0xFF7F00FF),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 153,
top: 10,
child: Text(
'Log in',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
height: 1.4,
fontFamily: 'Roboto',
),
),
)
],
),
);
}
}
class Login extends StatelessWidget {
const Login({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 390,
height: 844,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(32),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F763ae003-58cb-4393-ac54-34da5f7c5bcc.png',
width: 390,
height: 283,
fit: BoxFit.contain,
),
),
),
const Positioned(
left: 45,
top: 21,
child: Text(
'9:41',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.black,
fontSize: 17,
fontWeight: FontWeight.w600,
height: 1.3,
fontFamily: 'SF Pro',
),
),
),
Positioned(
left: 302,
top: 26,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F1003e96d-b47a-4544-a2a4-b91c285c29e6.png',
width: 43,
height: 12,
fit: BoxFit.contain,
),
),
Positioned(
left: 330,
top: 26,
child: Opacity(
opacity: 0.3,
child: Container(
width: 25,
height: 13,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
border: Border.all(),
borderRadius: BorderRadius.circular(4),
),
),
),
),
Positioned(
left: 356,
top: 30,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2Fe875623c-fc06-4318-9c2b-a79a0d6784da.png',
width: 1,
height: 4,
fit: BoxFit.contain,
),
),
Positioned(
left: 332,
top: 28,
child: Container(
width: 21,
height: 9,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(3),
),
),
),
Positioned(
left: 123,
top: 831,
child: Transform.rotate(
angle: 180 * pi / 180,
child: Container(
width: 144,
height: 5,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(100),
),
),
),
),
Positioned(
left: 196,
top: 156,
child: SizedBox(
width: 29,
height: 43,
child: Text(
'B2W',
style: GoogleFonts.getFont(
'Agbalumo',
color: Colors.white,
fontSize: 12,
),
),
),
),
Positioned(
left: 169,
top: 142,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F25991f0a-bd5f-4fdb-bd42-8e9ccb757089.png',
width: 55,
height: 48,
fit: BoxFit.contain,
),
),
Positioned(
left: 155,
top: 123,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F5b9dd344-be5a-4f57-867e-0d80a2ebadae.png',
width: 80,
height: 80,
fit: BoxFit.contain,
),
),
Positioned(
left: 16,
top: 283,
child: SizedBox(
width: 358,
height: 459,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 315,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 243,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 213,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: SizedBox(
width: 361,
child: Text(
'Login to your Account',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Lato',
color:
const Color(0xFF333333),
fontSize: 21,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 0,
top: 49,
child: SizedBox(
width: 358,
height: 164,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior:
Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child:
SizedBox(
width:
358,
height:
24,
child:
Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left:
-1,
top:
-1,
child:
Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child:
Container(
width:
358,
height:
46,
decoration:
BoxDecoration(
border:
Border.all(
color:
const Color(0xFFE6E6E9),
),
borderRadius:
BorderRadius.circular(15),
),
child:
const Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left:
15,
top:
10,
child:
SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 90,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior:
Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child:
SizedBox(
width:
358,
height:
24,
child:
Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left:
-1,
top:
-1,
child:
Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child:
Container(
width:
358,
height:
46,
decoration:
BoxDecoration(
border:
Border.all(
color:
const Color(0xFFE6E6E9),
),
borderRadius:
BorderRadius.circular(15),
),
child:
Stack(
clipBehavior:
Clip.none,
children: [
const Positioned(
left:
15,
top:
10,
child:
SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left:
318,
top:
11,
child:
Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 246,
top: 221,
child: Container(
width: 112,
height: 22,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Forgot password?',
style: TextStyle(
color: Color(0xFF66666E),
fontSize: 14,
height: 1.6,
decoration:
TextDecoration.underline,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 267,
child: Container(
width: 358,
height: 48,
decoration: BoxDecoration(
color: const Color(0xFF7F00FF),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 153,
top: 10,
child: Text(
'Log in',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
height: 1.4,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 14,
top: 339,
child: SizedBox(
width: 330,
height: 120,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 80,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius:
BorderRadius.circular(2),
),
),
),
const Positioned(
left: 115,
top: -1,
child: Text(
'OR log in with',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
Positioned(
left: 230,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius:
BorderRadius.circular(2),
),
),
)
],
),
),
),
Positioned(
left: 87,
top: 36,
child: SizedBox(
width: 156,
height: 44,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: ClipRRect(
borderRadius:
BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2F000b5be92956113a6aca2b881f90c6d00a01c9c0google.png?alt=media&token=f362c9ea-2c0d-4621-ad53-b414f58a9f73',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 56,
top: 0,
child: ClipRRect(
borderRadius:
BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fdabc2b816bb02bd2c6456ba37a32984ef44f7893apple.png?alt=media&token=b525d672-05fa-4633-9cfc-b0ee5de0605d',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 112,
top: 0,
child: ClipRRect(
borderRadius:
BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fc2e3b2c674d9d4c3192a768e38e4b944c32be2f2facebook.png?alt=media&token=12b1d16d-d837-4c42-8a73-1b04549d7313',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 53,
top: 96,
child: Container(
width: 224,
height: 24,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: RichText(
text: TextSpan(
style: GoogleFonts.getFont(
'Roboto',
color: const Color(0xFF66666E),
fontSize: 16,
height: 1.5,
),
children: const [
TextSpan(
text: 'Don’t Have an account? '),
TextSpan(
text: 'Sign up',
style: TextStyle(
color: Color(0xFF7F00FF),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
const Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 390,
height: 844,
),
)
],
),
);
}
}
class LoginSeparetor extends StatelessWidget {
const LoginSeparetor({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 330,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
),
const Positioned(
left: 115,
top: -1,
child: Text(
'OR log in with',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
Positioned(
left: 230,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
)
],
),
);
}
}
class Label extends StatelessWidget {
const Label({super.key});
@override
Widget build(BuildContext context) {
return const SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
);
}
}
class BasileyeOutline extends StatelessWidget {
const BasileyeOutline({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
);
}
}
class StarkAnnotationsID308848 extends StatelessWidget {
const StarkAnnotationsID308848({super.key});
@override
Widget build(BuildContext context) {
return const SizedBox(
width: 390,
height: 844,
);
}
}
class Capacity extends StatelessWidget {
const Capacity({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 21,
height: 9,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(3),
),
);
}
}
class Buttons extends StatelessWidget {
const Buttons({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 224,
height: 24,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: RichText(
text: TextSpan(
style: GoogleFonts.getFont(
'Roboto',
color: const Color(0xFF66666E),
fontSize: 16,
height: 1.5,
),
children: const [
TextSpan(text: 'Don’t Have an account? '),
TextSpan(
text: 'Sign up',
style: TextStyle(
color: Color(0xFF7F00FF),
),
)
],
),
),
)
],
),
);
}
}
class Placceholder extends StatelessWidget {
const Placceholder({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
);
}
}
class LoginInfo extends StatelessWidget {
const LoginInfo({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 164,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 90,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class Login extends StatelessWidget {
const Login({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 243,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 213,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: SizedBox(
width: 361,
child: Text(
'Login to your Account',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Lato',
color: const Color(0xFF333333),
fontSize: 21,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 0,
top: 49,
child: SizedBox(
width: 358,
height: 164,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color:
Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color:
const Color(0xFFE6E6E9),
),
borderRadius:
BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color:
Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 90,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color:
Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color:
const Color(0xFFE6E6E9),
),
borderRadius:
BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color:
Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior:
Clip.hardEdge,
decoration:
const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child:
Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit
.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 246,
top: 221,
child: Container(
width: 112,
height: 22,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Forgot password?',
style: TextStyle(
color: Color(0xFF66666E),
fontSize: 14,
height: 1.6,
decoration: TextDecoration.underline,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
);
}
}
class Google extends StatelessWidget {
const Google({super.key});
@override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2F000b5be92956113a6aca2b881f90c6d00a01c9c0google.png?alt=media&token=f362c9ea-2c0d-4621-ad53-b414f58a9f73',
width: 44,
height: 44,
fit: BoxFit.cover,
),
);
}
}
class Input extends StatelessWidget {
const Input({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class Facebook extends StatelessWidget {
const Facebook({super.key});
@override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fc2e3b2c674d9d4c3192a768e38e4b944c32be2f2facebook.png?alt=media&token=12b1d16d-d837-4c42-8a73-1b04549d7313',
width: 44,
height: 44,
fit: BoxFit.cover,
),
);
}
}
class InputHeader extends StatelessWidget {
const InputHeader({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style: TextStyle(
color: Color(0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class Group extends StatelessWidget {
const Group({super.key});
@override
Widget build(BuildContext context) {
return Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height: 14,
fit: BoxFit.contain,
);
}
}
class Button extends StatelessWidget {
const Button({super.key});
@override
Widget build(BuildContext context) {
return const Text(
'Log in',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
height: 1.4,
fontFamily: 'Roboto',
),
);
}
}
class TertiaryButton extends StatelessWidget {
const TertiaryButton({super.key});
@override
Widget build(BuildContext context) {
return const Text(
'Forgot password?',
style: TextStyle(
color: Color(0xFF66666E),
fontSize: 14,
height: 1.6,
decoration: TextDecoration.underline,
fontFamily: 'Roboto',
),
);
}
}
class LoginOption1 extends StatelessWidget {
const LoginOption1({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 315,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 243,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 213,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: SizedBox(
width: 361,
child: Text(
'Login to your Account',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Lato',
color: const Color(0xFF333333),
fontSize: 21,
fontWeight: FontWeight.bold,
),
),
),
),
Positioned(
left: 0,
top: 49,
child: SizedBox(
width: 358,
height: 164,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color: Color(
0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily:
'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(
0xFFE6E6E9),
),
borderRadius:
BorderRadius
.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style:
TextStyle(
color: Color(
0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily:
'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 90,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Password',
style: TextStyle(
color: Color(
0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily:
'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(
0xFFE6E6E9),
),
borderRadius:
BorderRadius
.circular(15),
),
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 294,
child: Text(
'*******',
style:
TextStyle(
color: Color(
0xFF75757B),
fontSize: 16,
height: 1.5,
fontFamily:
'Roboto',
),
),
),
),
Positioned(
left: 318,
top: 11,
child: Container(
width: 24,
height: 24,
clipBehavior:
Clip.hardEdge,
decoration:
const BoxDecoration(),
child: Stack(
clipBehavior:
Clip.none,
children: [
Positioned(
left: 2,
top: 5,
child: Image
.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F56b7d7bb-75ef-44a5-8acf-65ecec6760c6.png',
width: 20,
height:
14,
fit: BoxFit
.contain,
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 246,
top: 221,
child: Container(
width: 112,
height: 22,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Forgot password?',
style: TextStyle(
color: Color(0xFF66666E),
fontSize: 14,
height: 1.6,
decoration: TextDecoration.underline,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 267,
child: Container(
width: 358,
height: 48,
decoration: BoxDecoration(
color: const Color(0xFF7F00FF),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 153,
top: 10,
child: Text(
'Log in',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
height: 1.4,
fontFamily: 'Roboto',
),
),
)
],
),
),
)
],
),
);
}
}
class Apple extends StatelessWidget {
const Apple({super.key});
@override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fdabc2b816bb02bd2c6456ba37a32984ef44f7893apple.png?alt=media&token=b525d672-05fa-4633-9cfc-b0ee5de0605d',
width: 44,
height: 44,
fit: BoxFit.cover,
),
);
}
}
class Time extends StatelessWidget {
const Time({super.key});
@override
Widget build(BuildContext context) {
return const Text(
'9:41',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.black,
fontSize: 17,
fontWeight: FontWeight.w600,
height: 1.3,
fontFamily: 'SF Pro',
),
);
}
}
class Label extends StatelessWidget {
const Label({super.key});
@override
Widget build(BuildContext context) {
return const Text(
'Password',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
);
}
}
class Frame126 extends StatelessWidget {
const Frame126({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 330,
height: 120,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 80,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
),
const Positioned(
left: 115,
top: -1,
child: Text(
'OR log in with',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
Positioned(
left: 230,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
)
],
),
),
),
Positioned(
left: 87,
top: 36,
child: SizedBox(
width: 156,
height: 44,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2F000b5be92956113a6aca2b881f90c6d00a01c9c0google.png?alt=media&token=f362c9ea-2c0d-4621-ad53-b414f58a9f73',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 56,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fdabc2b816bb02bd2c6456ba37a32984ef44f7893apple.png?alt=media&token=b525d672-05fa-4633-9cfc-b0ee5de0605d',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 112,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fc2e3b2c674d9d4c3192a768e38e4b944c32be2f2facebook.png?alt=media&token=12b1d16d-d837-4c42-8a73-1b04549d7313',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 53,
top: 96,
child: Container(
width: 224,
height: 24,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: RichText(
text: TextSpan(
style: GoogleFonts.getFont(
'Roboto',
color: const Color(0xFF66666E),
fontSize: 16,
height: 1.5,
),
children: const [
TextSpan(text: 'Don’t Have an account? '),
TextSpan(
text: 'Sign up',
style: TextStyle(
color: Color(0xFF7F00FF),
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class Input extends StatelessWidget {
const Input({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
),
)
],
),
),
)
],
),
);
}
}
class Placceholder extends StatelessWidget {
const Placceholder({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
);
}
}
class Label extends StatelessWidget {
const Label({super.key});
@override
Widget build(BuildContext context) {
return const Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
);
}
}
class InputHeader extends StatelessWidget {
const InputHeader({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 358,
height: 74,
child: Stack(
clipBehavior: Clip.none,
children: [
const Positioned(
left: 0,
top: -2,
child: SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 358,
height: 46,
decoration: BoxDecoration(
border: Border.all(
color: const Color(0xFFE6E6E9),
),
borderRadius: BorderRadius.circular(15),
),
child: const Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 10,
child: SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
)
],
),
),
)
],
),
);
}
}
class Rectangle2 extends StatelessWidget {
const Rectangle2({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
);
}
}
class LoginToYourAccount extends StatelessWidget {
const LoginToYourAccount({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 361,
child: Text(
'Login to your Account',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Lato',
color: const Color(0xFF333333),
fontSize: 21,
fontWeight: FontWeight.bold,
),
),
);
}
}
class PlaceholderInput extends StatelessWidget {
const PlaceholderInput({super.key});
@override
Widget build(BuildContext context) {
return const SizedBox(
width: 328,
child: Text(
'[email protected]',
style: TextStyle(
color: Color(0xFF74747A),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
);
}
}
class Label extends StatelessWidget {
const Label({super.key});
@override
Widget build(BuildContext context) {
return const SizedBox(
width: 358,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: Text(
'Email Address',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
)
],
),
);
}
}
class LoginOption2 extends StatelessWidget {
const LoginOption2({super.key});
@override
Widget build(BuildContext context) {
return SizedBox(
width: 330,
height: 80,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: SizedBox(
width: 330,
height: 24,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
),
const Positioned(
left: 115,
top: -1,
child: Text(
'OR log in with',
style: TextStyle(
color: Color(0xFF333333),
fontSize: 16,
height: 1.5,
fontFamily: 'Roboto',
),
),
),
Positioned(
left: 230,
top: 11,
child: Container(
width: 100,
height: 2,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF75757B),
borderRadius: BorderRadius.circular(2),
),
),
)
],
),
),
),
Positioned(
left: 87,
top: 36,
child: SizedBox(
width: 156,
height: 44,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 0,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2F000b5be92956113a6aca2b881f90c6d00a01c9c0google.png?alt=media&token=f362c9ea-2c0d-4621-ad53-b414f58a9f73',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 56,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fdabc2b816bb02bd2c6456ba37a32984ef44f7893apple.png?alt=media&token=b525d672-05fa-4633-9cfc-b0ee5de0605d',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
),
Positioned(
left: 112,
top: 0,
child: ClipRRect(
borderRadius: BorderRadius.circular(22),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://firebasestorage.googleapis.com/v0/b/codeless-app.appspot.com/o/projects%2F0RkkSSOpbRJIJtysKknW%2Fc2e3b2c674d9d4c3192a768e38e4b944c32be2f2facebook.png?alt=media&token=12b1d16d-d837-4c42-8a73-1b04549d7313',
width: 44,
height: 44,
fit: BoxFit.cover,
),
),
)
],
),
),
)
],
),
);
}
}
class Rectangle1 extends StatelessWidget {
const Rectangle1({super.key});
@override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(20),
clipBehavior: Clip.hardEdge,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkkSSOpbRJIJtysKknW%2F763ae003-58cb-4393-ac54-34da5f7c5bcc.png',
width: 390,
height: 283,
fit: BoxFit.contain,
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment