Skip to content

Instantly share code, notes, and snippets.

@rayliverified

rayliverified/0Rc4iN86D9xonPRAMZRL.dart

Created September 21, 2024 10:19
Show Gist options
  • Save rayliverified/cd744a38c42930fd74b2cc1dfb907d49 to your computer and use it in GitHub Desktop.
Save rayliverified/cd744a38c42930fd74b2cc1dfb907d49 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
0Rc4iN86D9xonPRAMZRL.dart
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: FeatureCardsGridWithLargeTitleCTA(),
),
);
}
}
class FeatureCardsGridWithLargeTitleCTA extends StatelessWidget {
const FeatureCardsGridWithLargeTitleCTA({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: 1500,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
),
child: Container(
width: double.infinity,
margin: const EdgeInsets.symmetric(horizontal: 48, vertical: 80),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.min,
children: [
RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: GoogleFonts.getFont(
'Poppins',
color: Colors.black,
fontSize: 56,
fontWeight: FontWeight.w500,
height: 1.1,
),
children: const [
TextSpan(text: 'The ultimate drag-and-drop editor for '),
TextSpan(text: 'Flutter')
],
),
),
const SizedBox(height: 40),
SizedBox(
width: 287,
height: 60,
child: TextButton(
onPressed: () {},
style: TextButton.styleFrom(
backgroundColor: const Color(0xFF4B6CE5),
foregroundColor: Colors.white,
shadowColor: const Color(0xFFA5A5A5),
padding:
const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
textStyle: GoogleFonts.getFont(
'Poppins',
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.w500,
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(50),
),
visualDensity: VisualDensity.standard,
elevation: 0,
minimumSize: Size.zero,
),
child: const Text(
'Read Developer Stories',
textAlign: TextAlign.center,
),
),
),
const SizedBox(height: 60),
SizedBox(
width: double.infinity,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: SizedBox(
width: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.min,
children: [
Container(
width: double.infinity,
height: 250,
alignment: Alignment.center,
padding: const EdgeInsets.all(24),
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(15),
boxShadow: const [
BoxShadow(
color: Color(0x42A1B7C0),
spreadRadius: 0,
offset: Offset(0, 10),
blurRadius: 20,
)
],
),
child: SizedBox(
width: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.recommend,
size: 56,
color: Color(0xFF4B6CE5),
),
const SizedBox(height: 8),
Text(
'Zero Learning Curve',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF4B6CE5),
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 8),
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: 600,
),
child: Text(
"Codelessly uses the same Flutter concepts you already know, so it's easy to get started.",
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF878E98),
fontSize: 18,
height: 1.3,
),
),
)
],
),
),
),
const SizedBox(height: 40),
SizedBox(
width: double.infinity,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Container(
width: double.infinity,
height: 240,
alignment: Alignment.center,
padding: const EdgeInsets.all(24),
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(15),
boxShadow: const [
BoxShadow(
color: Color(0x42A1B7C0),
spreadRadius: 0,
offset: Offset(0, 10),
blurRadius: 20,
)
],
),
child: SizedBox(
width: double.infinity,
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Text(
'1-Click Publishing',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF4B6CE5),
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 8),
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: 600,
),
child: Text(
'Update your app on the click of a button',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF878E98),
fontSize: 18,
height: 1.3,
),
),
)
],
),
),
),
),
const SizedBox(width: 40),
Expanded(
child: Container(
width: double.infinity,
height: 240,
alignment: Alignment.center,
padding: const EdgeInsets.all(24),
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(15),
boxShadow: const [
BoxShadow(
color: Color(0x42A1B7C0),
spreadRadius: 0,
offset: Offset(0, 10),
blurRadius: 20,
)
],
),
child: SizedBox(
width: double.infinity,
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Text(
'25+ Flutter Components',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF4B6CE5),
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 8),
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: 400,
),
child: Text(
'Highly customizable components for you to build your dream app',
textAlign: TextAlign.center,
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF878E98),
fontSize: 18,
height: 1.3,
),
),
)
],
),
),
),
)
],
),
)
],
),
),
),
const SizedBox(width: 40),
Expanded(
child: Container(
width: double.infinity,
height: 530,
alignment: Alignment.center,
padding: const EdgeInsets.all(80),
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(15),
boxShadow: const [
BoxShadow(
color: Color(0x42A1B7C0),
spreadRadius: 0,
offset: Offset(0, 10),
blurRadius: 20,
)
],
),
child: SizedBox(
width: double.infinity,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
width: double.infinity,
child: Text(
'Bring your app to life in just \na few hours',
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF141A27),
fontSize: 32,
fontWeight: FontWeight.w500,
),
),
),
const SizedBox(height: 8),
SizedBox(
width: double.infinity,
child: Text(
'Codelessly provides you with all the tooling you need to bring your app to life. Intuitive layout engine, API builder, code-gen engine, you name it!',
style: GoogleFonts.getFont(
'Poppins',
color: const Color(0xFF878E98),
fontSize: 18,
height: 1.3,
),
),
),
const SizedBox(height: 60),
const SizedBox(
width: double.infinity,
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Icon(
Icons.account_circle,
size: 48,
color: Color(0xFF4B6CE5),
),
SizedBox(width: 16),
Expanded(
child: Divider(
height: 16,
thickness: 1,
color: Color(0xFF878E98),
),
),
SizedBox(width: 16),
Icon(
Icons.article,
size: 48,
color: Color(0xFF4B6CE5),
),
SizedBox(width: 16),
Expanded(
child: Divider(
height: 16,
thickness: 1,
color: Color(0xFF878E98),
),
),
SizedBox(width: 16),
Icon(
Icons.layers,
size: 48,
color: Color(0xFF4B6CE5),
),
SizedBox(width: 16),
Expanded(
child: Divider(
height: 16,
thickness: 1,
color: Color(0xFF878E98),
),
),
SizedBox(width: 16),
Icon(
Icons.event_note,
size: 48,
color: Color(0xFF4B6CE5),
)
],
),
)
],
),
),
),
)
],
),
)
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment