import 'package:ernaehrung/web/mobile.dart';
import 'package:flutter/material.dart';
import 'package:sizer/sizer.dart';

class WebApp extends StatelessWidget {
  const WebApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Sizer(
      builder: (context, orientation, deviceType) {
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          title: 'Sizer',
          theme: ThemeData.light(),
          home: const HomeScreen() ,
        );
      },
    );
  }
}

class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {

  bool isDesktop(BuildContext context) => MediaQuery.of(context).size.width >= 1028;
  bool isTablet(BuildContext context) =>
      MediaQuery.of(context).size.width >= 768 && MediaQuery.of(context).size.width <= 1027;
  bool isMobile(BuildContext context) => MediaQuery.of(context).size.width <= 767;

  Widget getDeviceType(context){
    if(isDesktop(context)){
      return const Text("Desktop");
    }else if(isTablet(context)){
      return const Text("Tablet");
    }else if(isMobile(context)){
      return const MobileScreen();
    }

    return const SizedBox.shrink();
  }

  @override
  Widget build(BuildContext context) {
    return  Scaffold(
        body: Row(
          children: [
            getDeviceType(context),
          ],
        )
    );
  }
}