feat: use PinballButton to start the game (#288)

lib/game/view/widgets/play_button_overlay.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:pinball/game/pinball_game.dart';
 import 'package:pinball/l10n/l10n.dart';
 import 'package:pinball/select_character/select_character.dart';
+import 'package:pinball_ui/pinball_ui.dart';
 
 /// {@template play_button_overlay}
 /// [Widget] that renders the button responsible to starting the game
@@ -20,14 +21,12 @@ class PlayButtonOverlay extends StatelessWidget {
   Widget build(BuildContext context) {
     final l10n = context.l10n;
 
-    return Center(
+    return PinballButton(
-      child: ElevatedButton(
+      text: l10n.play,
-        onPressed: () async {
+      onTap: () async {
         _game.gameFlowController.start();
         await showCharacterSelectionDialog(context);
       },
-        child: Text(l10n.play),
-      ),
     );
   }
 }

packages/pinball_ui/lib/src/widgets/pinball_button.dart

@@ -21,7 +21,9 @@ class PinballButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return DecoratedBox(
+    return Material(
+      color: PinballColors.transparent,
+      child: DecoratedBox(
         decoration: BoxDecoration(
           image: DecorationImage(
             image: AssetImage(Assets.images.button.pinballButton.keyName),
@@ -45,6 +47,7 @@ class PinballButton extends StatelessWidget {
             ),
           ),
         ),
+      ),
     );
   }
 }