Completed ESIM & Hotel offer view

lib/core/app_router.dart

@@ -4,6 +4,8 @@ import 'package:citycards_customer/contact_us/contact_us_view.dart';
 import 'package:citycards_customer/edit_profile/edit_profile_view.dart';
 import 'package:citycards_customer/esim_offer/esim_offer_view.dart';
 import 'package:citycards_customer/faq/faq_view.dart';
+import 'package:citycards_customer/hotel_offer/hotel_offer_view.dart';
+import 'package:citycards_customer/itinerary_creation/bloc/date_selection_bloc.dart';
 import 'package:citycards_customer/itinerary_creation/bloc/itinerary_steps_selection_bloc.dart';
 import 'package:citycards_customer/itinerary_creation/views/itinerary_creation_start_view.dart';
 import 'package:citycards_customer/itinerary_creation/views/itinerary_creation_view.dart';
@@ -79,13 +81,26 @@ class AppRouter {
       case RouteConstants.itineraryCreation:
         return MaterialPageRoute(
           builder: (_) {
-            return BlocProvider(
+            return MultiBlocProvider(
-              create: (_) => ItineraryStepNavigationBloc(),
+              providers: [
-              child: ItineraryCreationPage(),
+                BlocProvider<UpdateSelectedDateBloc>(
+                  create: (_) => UpdateSelectedDateBloc(),
+                ),
+                BlocProvider<ItineraryStepNavigationBloc>(
+                  create: (_) => ItineraryStepNavigationBloc(),
+                ),
+              ],
+              child: const ItineraryCreationPage(),
             );
           },
         );
 
+      case RouteConstants.hotelOffer:
+        return MaterialPageRoute(builder: (_){
+          return HotelOfferView();
+        });
+
+
       case RouteConstants.esimOffer:
         return MaterialPageRoute(
           builder: (_) {

lib/core/route_constants.dart

@@ -18,4 +18,5 @@ class RouteConstants {
   /****************************  ESIM Page *****************************************/
 
   static const String esimOffer = '/esim_offer';
+  static const String hotelOffer = '/hotelOffer';
 }

lib/hotel_offer/hotel_offer_view.dart

@@ -0,0 +1,384 @@
+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';
+import 'package:citycards_customer/common_packages/custom_text.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),
+              ),
+              // 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,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/itinerary_creation/bloc/date_selection_bloc.dart

@@ -0,0 +1,28 @@
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:intl/intl.dart';
+
+abstract class SelectDateEvent {}
+
+class SelectItineraryDateEvent extends SelectDateEvent {
+  final String date;
+  SelectItineraryDateEvent(this.date);
+}
+
+class SelectItineraryDateState {
+  final String selectedDate;
+  const SelectItineraryDateState(this.selectedDate);
+}
+
+class UpdateSelectedDateBloc
+    extends Bloc<SelectDateEvent, SelectItineraryDateState> {
+  UpdateSelectedDateBloc()
+    : super(
+        SelectItineraryDateState(
+          DateFormat('EEEE, MMMM d, yyyy').format(DateTime.now()),
+        ),
+      ) {
+    on<SelectItineraryDateEvent>((event, emit) {
+      emit(SelectItineraryDateState(event.date));
+    });
+  }
+}

lib/itinerary_creation/views/itinerary_creation_steps/date_selection_view.dart

@@ -1,9 +1,11 @@
 import 'package:citycards_customer/common_packages/custom_filled_button.dart';
 import 'package:citycards_customer/common_packages/custom_text.dart';
+import 'package:citycards_customer/itinerary_creation/bloc/date_selection_bloc.dart';
 import 'package:citycards_customer/itinerary_creation/bloc/itinerary_steps_selection_bloc.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:intl/intl.dart';
 
 class DateSelectionView extends StatelessWidget {
   const DateSelectionView({super.key});
@@ -34,16 +36,24 @@ class DateSelectionView extends StatelessWidget {
               border: Border.all(color: Color(0xFFF95F62), width: 1.1.w),
             ),
             child: Row(
-              mainAxisAlignment: MainAxisAlignment.spaceBetween,
               children: [
-                Image.asset("assets/icons/calender.png", scale: 4),
+                GestureDetector(
-
+                  onTap: () {
-                CustomText(
+                    _pickDate(context);
-                  text: "Wednesday, October 15, 2025",
+                  },
-                  size: 14.sp,
+                  child: Image.asset("assets/icons/calender.png", scale: 4),
-                  color: Color(0xFF101828),
                 ),
-
+                SizedBox(width: 16.w,),
+                BlocBuilder<UpdateSelectedDateBloc, SelectItineraryDateState>(
+                  builder: (context, state) {
+                    return CustomText(
+                      text: state.selectedDate,
+                      size: 14.sp,
+                      color: Color(0xFF101828),
+                    );
+                  },
+                ),
+                const Spacer(),
                 Icon(Icons.check_circle, color: Color(0xFFF95F62)),
               ],
             ),
@@ -62,4 +72,36 @@ class DateSelectionView extends StatelessWidget {
       ),
     );
   }
+
+  Future<void> _pickDate(BuildContext context) async {
+    final DateTime? picked = await showDatePicker(
+      context: context,
+      // initialDate: ,
+      firstDate: DateTime.now().subtract(const Duration(days: 0)),
+      lastDate: DateTime.now().add(const Duration(days: 365 * 3)),
+      builder: (context, child) {
+        return Theme(
+          data: Theme.of(context).copyWith(
+            colorScheme: const ColorScheme.light(
+              primary: Color(0xFFF95F62),
+              onPrimary: Colors.white,
+              onSurface: Color(0xFF101828),
+            ),
+            textButtonTheme: TextButtonThemeData(
+              style: TextButton.styleFrom(
+                foregroundColor: const Color(0xFFF95F62),
+              ),
+            ),
+          ),
+          child: child!,
+        );
+      },
+    );
+    if (picked != null) {
+      final formattedDate = DateFormat('EEEE, MMMM d, y').format(picked);
+      context.read<UpdateSelectedDateBloc>().add(
+        SelectItineraryDateEvent(formattedDate),
+      );
+    }
+  }
 }

lib/itinerary_creation/views/itinerary_creation_view.dart

@@ -1,3 +1,4 @@
+import 'package:citycards_customer/itinerary_creation/bloc/date_selection_bloc.dart';
 import 'package:citycards_customer/itinerary_creation/bloc/itinerary_steps_selection_bloc.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
@@ -101,7 +102,11 @@ class _ItineraryCreationPageState extends State<ItineraryCreationPage> {
                         controller: _pageController,
                         physics: const NeverScrollableScrollPhysics(),
                         children: [
-                          DateSelectionView(),
+                          BlocProvider(create: (_){
+                            return UpdateSelectedDateBloc();
+                          },
+                          child: DateSelectionView(),
+                          ),
                           CitySelectionView(),
                           EnergySelectionView(),
                           KidsSelectionView(),

lib/main.dart

@@ -29,7 +29,7 @@ class MyApp extends StatelessWidget {
       builder: (context, child) {
         return MaterialApp(
           onGenerateRoute: _appRouter.onGenerateRoute,
-          initialRoute: RouteConstants.itineraryCreationStart,
+          initialRoute: RouteConstants.hotelOffer,
           debugShowCheckedModeBanner: false,
           title: 'City Cards',
           theme: ThemeData(

pubspec.lock

@@ -139,6 +139,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "4.1.2"
+  intl:
+    dependency: "direct main"
+    description:
+      name: intl
+      sha256: "3df61194eb431efc39c4ceba583b95633a403f46c9fd341e550ce0bfa50e9aa5"
+      url: "https://pub.dev"
+    source: hosted
+    version: "0.20.2"
   leak_tracker:
     dependency: transitive
     description:

pubspec.yaml

@@ -37,6 +37,7 @@ dependencies:
   # Use with the CupertinoIcons class for iOS style icons.
   cupertino_icons: ^1.0.8
   flutter_screenutil: ^5.9.3
+  intl: ^0.20.2
 
 dev_dependencies:
   flutter_test: