syncrow-web/lib/pages/home/view/home_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
import 'package:syncrow_web/pages/home/view/home_card.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/web_layout/web_scaffold.dart';

class HomePage extends StatelessWidget {
   HomePage({super.key});
  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return WebScaffold(
      enableMenuSideba:false ,
      appBarTitle: Row(
        children: [
          SvgPicture.asset(
            Assets.loginLogo,
            width: 150,
          ),
        ],
      ),
      scaffoldBody: BlocProvider(
        create: (context) => HomeBloc(),
        child: SizedBox(
          height: size.height,
          width: size.width,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              SizedBox(height: size.height * 0.1),
              const Text(
                'ACCESS YOUR APPS',
                style: TextStyle(fontSize: 40, fontWeight: FontWeight.w700),
              ),
              const SizedBox(height: 30),
              Expanded(
                flex: 4,
                child: SizedBox(
                  height: size.height * 0.6,
                  width: size.width * 0.68,
                  child: GridView.builder(
                    itemCount: 8,
                    gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 4,
                      crossAxisSpacing: 20.0,
                      mainAxisSpacing: 20.0,
                      childAspectRatio: 1.5,
                    ),
                    itemBuilder: (context, index) {
                      return  HomeCard(
                        index:index,
                        active:ceilingSensorButtons[index]['active'],
                        name: ceilingSensorButtons[index]['title'],
                        img:ceilingSensorButtons[index]['icon'] ,
                        onTap: () {

                       },);
                    },
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

   dynamic ceilingSensorButtons =
      [
        {
          'title': 'Access',
          'icon': Assets.accessIcon,
          'active': true,
        },
        {
          'title': 'Space\nManagement',
          'icon': Assets.spaseManagementIcon,
          'color': ColorsManager.primaryColor,
          'active': true,
        },
        {
          'title': 'Devices',
          'icon':Assets.devicesIcon,
          'active': true,
        },
        {
          'title': 'Move in',
          'icon': Assets.moveinIcon,
          'active': false,
        },
        {
          'title': 'Construction',
          'icon': Assets.constructionIcon,
          'active': false,
        },
        {
          'title': 'Energy',
          'icon': Assets.energyIcon,
          'color': ColorsManager.slidingBlueColor.withOpacity(0.2),
          'active': false,
        },
        {
          'title': 'Integrations',
          'icon': Assets.integrationsIcon,
          'color': ColorsManager.slidingBlueColor.withOpacity(0.2),
          'active': false,
        },    {
          'title': 'Asset',
          'icon': Assets.assetIcon,
          'color': ColorsManager.slidingBlueColor.withOpacity(0.2),
          'active': false,
        },
      ];
}