import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      home: Material(child: MyStatefulWidget())
    )
  );
  
}

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

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  bool toggleOuterColor = true;
  bool toggleInnerColor = true;

  @override
  Widget build(BuildContext context) {
    return Center(
        child: Listener(
          onPointerDown: (_) {
            setState(() {
              toggleOuterColor = !toggleOuterColor;
            });
          },
          child: Container(
            width: 200, height: 200,
            color: toggleOuterColor ? Colors.amber : Colors.amber.shade900,
            child: Center(
              // child: Container(width: 100, height: 100, color: Colors.black)
              child: Listener(
                onPointerDown: (_) {
                  setState(() {
                    toggleInnerColor = !toggleInnerColor;
                  });
                },
                child: Container(
                  width: 100, height: 100,
                  color: toggleInnerColor ? Colors.blue : Colors.blue.shade800,
                )
              )
            )
          )
        )
      );
  }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.