Dev Wind

anemui-core/css/graphcontainer.scss

@@ -1,18 +1,37 @@
 div.GraphContainer {
     @include bgFrame(12px);
-    
-    position: absolute;
+
+    position: fixed;
     left: 50%;
-    top: 30%;
-    transform: translate(-50%, -30%);
+    top: 50%;
+    transform: translate(-50%, -50%);
     padding: 0.8em 1.5em;
-    background-color: rgba(255, 255, 255, 1);
+    background-color: rgba(255, 255, 255, 0.98);
     background: white;
     color: #333;
     box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
     z-index: 2000;
     width: fit-content;
-    position: relative;
+    max-width: 90vw;
+    max-height: 85vh;
+    overflow: auto;
+    cursor: move;
+
+    // Responsive para pantallas pequeñas
+    @media (max-width: 768px) {
+        left: 5%;
+        top: 10%;
+        transform: none;
+        max-width: 90vw;
+        padding: 0.5em 1em;
+    }
+
+    @media (max-width: 480px) {
+        left: 2%;
+        top: 5%;
+        max-width: 96vw;
+        padding: 0.3em 0.5em;
+    }
 
     a.popup-close-button {
         position: absolute;
@@ -67,7 +86,8 @@ div.GraphContainer {
 
     .dygraph-legend {
         text-align: center;
-        width: 1024px;
+        width: 100% !important;
+        max-width: 100%;
         background-color: transparent !important;
         left: 0px !important;
     }

anemui-core/css/open-layers-map.scss

@@ -1,5 +1,12 @@
 @import "~ol/ol.css";
 
+// Desactivar suavizado solo para la capa de incertidumbre
+.uncertainty-layer canvas {
+  image-rendering: pixelated;
+  image-rendering: -moz-crisp-edges;
+  image-rendering: crisp-edges;
+}
+
 // .marker {
 //   width: 20px;
 //   height: 20px;

anemui-core/css/sidebar.scss

@@ -580,16 +580,15 @@ ul .two-columns {
 /* ---------------------------------------------------
     SELECTORES DE CAPAS
 ----------------------------------------------------- */
-
 div.row.selectDiv{
-    width: 260px;
-    margin: 0.45rem 0rem; 
+    width: 240px;
+    margin: 0.45rem 0rem;
 }
 
 .uncDiv input.form-check-input {
     visibility: visible;
     margin: 0px auto;
-    width: 4rem !important; 
+    width: 4rem !important;
     height: 2rem !important;
     background-color: $color_8;
     box-shadow: 0.5px 0.5px 3px $color_3;
@@ -632,6 +631,11 @@ div.slider.visible {
     display: none;
 }
 
+.uncDiv .inputDiv {
+    background-color: transparent !important;
+    box-shadow: none !important;
+}
+
 .closeDiv .icon {
     height: 30px;
     width: 30px;
@@ -699,58 +703,6 @@ div.slider.visible {
     }
 }
 
-/* ---------------------------------------------------
-    ESTILOS POPOVERS
------------------------------------------------------ */
-
-/* .popover {
-    max-width: 40% !important;
-    background-color: $color_8;
-    border-color: $color_4;
-    font-size: 0.75rem; 
-    margin-left: 1.25rem !important;
-    z-index: 1500;
-
-    @include tablet {
-        max-width: 60% !important;
-        font-size: 0.875rem;
-        margin-left: 1rem !important;
-    }
-
-    @include mobile {
-        max-width: 90% !important;
-        font-size: 1rem;
-        margin-left: 0.5rem !important;
-    }
-}
-
-.popover-header {
-    color: $title_color;
-    background-color: $title_bgcolor;
-}
-
-.popover-body {
-    color: $color_4 !important;
-} */
-
-.popover {
-    max-width: 40% !important;
-    background-color: $color_8;
-    border-color: $color_4;
-    font-size: 12px;
-    margin-left: 20px !important;
-    z-index: 1500;
-}
-
-.popover-header {
-    color: $title_color;
-    background-color: $title_bgcolor;
-}
-
-.popover-body {
-    color: $color_4 !important;
-}
-
 @media (max-width: 768px) {
     .side-bar {
         min-width: 80px;