869 lines
38 KiB
Dart
869 lines
38 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
import 'package:proxibuy/core/utils/empty_space.dart';
|
|
import 'package:proxibuy/presentation/ui/theme/colors.dart';
|
|
import 'package:proxibuy/presentation/ui/theme/responsive.dart';
|
|
import 'package:proxibuy/presentation/ui/widgets/dialog/image_gallary.dart';
|
|
|
|
class ProductPage extends StatelessWidget {
|
|
const ProductPage({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return DefaultTabController(
|
|
length: 2,
|
|
child: Responsive(context).builder(
|
|
desktop: Scaffold(
|
|
body: Center(
|
|
child: ConstrainedBox(
|
|
constraints: BoxConstraints(
|
|
maxWidth: 1600,
|
|
),
|
|
child: Column(
|
|
children: [
|
|
Padding(
|
|
padding: const EdgeInsets.all(32.0),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
IconButton(
|
|
onPressed: () {
|
|
context.pop();
|
|
},
|
|
icon: Icon(
|
|
Icons.arrow_back_ios,
|
|
size: 32,
|
|
)),
|
|
Padding(
|
|
padding: const EdgeInsets.only(right: 32.0),
|
|
child: IconButton(
|
|
iconSize: 32,
|
|
onPressed: () {},
|
|
icon: Icon(Icons.bookmark_add_rounded)),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Expanded(
|
|
child: Row(
|
|
children: [
|
|
Expanded(
|
|
child: SingleChildScrollView(
|
|
physics: BouncingScrollPhysics(),
|
|
child: productTabBarView(context))),
|
|
Expanded(
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 64.0),
|
|
child: Column(
|
|
children: [
|
|
Expanded(
|
|
child: InkWell(
|
|
onTap: () {
|
|
Navigator.of(context).push(ImageGallary(
|
|
initialUrl:
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
urls: [
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
...List.generate(
|
|
10,
|
|
(index) =>
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png',
|
|
)
|
|
]));
|
|
},
|
|
child: ClipRRect(
|
|
borderRadius: BorderRadius.circular(16),
|
|
child: AspectRatio(
|
|
aspectRatio: 1 / 1,
|
|
child: Image.network(
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
width: double.infinity,
|
|
fit: BoxFit.cover,
|
|
)),
|
|
),
|
|
),
|
|
),
|
|
Padding(
|
|
padding:
|
|
const EdgeInsets.only(top: 32.0, bottom: 64),
|
|
child: SizedBox(
|
|
width: double.infinity,
|
|
height: 90,
|
|
child: ListView.builder(
|
|
itemCount: 20,
|
|
padding: EdgeInsets.symmetric(horizontal: 8),
|
|
scrollDirection: Axis.horizontal,
|
|
shrinkWrap: true,
|
|
physics: BouncingScrollPhysics(),
|
|
itemBuilder: (context, index) {
|
|
return InkWell(
|
|
onTap: () {
|
|
Navigator.of(context).push(ImageGallary(
|
|
initialUrl:
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png',
|
|
urls: [
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
...List.generate(
|
|
10,
|
|
(index) =>
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png',
|
|
)
|
|
]));
|
|
},
|
|
child: Container(
|
|
margin:
|
|
EdgeInsets.symmetric(horizontal: 8),
|
|
padding: EdgeInsets.all(4),
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context)
|
|
.colorScheme
|
|
.surface
|
|
.withAlpha(200),
|
|
borderRadius:
|
|
BorderRadius.circular(8)),
|
|
child: Image.network(
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png'),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
)),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
)),
|
|
),
|
|
mobile: Scaffold(
|
|
body: SingleChildScrollView(
|
|
child: Column(
|
|
children: [
|
|
Stack(
|
|
children: [
|
|
Padding(
|
|
padding: const EdgeInsets.only(bottom: 46),
|
|
child: InkWell(
|
|
onTap: () {
|
|
Navigator.of(context).push(ImageGallary(
|
|
initialUrl:
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
urls: [
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
...List.generate(
|
|
10,
|
|
(index) =>
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png',
|
|
)
|
|
]));
|
|
},
|
|
child: AspectRatio(
|
|
aspectRatio: 0.95,
|
|
child: Image.network(
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
width: double.infinity,
|
|
fit: BoxFit.cover,
|
|
)),
|
|
),
|
|
),
|
|
Positioned(
|
|
left: 16,
|
|
right: 16,
|
|
top: 32,
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
InkWell(
|
|
onTap: () {
|
|
context.pop();
|
|
},
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context)
|
|
.colorScheme
|
|
.surface
|
|
.withAlpha(180),
|
|
borderRadius: BorderRadius.circular(8)),
|
|
padding: EdgeInsets.all(8),
|
|
child: Icon(Icons.arrow_back_ios_new_rounded),
|
|
),
|
|
),
|
|
InkWell(
|
|
onTap: () {},
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context)
|
|
.colorScheme
|
|
.surface
|
|
.withAlpha(180),
|
|
borderRadius: BorderRadius.circular(8)),
|
|
padding: EdgeInsets.all(8),
|
|
child: Icon(Icons.bookmark_add_rounded),
|
|
),
|
|
),
|
|
],
|
|
)),
|
|
Positioned(
|
|
right: 0,
|
|
left: 0,
|
|
bottom: 0,
|
|
child: SizedBox(
|
|
width: double.infinity,
|
|
height: 90,
|
|
child: ListView.builder(
|
|
itemCount: 20,
|
|
padding: EdgeInsets.symmetric(horizontal: 8),
|
|
scrollDirection: Axis.horizontal,
|
|
shrinkWrap: true,
|
|
physics: BouncingScrollPhysics(),
|
|
itemBuilder: (context, index) {
|
|
return InkWell(
|
|
onTap: () {
|
|
Navigator.of(context).push(ImageGallary(
|
|
initialUrl:
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png',
|
|
urls: [
|
|
'https://s3-alpha-sig.figma.com/img/4361/9bde/26f7810ea7f22d8aa59a907d378c16ff?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=DIm2QGXae9cxWDNV2UoJd4JWpvvmL~qKmEefvrtVw9XwKTVHwcfgqR3-s-5s7jqsTiT0iWDsYY10MeuSf2d4xXx9uTra~QEj3LbO1x4cRv4DBDJ-wkLGxliV07HVWl~CMl1MhzXyfUvWkrR30QQ5x3IslvBpfulMj88AYU5l97XPaNMOcMT8YqErdCdpiqdXBM9L2vUpCUbZGH~SfKCQyl1QcNhuCBTPODPWcK6kGU1ell3qwXC0-4JcLiiR-Kdo9asKy495iVtQ584fyZAdeN1R4oJnVGnAlUyN2HRQh6j518FCrJIzr7O0JajvrmwZ7j48nXjWPtG0SGp8Lq4l6A__',
|
|
...List.generate(
|
|
10,
|
|
(index) =>
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png',
|
|
)
|
|
]));
|
|
},
|
|
child: Container(
|
|
margin: EdgeInsets.symmetric(horizontal: 8),
|
|
padding: EdgeInsets.all(4),
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context)
|
|
.colorScheme
|
|
.surface
|
|
.withAlpha(200),
|
|
borderRadius: BorderRadius.circular(8)),
|
|
child: Image.network(
|
|
'https://static.vecteezy.com/system/resources/previews/021/275/832/non_2x/running-shoes-illustration-with-fire-shape-yellow-and-red-isolated-on-transparan-background-free-png.png'),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
))
|
|
],
|
|
),
|
|
productTabBarView(context),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Column productTabBarView(BuildContext context) {
|
|
return Column(
|
|
children: [
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
|
child: TabBar(
|
|
tabs: [
|
|
Tab(text: 'Item'),
|
|
Tab(text: 'Shop'),
|
|
],
|
|
),
|
|
),
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 16.0),
|
|
child: SizedBox(
|
|
height: 1500,
|
|
child: TabBarView(
|
|
children: [itemTab(context), shopTab(context)],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget itemTab(BuildContext context) {
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
SelectableText(
|
|
'Philadelphia Honey Pecan Cream Cheese Spread, 7.5 oz Tub',
|
|
style: Theme.of(context).textTheme.headlineSmall,
|
|
),
|
|
4.h,
|
|
SelectableText(
|
|
'Brand: Philadelphia',
|
|
style: Theme.of(context).textTheme.titleSmall,
|
|
),
|
|
8.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_half_rounded),
|
|
8.w,
|
|
Text(
|
|
'4.8',
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
)
|
|
],
|
|
),
|
|
8.h,
|
|
SelectableText(
|
|
'Currently available. 23 remain',
|
|
style: Theme.of(context).textTheme.titleSmall,
|
|
),
|
|
12.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.warning_amber_rounded),
|
|
8.w,
|
|
Text(
|
|
'Expire: 5 days',
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
)
|
|
],
|
|
),
|
|
8.h,
|
|
Divider(
|
|
color: Theme.of(context).colorScheme.onSurface,
|
|
),
|
|
8.h,
|
|
SelectableText(
|
|
'Nutrition summary',
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
),
|
|
4.h,
|
|
SelectableText(
|
|
'7 servings per container | 2 Tbsp (33g)',
|
|
style: Theme.of(context).textTheme.bodyLarge,
|
|
),
|
|
16.h,
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context).colorScheme.surface,
|
|
borderRadius: BorderRadius.circular(16)),
|
|
padding: EdgeInsets.symmetric(vertical: 8, horizontal: 16),
|
|
child: Flex(
|
|
direction: Axis.horizontal,
|
|
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
|
children: [
|
|
Flexible(
|
|
flex: 1,
|
|
child: Column(
|
|
children: [
|
|
SelectableText(
|
|
'80',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.labelLarge
|
|
?.copyWith(color: Theme.of(context).primaryColor),
|
|
),
|
|
SelectableText('Calories',
|
|
style: Theme.of(context).textTheme.labelLarge),
|
|
],
|
|
),
|
|
),
|
|
Flexible(
|
|
flex: 1,
|
|
child: Column(
|
|
children: [
|
|
SelectableText(
|
|
'100mg',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.labelLarge
|
|
?.copyWith(color: Theme.of(context).primaryColor),
|
|
),
|
|
SelectableText('Sodium',
|
|
style: Theme.of(context).textTheme.labelLarge),
|
|
],
|
|
),
|
|
),
|
|
Flexible(
|
|
flex: 1,
|
|
child: Column(
|
|
children: [
|
|
SelectableText(
|
|
'0g',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.labelLarge
|
|
?.copyWith(color: Theme.of(context).primaryColor),
|
|
),
|
|
SelectableText('Dietary Fiber',
|
|
style: Theme.of(context).textTheme.labelLarge),
|
|
],
|
|
),
|
|
),
|
|
Flexible(
|
|
flex: 1,
|
|
child: Column(
|
|
children: [
|
|
SelectableText(
|
|
'5g',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.labelLarge
|
|
?.copyWith(color: Theme.of(context).primaryColor),
|
|
),
|
|
SelectableText('Sugars',
|
|
style: Theme.of(context).textTheme.labelLarge),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
16.h,
|
|
Divider(
|
|
color: Theme.of(context).colorScheme.onSurface,
|
|
),
|
|
16.h,
|
|
Row(
|
|
children: [
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
color: semanticRed, borderRadius: BorderRadius.circular(8)),
|
|
padding: EdgeInsets.all(8),
|
|
child: Text(
|
|
'HOT',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleMedium
|
|
?.copyWith(color: Colors.white),
|
|
),
|
|
),
|
|
8.w,
|
|
SelectableText(
|
|
'(50%) 32.18 - 16.9 \$',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleMedium
|
|
?.copyWith(color: semanticRed),
|
|
)
|
|
],
|
|
),
|
|
16.h,
|
|
Center(
|
|
child: Text(
|
|
'Top reviews from the United States',
|
|
style: Theme.of(context).textTheme.titleMedium,
|
|
)),
|
|
8.h,
|
|
ListView.builder(
|
|
shrinkWrap: true,
|
|
itemCount: 3,
|
|
physics: NeverScrollableScrollPhysics(),
|
|
itemBuilder: (context, index) {
|
|
return Column(
|
|
children: [
|
|
ListTile(
|
|
contentPadding: EdgeInsets.zero,
|
|
title: SelectableText(
|
|
'Kristin Watson',
|
|
style: Theme.of(context).textTheme.labelLarge,
|
|
),
|
|
subtitle: SelectableText(
|
|
'Verified Buyer',
|
|
style: Theme.of(context).textTheme.bodySmall,
|
|
),
|
|
trailing: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
],
|
|
),
|
|
),
|
|
16.h,
|
|
SelectableText(
|
|
'This is 💯 one hundred percent the best !!! "Philadelphia cream cheese is absolutely amazing—so creamy and versatile, it elevates every recipe, from cheesecakes to simple bagels. A must-have in my kitchen!"😋😋😋',
|
|
style: Theme.of(context).textTheme.bodyLarge,
|
|
),
|
|
16.h,
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Icon(Icons.thumb_up_alt_outlined),
|
|
8.w,
|
|
Text('Yes (2)'),
|
|
12.w,
|
|
Icon(Icons.thumb_down_alt_outlined),
|
|
8.w,
|
|
Text('No (0)'),
|
|
],
|
|
),
|
|
Text(
|
|
'Nov 09, 2024',
|
|
style: Theme.of(context).textTheme.bodySmall,
|
|
)
|
|
],
|
|
),
|
|
if (index != 3 - 1)
|
|
Divider(
|
|
color: Theme.of(context).colorScheme.onSurface,
|
|
)
|
|
],
|
|
);
|
|
},
|
|
),
|
|
12.h,
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
'See all reviws',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleMedium
|
|
?.copyWith(color: semanticRed),
|
|
),
|
|
4.w,
|
|
Icon(
|
|
Icons.arrow_forward,
|
|
color: semanticRed,
|
|
)
|
|
],
|
|
)
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget shopTab(BuildContext context) {
|
|
return Column(
|
|
children: [
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
SelectableText(
|
|
'Heinen\'s Grocery',
|
|
style: Theme.of(context).textTheme.headlineSmall,
|
|
),
|
|
8.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_rate_rounded),
|
|
Icon(Icons.star_half_rounded),
|
|
8.w,
|
|
Text(
|
|
'4.8',
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
)
|
|
],
|
|
),
|
|
8.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.location_on_outlined),
|
|
8.w,
|
|
Text(
|
|
'Shop 1, Cleveland, Ohio, United States',
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
)
|
|
],
|
|
),
|
|
4.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.access_time_rounded),
|
|
8.w,
|
|
Text(
|
|
'Open now | 10:00 AM - 12:00 PM',
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
)
|
|
],
|
|
),
|
|
16.h,
|
|
Row(
|
|
children: [
|
|
SelectableText(
|
|
'Facilities',
|
|
style: Theme.of(context).textTheme.titleMedium,
|
|
),
|
|
8.w,
|
|
Expanded(
|
|
child: Divider(
|
|
color: Theme.of(context).colorScheme.onSurface,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
8.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.check_box_outlined),
|
|
8.w,
|
|
Text(
|
|
'Home Delivery',
|
|
style: Theme.of(context).textTheme.bodyMedium,
|
|
)
|
|
],
|
|
),
|
|
16.h,
|
|
SizedBox(
|
|
height: 46,
|
|
child: ElevatedButton(
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Theme.of(context).colorScheme.surface),
|
|
onPressed: () {},
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(Icons.navigation_rounded),
|
|
4.w,
|
|
Text('Direction')
|
|
],
|
|
)),
|
|
),
|
|
16.h,
|
|
Container(
|
|
width: double.infinity,
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context).colorScheme.surface,
|
|
borderRadius: BorderRadius.circular(16)),
|
|
padding: EdgeInsets.all(16),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
'23 min (8.7 km)',
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
),
|
|
12.h,
|
|
SizedBox(
|
|
height: 46,
|
|
width: double.infinity,
|
|
child: ElevatedButton(
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: semanticGreen),
|
|
onPressed: () {},
|
|
child: Text('Reservation')),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
16.h,
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
|
child: Row(
|
|
children: [
|
|
SelectableText(
|
|
'List of offers',
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
16.h,
|
|
SizedBox(
|
|
width: double.infinity,
|
|
height: 150,
|
|
child: ListView.builder(
|
|
shrinkWrap: true,
|
|
scrollDirection: Axis.horizontal,
|
|
padding: EdgeInsets.symmetric(horizontal: 8),
|
|
physics: BouncingScrollPhysics(),
|
|
itemBuilder: (context, index) {
|
|
return Container(
|
|
width: 300,
|
|
padding: EdgeInsets.all(12),
|
|
margin: EdgeInsets.symmetric(horizontal: 8),
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context).colorScheme.surface,
|
|
borderRadius: BorderRadius.circular(16)),
|
|
child: Column(
|
|
children: [
|
|
Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
ClipRRect(
|
|
borderRadius: BorderRadius.circular(8),
|
|
child: Image.network(
|
|
'https://s3-alpha-sig.figma.com/img/f773/0650/56608740ed0260647aa12c36f8b46534?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=UxdqWfGI5Ix~S2728Qsiw0MHGST~we6M25cWRZ8YetaIGlC-ITXjDaX8LDssimYJt5XWmfyWqE0D4vRq1lP9Nmy3CfI~bLXaaBBSmQqAwdXDz1aVXFh7Q8ri5klxYoCjIF0HTp3nr4Scpf5d9PHU7L32s8JF0pz4dt8tyaCo-goeEOsjn8Q-LOBKNHVE6B8uRnW74GH12V7GNygxv1EV59dDD1vcXNcD7kS~2Ox7RejK159Ys7La1F-Evbt5sU7XFOMJuFbPVUgWA05wgrF1U1zdaz5b10Mu9~4PnErR~FjJTZPYcznatVYwuxWRWRAtpwjhjew2TL0DoOvlCKHbYw__',
|
|
width: 74,
|
|
height: 74,
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
12.w,
|
|
Expanded(
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
SelectableText(
|
|
'Kellogg\'s Corn Flakes',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleMedium
|
|
?.copyWith(overflow: TextOverflow.ellipsis),
|
|
maxLines: 1,
|
|
),
|
|
8.h,
|
|
SelectableText(
|
|
'Classic cereal with a crispy texture an a mildly sweet flavor',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium
|
|
?.copyWith(overflow: TextOverflow.ellipsis),
|
|
maxLines: 2,
|
|
),
|
|
],
|
|
),
|
|
)
|
|
],
|
|
),
|
|
12.h,
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
color: semanticRed,
|
|
borderRadius: BorderRadius.circular(8)),
|
|
padding: EdgeInsets.all(8),
|
|
child: Text(
|
|
'HOT',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleSmall
|
|
?.copyWith(color: Colors.white),
|
|
),
|
|
),
|
|
8.w,
|
|
Text(
|
|
'(50%) / 16 - 8\$',
|
|
style: Theme.of(context).textTheme.titleSmall,
|
|
)
|
|
],
|
|
),
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
color: semanticGreen,
|
|
borderRadius: BorderRadius.circular(8)),
|
|
padding: EdgeInsets.all(8),
|
|
child: Text(
|
|
'Reservation',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleSmall
|
|
?.copyWith(color: Colors.white),
|
|
),
|
|
),
|
|
],
|
|
)
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
16.h,
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
|
child: Row(
|
|
children: [
|
|
SelectableText(
|
|
'Similar Business',
|
|
style: Theme.of(context).textTheme.titleLarge,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
16.h,
|
|
SizedBox(
|
|
width: double.infinity,
|
|
height: 270,
|
|
child: ListView.builder(
|
|
shrinkWrap: true,
|
|
scrollDirection: Axis.horizontal,
|
|
padding: EdgeInsets.symmetric(horizontal: 8),
|
|
physics: BouncingScrollPhysics(),
|
|
itemBuilder: (context, index) {
|
|
return Container(
|
|
width: 240,
|
|
padding: EdgeInsets.all(12),
|
|
margin: EdgeInsets.symmetric(horizontal: 8),
|
|
decoration: BoxDecoration(
|
|
color: Theme.of(context).colorScheme.surface,
|
|
borderRadius: BorderRadius.circular(16)),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
ClipRRect(
|
|
borderRadius: BorderRadius.circular(8),
|
|
child: AspectRatio(
|
|
aspectRatio: 16 / 9,
|
|
child: Image.network(
|
|
'https://s3-alpha-sig.figma.com/img/c720/df1c/d8288c0392372fb3dd15824b84b9d563?Expires=1740960000&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=CMct6yvsv~g0YEUDRp-D3prnQve4nZc5mB~oJ4jbRsH63ltvM4yoCKbTYJLCm~ONwb9e7TNoFO1Q1pO8sPz3TBB-gAFIX9j53fz40ypp0VsRXSOK91G7LBj82V974E1Yqxol2fhAZ8icTAaOZVJgJH-47EG3wQqujGieHbcOYCCBZoCPP0a~jKG~LsE-EtLmP0RdXOuqE9-o2gMzEBH2TMXLtWJXYtA6dS~XHPBIeUXn4Sa7Hy4ca3pGb6wXN4owNt4SeanQuxeR-CEgDYJTI~tU6LkW1N2TSPOt6iGn5Jbb4XdkFjKA7dkwijG9mEU9F3wy16aMj7a1Z1yEwAvlwg__',
|
|
height: 100,
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
),
|
|
8.h,
|
|
SelectableText(
|
|
'Milam\'s Markets',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleMedium
|
|
?.copyWith(overflow: TextOverflow.ellipsis),
|
|
maxLines: 1,
|
|
),
|
|
8.h,
|
|
Row(
|
|
children: [
|
|
Icon(Icons.location_on_outlined),
|
|
8.w,
|
|
SelectableText(
|
|
'Miami Springs, Florida',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodyMedium
|
|
?.copyWith(overflow: TextOverflow.ellipsis),
|
|
maxLines: 1,
|
|
)
|
|
],
|
|
),
|
|
8.h,
|
|
SizedBox(
|
|
child: ElevatedButton(
|
|
onPressed: () {}, child: Text('See more about')),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
)
|
|
],
|
|
);
|
|
}
|
|
}
|