Files
CityCards_Customer_Flutter/lib/hotel_offer/hotel_offer_view.dart

384 lines
14 KiB
Dart

import 'package:citycards_customer/common_packages/app_bar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:citycards_customer/common_packages/custom_filled_button.dart';
class HotelOfferView extends StatelessWidget {
const HotelOfferView({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
color: Colors.white,
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
child: CommonAppBar(isWhiteLogo: false, isProfilePage: false, showDivider: false),
),
// Banner Section
Stack(
children: [
Image.asset(
"assets/images/marriot_hotel.jpg",
height: 529.h,
width: double.infinity,
fit: BoxFit.cover,
),
Positioned.fill(
child: Container(
height: double.infinity,
width: double.infinity,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Color(0xFF000000).withOpacity(.4),
Color(0xFF000000).withOpacity(.4),
Color(0xFFFFFFFF),
],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
),
),
),
),
Positioned.fill(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 30.w),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Enjoy 20% Off at\nMarriott Hotels\nExclusively with CityCard",
style: TextStyle(
fontSize: 32.sp,
fontWeight: FontWeight.w600,
color: Colors.white,
),
textAlign: TextAlign.center,
),
SizedBox(height: 21.h),
Text(
"Make every stay as unforgettable as the city you're exploring.",
style: TextStyle(
fontSize: 18.sp,
color: Colors.white,
),
textAlign: TextAlign.center,
),
],
),
),
),
],
),
SizedBox(height: 65.h),
Padding(
padding: EdgeInsets.symmetric(horizontal: 22.w),
child: Column(
children: [
Text(
"Your CityCard unlocks more than just attractions — it also opens doors to exceptional stays.",
style: TextStyle(
fontSize: 21.sp,
color: Color(0xFF1F2937),
),
textAlign: TextAlign.center,
),
SizedBox(height: 31.h),
RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: TextStyle(
color: const Color(0xFF364153),
fontSize: 18.sp,
height: 1.6,
),
children: [
const TextSpan(
text: "Thanks to our exclusive partnership with ",
),
TextSpan(
text: "Marriott Hotels",
style: TextStyle(color: const Color(0xFFF95F62)),
),
const TextSpan(text: ", CityCard holders enjoy "),
TextSpan(
text: "20% off best available rates",
style: TextStyle(color: const Color(0xFFF95F62)),
),
const TextSpan(
text:
" across a curated selection of properties in the city.",
),
],
),
),
],
),
),
SizedBox(height: 69.h),
Container(
width: double.infinity,
padding: EdgeInsets.symmetric(vertical: 32.h, horizontal: 16.w),
decoration: BoxDecoration(color: const Color(0xFFFFF5F5)),
child: Column(
children: [
RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: TextStyle(
color: const Color(0xFF101828),
fontSize: 26.25.sp,
),
children: [
const TextSpan(text: "Choose from a "),
TextSpan(
text: "Wide \nVariety",
style: TextStyle(
color: const Color(0xFFF95F62),
fontWeight: FontWeight.w700,
),
),
],
),
),
SizedBox(height: 24.h),
RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: TextStyle(
color: const Color(0xFF364153),
fontSize: 18.sp,
height: 1.5,
),
children: [
const TextSpan(
text:
"Choose from a wide variety of Marriott hotels — from elegant urban hideaways and premium city-centre locations to luxurious five-star experiences — all designed to make your trip ",
),
TextSpan(
text: "effortless, comfortable and memorable",
style: TextStyle(
color: const Color(0xFFF95F62),
fontWeight: FontWeight.w600,
),
),
TextSpan(text: " and "),
TextSpan(
text: "memorable",
style: TextStyle(
color: const Color(0xFFF95F62),
fontWeight: FontWeight.w600,
),
),
],
),
),
],
),
),
SizedBox(height: 70.h),
Text.rich(
TextSpan(
children: [
TextSpan(
text: "Simply use your CityCard",
style: TextStyle(
fontSize: 26.25.sp,
color: Color(0xFF1F2937),
),
),
TextSpan(
text: " booking link to:",
style: TextStyle(
fontSize: 26.25.sp,
color: Color(0xFFF95F62),
fontWeight: FontWeight.w700,
),
),
],
),
textAlign: TextAlign.center,
),
SizedBox(height: 56.h),
_featureCard(
icon: "assets/icons/discount_percent.png",
title: "Access 20% off best available rates",
subtitle: "Save on your stay at premium Marriott properties",
),
SizedBox(height: 28.h),
_featureCard(
icon: "assets/icons/discount_clock.png",
title: "Enjoy priority check-in and late checkout",
subtitle: "Subject to availability for your convenience",
),
SizedBox(height: 28.h),
_featureCard(
icon: "assets/icons/discount_crown.png",
title: "Receive exclusive seasonal offers",
subtitle: "Designed specially for CityCard travellers",
),
SizedBox(height: 56.h),
// Bottom CTA
Padding(
padding: EdgeInsets.symmetric(horizontal: 30.w),
child: Text.rich(
textAlign : TextAlign.center,
TextSpan(
children: [
TextSpan(
text: "It's just one more way",
style: TextStyle(
fontSize: 21.sp,
color: Color(0xFF1F2937),
),
),
TextSpan(
text: " CityCard",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w700,
color: Color(0xFFF95F62),
),
),
TextSpan(
text: " makes exploring",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w400,
color: Color(0xFF1F2937),
),
),
TextSpan(
text: " smarter",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w600,
color: Color(0xFFF95F62),
),
),
TextSpan(
text: ",",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w400,
color: Color(0xFF1F2937),
),
),
TextSpan(
text: " simpler",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w600,
color: Color(0xFFF95F62),
),
),
TextSpan(
text: ", and",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w400,
color: Color(0xFF1F2937),
),
),
TextSpan(
text: " more rewarding",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w600,
color: Color(0xFFF95F62),
),
),
TextSpan(
text: ".",
style: TextStyle(
fontSize: 21.sp,
fontWeight: FontWeight.w400,
color: Color(0xFF1F2937),
),
),
],
),
),
),
SizedBox(height: 28.h),
Align(
alignment: Alignment.center,
child: CustomFilledButton(
onTap: () {},
label: "Get your CityCard today",
showArrow: true,
height: 59.h,
width: 291.w,
),
),
SizedBox(height: 70.h),
],
),
),
),
);
}
Widget _featureCard({
required String icon,
required String title,
required String subtitle,
}) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 22.w),
child: Container(
padding: EdgeInsets.symmetric(horizontal: 21.w, vertical: 21.h),
decoration: BoxDecoration(
color: const Color(0xFFFFF5F5),
borderRadius: BorderRadius.circular(14.r),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Image.asset(icon, scale: 4),
SizedBox(height: 21.h),
Text(
title,
style: TextStyle(
fontSize: 16.sp,
fontWeight: FontWeight.w600,
color: Color(0xFF1F2937),
),
textAlign: TextAlign.center,
),
SizedBox(height: 21.h),
Text(
subtitle,
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w400,
color: Color(0xFF4B5563),
),
textAlign: TextAlign.center,
),
],
),
),
);
}
}