actualizacion

.vscode/settings.json

@@ -0,0 +1,22 @@
+{
+    "workbench.colorCustomizations": {
+        "activityBar.activeBackground": "#4e3b40",
+        "activityBar.background": "#4e3b40",
+        "activityBar.foreground": "#e7e7e7",
+        "activityBar.inactiveForeground": "#e7e7e799",
+        "activityBarBadge.background": "#000000",
+        "activityBarBadge.foreground": "#e7e7e7",
+        "commandCenter.border": "#e7e7e799",
+        "sash.hoverBorder": "#4e3b40",
+        "statusBar.background": "#312528",
+        "statusBar.foreground": "#e7e7e7",
+        "statusBarItem.hoverBackground": "#4e3b40",
+        "statusBarItem.remoteBackground": "#312528",
+        "statusBarItem.remoteForeground": "#e7e7e7",
+        "titleBar.activeBackground": "#312528",
+        "titleBar.activeForeground": "#e7e7e7",
+        "titleBar.inactiveBackground": "#31252899",
+        "titleBar.inactiveForeground": "#e7e7e799"
+    },
+    "peacock.color": "#312528"
+}

app/cuadros.js

@@ -28,7 +28,7 @@ const Cuadrado = ({ valor, alHcerClick }) => {
             onMouseLeave={handleMouseLeave}
         >
             <button
-                className="w-full h-full  text-black  border border-gray-500 text-2xl font-exterabold flex items-center justify-center bg-blue-300 rounded-xl"
+                className="w-full h-full  text-black  border border-gray-500 text-2xl font-exterabold flex items-center border-4 border-black justify-center bg-blue-900 rounded-xl"
                 onClick={() => setShowMenu(true)}
                 disabled={valor !== ''}
             >

app/globals.css

@@ -9,7 +9,7 @@
 
 @media (prefers-color-scheme: dark) {
   :root {
-    --background:  #ededed;
+    --background:  #ffffff;
     --foreground: #ededed;
   }
 }

app/tablero.js

@@ -1,4 +1,3 @@
-
 'use client'; 
 
 import { useState } from "react";
@@ -21,7 +20,7 @@ const Tablero = () => {
 
     return (
         <>
-            <h1 className="px-5 text-5xl font-extrabold text-white text-center mt-20">Totito</h1> {/* Titulo */}
+            <h1 className="px-5 text-5xl font-extrabold text-black text-center mt-20">Totito</h1> {/* Titulo */}
             <div className="mt-10 p-5 grid grid-cols-3 gap-4 items-center">
                 {
                 cuadros.map((items, indexItem) => (