detailpage:

import 'package:flutter/material.dart';

import '../misc/colors.dart';
import '../widgets/app_buttons.dart';
import '../widgets/app_large_text.dart';
import '../widgets/app_text.dart';
import '../widgets/responsive_button.dart';
import 'navpages/main_page.dart';

class DetailPage extends StatefulWidget {

final String name;
final String img;
final String location;
final int stars;
final int price;
final String description;

const DetailPage({
super.key,
required this.name,
required this.img,
required this.location,
required this.stars,
required this.price,
required this.description,});

@override
State<DetailPage> createState() => _DetailPageState();
}

class _DetailPageState extends State<DetailPage> {

int gottenStars = 4;
int selectedIndex = -1;
@override
Widget build(BuildContext context) {
return Scaffold(
body: SizedBox(
width: double.maxFinite,
height: double.maxFinite,
child: Stack(
children: [
Positioned(
child: Container(
width: double.maxFinite,
height: 350,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage("img/heritage/patan-durbar.jpg"),
fit: BoxFit.cover),
))),
Positioned(
left: 10,
top: 40,
child: Row(
children: [
 IconButton(
onPressed: () {
Navigator.of(context).pushReplacement(MaterialPageRoute(
builder: (context) => const MainPage()));
},
icon: const Icon(Icons.arrow_back),
color: Colors.white,
iconSize: 30,
)
],
)),
Positioned(
top: 320,
child: Container(
padding: const EdgeInsets.only(left: 20, right: 20, top: 30),
width: MediaQuery.of(context).size.width,
height: 500,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20))),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
AppLargeText(
text: "Patan-Durbar",
color: Colors.black.withOpacity(0.8)),
AppLargeText(
text: "\$200",
color: AppColors.mainColor,
)
],
),
const SizedBox(
height: 10,
),
Row(
children: [
const Icon(
Icons.location_on,
color: AppColors.mainColor,
),
const SizedBox(
width: 5,
),
AppText(
text: "Nepal, Kathmandu",
color: AppColors.texColor1,
)
],
),
const SizedBox(
height: 20,
),
Row(
 children: [
Wrap(
children: List.generate(5, (index) {
return Icon(Icons.star,
color: index < gottenStars
? AppColors.starColor
: AppColors.textColor2);
}),
),
const SizedBox(
width: 10,
),
AppText(
text: "(4.0)",
color: AppColors.textColor2,
)
],
),
const SizedBox(
height: 25,
),
AppLargeText(
text: "People",
color: Colors.black.withOpacity(0.8),
size: 20,
),
const SizedBox(
height: 5,
),
AppText(
text: "Number of people in your group",
color: AppColors.mainTextColor,
),
const SizedBox(
height: 10,
),
Wrap(
children: List.generate(5, (index) {
return InkWell(
onTap: () {
setState(() {
selectedIndex = index;
});
},
child: Container(
margin: const EdgeInsets.only(right: 10),
child: AppButtons(
size: 50,
color: selectedIndex == index
? Colors.white
: Colors.black,
backgroundColor: selectedIndex == index
? Colors.black
: AppColors.buttonBackground,
borderColor: selectedIndex == index
? Colors.black
: AppColors.buttonBackground,
text: (index + 1).toString(),
),
 ),
);
})),
const SizedBox(
height: 10,
),
AppLargeText(
text: "Description",
color: Colors.black.withOpacity(0.8),
size: 20,
),
const SizedBox(
height: 10,
),
AppText(
text:
" Patan-Durbar is the oldest Hindu temple in Kathmandu."
" Patan-Durbar is considered as the protector of the
universe and the patron deity of Hindu people."
" Hundreds of throusands of Hindu devotees from across
the world come to Nepal to visit the temple.",
color: AppColors.mainTextColor,
),
],
),
)),
Positioned(
bottom: 20,
left: 20,
right: 20,
child: Row(
children: [
AppButtons(
size: 60,
color: AppColors.textColor2,
backgroundColor: Colors.white,
borderColor: AppColors.textColor2,
isIcon: true,
icon: Icons.favorite_border,
),
const SizedBox(
width: 20,
),
ResponsiveButton(
isResponsive: true,
)
],
))
],
),
));
}
}