class GlassMorphism extends StatelessWidget {
  final double blur;
  final double opacity;
  final Widget child;

  const GlassMorphism({Key? key,
  required this.blur,
  required this.opacity,
  required this.child,
  }) : super(key : key);

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(20),
      child: BackdropFilter(
        filter: ImageFilter.blur(sigmaX: blur,sigmaY: blur),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white.withOpacity(opacity),
            borderRadius: const BorderRadius.all(Radius.circular(20)),
            border: Border.all(
              width: 1.5,
              color: Colors.white.withOpacity(0.2),
            ),
          ),
          child: child,
        ),
      ),
    );
  }
}

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

  @override
  State<CodeLess> createState() => _CodeLessState();
}

class _CodeLessState extends State<CodeLess> {
  bool isBlur = false;

  @override
  Widget build(BuildContext context){

      return Scaffold(
        backgroundColor: Colors.grey[300],
          body: Center(
            child: Stack(
              children: [
                Image.network("https://images.unsplash.com/photo-1633534855355-bfe52ee56d75?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80"
                              ,fit: BoxFit.cover,height: double.infinity,),
                Center(
                  child: GestureDetector(
                    onTap: (){
                      setState(() {
                        isBlur = !isBlur;
                      });
                    },
                    child: GlassMorphism(
                      blur: isBlur ? 0 : 10,
                      opacity: 0.2,
                      child: const SizedBox(
                        height: 210,
                        width: 320,
                      ),
                    ),
                  ),
                )
              ],
            ),
          )
      );
  }
}