import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:nearle/views/helpers/constants/Colorconstants.dart';
import 'package:nearle/views/helpers/constants/Font_constant.dart';

class Intro1 extends GetResponsiveView {
 Intro1({super.key});

  @override
  Widget builder() {
    // 🔹 Use `screen.height` and `screen.width` safely here
    final height = screen.height;
    final width = screen.width;

    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.dark.copyWith(
        // Make the status bar area white instead of black, with dark icons
        statusBarColor: Colors.white,
        statusBarIconBrightness: Brightness.dark,
        statusBarBrightness: Brightness.light,
        systemNavigationBarColor: Colors.white,
      ),
      child: Scaffold(
        backgroundColor: Colors.white,

        appBar: PreferredSize(
          preferredSize: Size.fromHeight(height * 0.12),
          child: AppBar(
            automaticallyImplyLeading: false,
            backgroundColor: Colors.transparent,
            elevation: 0,
            systemOverlayStyle: SystemUiOverlayStyle.dark.copyWith(
              statusBarColor: Colors.white,
              statusBarIconBrightness: Brightness.dark,
              statusBarBrightness: Brightness.light,
              systemNavigationBarColor: Colors.white,
            ),
            flexibleSpace: Align(
              alignment: Alignment.topLeft,
              child: Container(
                height: height * 0.14,
                width: width * 0.25,
                decoration: BoxDecoration(
                  color: ColorConstants.primaryColor,
                  borderRadius: BorderRadius.only(
                    bottomRight: Radius.circular(width * 0.25),
                  ),
                ),
              ),
            ),
          ),
        ),

        body: SafeArea(
        child: Stack(
          children: [
            Positioned(
              bottom: -height * 0.12,
              left: -width * 0.1,
              right: -width * 0.1,
              child: Container(
                width: width * 1.2,
                height: height * 0.28,
                decoration: BoxDecoration(
                  color: const Color(0xFFF3EAF9),
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(width * 0.8),
                    topRight: Radius.circular(width * 0.8),
                  ),
                ),
              ),
            ),
            Center(
              child: Padding(
                padding: EdgeInsets.only(top: height * 0.08),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Column(
                      children: [
                        Transform.translate(
                          offset: Offset(0, -height * 0.08),
                          child: Text(
                            'Welcome to',
                            textAlign: TextAlign.center,
                            style: TextStyle(
                              fontSize: height * 0.045,
                              fontWeight: FontWeight.bold,
                              fontFamily: FontConstants.fontFamily,
                            ),
                          ),
                        ),
                        Transform.translate(
                          offset: Offset(0, -height * 0.1),
                          child: Text(
                            'Nearle !',
                            textAlign: TextAlign.center,
                            style: TextStyle(
                              fontSize: height * 0.045,
                              fontWeight: FontWeight.bold,
                              fontFamily: FontConstants.fontFamily,
                            ),
                          ),
                        ),
                      ],
                    ),
                    Transform.translate(
                      offset: Offset(0, -height * 0.08),
                      child: Text(
                        'Find delivery opportunities anytime,\nanywhere | Earn with ease!',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontSize: height * 0.022,
                          color: Colors.grey,
                          fontFamily: FontConstants.fontFamily,
                        ),
                      ),
                    ),
                    Transform.translate(
                      offset: Offset(0, -height * 0.09),
                      child: Image.asset(
                        'assets/images/intro1.png',
                        height: height * 0.35,
                        width: width * 0.75,
                        fit: BoxFit.contain,
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
        ),
      ),
    );
  }
}
