{nextPiece.shape.map((row, rowIndex) =>
row.map((cell, colIndex) => (
))
@@ -254,11 +255,45 @@ export const MobileNextPiece = ({ nextPiece }) => {
);
};
+/**
+ * Mobile Clear Stats Component
+ * Shows singles, doubles, triples, maple blocks in a compact horizontal layout
+ */
+export const MobileClearStats = ({ linesCleared }) => {
+ return (
+
+
+
+ 🎯Clears:
+
+
+
+
1x
+
{linesCleared.single}
+
+
+
2x
+
{linesCleared.double}
+
+
+
3x
+
{linesCleared.triple}
+
+
+
🍁
+
{linesCleared.quad}
+
+
+
+
+ );
+};
+
/**
* Mobile Layout Wrapper Component
* Handles the overall mobile layout structure
*/
-export const MobileLayout = ({
+export const MobileLayout = ({
gameState,
showMobileMenu,
onMenuToggle,
@@ -271,25 +306,26 @@ export const MobileLayout = ({
return (
-
+
{/* Mobile Header */}
-
- {/* Next Piece */}
-
+ {/* Next Piece and Clear Stats - Always visible */}
+
+
{/* Game Board and Controls */}
{children}
{/* Mobile Stats Modal */}
-