From 0242a7b968b1b4fa7a912eff46a82dd48258f0a2 Mon Sep 17 00:00:00 2001
From: IO420 <320154041@pcpuma.acatlan.unam.mx>
Date: Mon, 8 Sep 2025 15:06:01 -0400
Subject: [PATCH] fixed barnavigation state

---
 .../BarNavigation/BarNavigation.css           |  3 +-
 .../BarNavigation/BarNavigation.tsx           |  5 +++-
 app/Components/Header/Header.css              |  4 +--
 app/Impresiones/page.tsx                      | 28 +++++++++++++++++--
 app/globals.css                               |  2 +-
 5 files changed, 34 insertions(+), 8 deletions(-)

diff --git a/app/Components/BarNavigation/BarNavigation.css b/app/Components/BarNavigation/BarNavigation.css
index f82e516..0418e63 100644
--- a/app/Components/BarNavigation/BarNavigation.css
+++ b/app/Components/BarNavigation/BarNavigation.css
@@ -17,6 +17,7 @@
     color: white;
     font-weight: bold;
     width: 100%;
+    transition: background-color 0.3s ease;
 }
 
 .barNavigation li:hover {
@@ -65,7 +66,7 @@
     top: 100%;
     width: 100%;
     background-color: rgba(0, 61, 121, 1);
-    transition: max-height 0.3s ease, opacity 0.3s ease;
+    transition: color 0.3s ease, opacity 0.3s ease;
 }
 
 .subMenu.open ul {
diff --git a/app/Components/BarNavigation/BarNavigation.tsx b/app/Components/BarNavigation/BarNavigation.tsx
index a0a60ae..129bfdc 100644
--- a/app/Components/BarNavigation/BarNavigation.tsx
+++ b/app/Components/BarNavigation/BarNavigation.tsx
@@ -9,8 +9,11 @@ function BarNavigation() {
 
     const toggleMenu = () => setOpenMenu(!openMenu);
     const toggleSubMenu = (index: number) => {
-        setOpenSubMenu(openSubMenu === index ? null : index);
+        if (typeof window !== "undefined" && window.innerWidth <= 800) {
+            setOpenSubMenu(openSubMenu === index ? null : index);
+        }
     };
+    
     return (
         <nav className="barNavigation">
             <div
diff --git a/app/Components/Header/Header.css b/app/Components/Header/Header.css
index 86d608c..331acbc 100644
--- a/app/Components/Header/Header.css
+++ b/app/Components/Header/Header.css
@@ -25,8 +25,8 @@
     content: "";
     top: 0;
     left: -20px;
-    width: 30%;
-    height: 50%;
+    width: 70%;
+    height: 100%;
     min-width: 300px;
     background-color: #d59f0f;
     transform: skew(-45deg);
diff --git a/app/Impresiones/page.tsx b/app/Impresiones/page.tsx
index a6e0682..7bab7ad 100644
--- a/app/Impresiones/page.tsx
+++ b/app/Impresiones/page.tsx
@@ -44,8 +44,14 @@ export default function Page() {
             label: "Impresiones color",
             content: <Impressions
               costs={[
-                { value: 2 },
                 { value: 4 },
+                { value: 5 },
+                { value: 6 },
+                { value: 7 },
+                { value: 8 },
+                { value: 10 },
+                { value: 12 },
+                { value: 14 },
               ]}
             />,
           },
@@ -54,8 +60,23 @@ export default function Page() {
             label: "Plotter",
             content: <Impressions
               costs={[
-                { value: 1 },
-                { value: 2 },
+                { value: 15 },
+                { value: 18 },
+                { value: 20 },
+                { value: 25 },
+                { value: 30 },
+                { value: 40 },
+                { value: 45 },
+                { value: 50 },
+                { value: 60 },
+                { value: 70 },
+                { value: 80 },
+                { value: 90 },
+                { value: 100 },
+                { value: 110 },
+                { value: 120 },
+                { value: 150 },
+                { value: 200 },
               ]}
             />,
           },
@@ -66,6 +87,7 @@ export default function Page() {
               costs={[
                 { value: 1 },
                 { value: 2 },
+                { value: 5 },
               ]} 
               />,
           },
diff --git a/app/globals.css b/app/globals.css
index c37f161..1362030 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -77,7 +77,7 @@ footer {
 
 footer p {
   color: white;
-  max-width: 1150px;
+  max-width: 900px;
 }
 
 .container {