import 'package:flutter/material.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/common_widgets/app_filled_button.dart';

class SwipeSuccessView extends StatelessWidget {
  static const routeName = '/swipe_success_view';

  const SwipeSuccessView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                // 'swipe_success'.toSvgAsset(),
                Container(
                  padding: const EdgeInsets.all(20),
                  width: 150.toScreenWidth,
                  height: 150.toScreenHeight,
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    color: AppColor.background(context),
                  ),
                  child: 'swipe'.toSvgAsset(width: 24, height: 24, color: AppColor.green70),
                ),
                17.height,
                Text(
                  context.translation.successful,
                  style: AppTextStyles.heading4.copyWith(color: AppColor.headingTextColor(context)),
                ),
                8.height,
                Text(
                  context.translation.youHaveSuccessfullyMarkedYourAttendance,
                  style: AppTextStyles.bodyText2.copyWith(color: AppColor.lightTextColor(context)),
                ),
              ],
            ).expanded,
            AppFilledButton(
              label: 'Close',
              maxWidth: true,
              onPressed: () {
                Navigator.pop(context);
              },
            ),
          ],
        ).paddingAll(21),
      ),
    );
  }
}

// ClipOval(
//   child: Container(
//      color: Colors.grey.withOpacity(0.2),
//     padding: const EdgeInsets.all(10),
//     child: ClipOval(
//       child: Container(
//         color: AppColor.white.withOpacity(0.2),
//         padding: const EdgeInsets.all(10),
//         child: ClipOval(
//           child: Container(
//             color: AppColor.white,
//             child: 'success_swipe'.toSvgAsset().paddingAll(50),
//           ),
//         ).paddingAll(20),
//       ),
//     ),
//   ),
// )
