import 'package:flutter/material.dart';
import 'package:vrouter/vrouter.dart';

class MesaiciNavigasyon extends StatelessWidget {
  const MesaiciNavigasyon({super.key});

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 24.0,
      child: ListView(
        shrinkWrap: true,
        physics: const BouncingScrollPhysics(),
        scrollDirection: Axis.horizontal,
        children: [
          SizedBox(
            // width: 50,
            child: MaterialButton(
              elevation: 0,
              minWidth: 0,
              shape: RoundedRectangleBorder(
                borderRadius: const BorderRadius.all(Radius.circular(5)),
                side: BorderSide(
                    width: 0,
                    color: Colors.blue.withOpacity(0.5),
                    style: BorderStyle.none),
              ),
              color: context.vRouter.url == "/mesaici"
                  ? Colors.tealAccent.shade700
                  : Colors.transparent,
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 0),
              child: Text(
                "🎛️ Pano",
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w400,
                  color: context.vRouter.url == "/mesaici"
                      ? Colors.white
                      : Colors.teal,
                ),
              ),
              // const Icon(Icons.home,
              //     color: Colors.lightBlue, size: 14),
              // color: Colors.white,
              onPressed: () async {
                context.vRouter.to("/mesaici");
              },
            ),
          ),
          const SizedBox(width: 3),
          SizedBox(
            // width: 50,
            child: MaterialButton(
              elevation: 0,
              minWidth: 0,
              shape: RoundedRectangleBorder(
                borderRadius: const BorderRadius.all(Radius.circular(5)),
                side: BorderSide(
                    width: 0,
                    color: Colors.blue.withOpacity(0.5),
                    style: BorderStyle.none),
              ),
              color: context.vRouter.url == "/mesaici/hareketler"
                  ? Colors.tealAccent.shade700
                  : Colors.transparent,
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 0),
              child: Text(
                "📟 Hareketler",
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w400,
                  color: context.vRouter.url == "/mesaici/hareketler"
                      ? Colors.white
                      : Colors.teal,
                ),
              ),
              // const Icon(Icons.home,
              //     color: Colors.lightBlue, size: 14),
              // color: Colors.white,
              onPressed: () async {
                context.vRouter.to("/mesaici/hareketler");
                // Scaffold.of(context).openEndDrawer();
              },
            ),
          ),
          const SizedBox(width: 5),
          SizedBox(
            // width: 50,
            child: MaterialButton(
              elevation: 0,
              minWidth: 0,
              shape: RoundedRectangleBorder(
                borderRadius: const BorderRadius.all(Radius.circular(5)),
                side: BorderSide(
                    width: 0,
                    color: Colors.blue.withOpacity(0.5),
                    style: BorderStyle.none),
              ),
              color: context.vRouter.url == "/mesaici/raporlar"
                  ? Colors.tealAccent.shade700
                  : Colors.transparent,
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 0),
              child: Text(
                "📝 Raporlar",
                style: TextStyle(
                  fontSize: 12,
                  fontWeight: FontWeight.w400,
                  color: context.vRouter.url == "/mesaici/raporlar"
                      ? Colors.white
                      : Colors.teal,
                ),
              ),
              // const Icon(Icons.home,
              //     color: Colors.lightBlue, size: 14),
              // color: Colors.white,
              onPressed: () async {
                context.vRouter.to("/mesaici/raporlar");
                // Scaffold.of(context).openEndDrawer();
              },
            ),
          ),
          const SizedBox(width: 5),
        ],
      ),
    );
  }
}