Update modules/semantic/semantic_live_interface.py

modules/semantic/semantic_live_interface.py

@@ -112,7 +112,7 @@ def display_semantic_live_interface(lang_code, nlp_models, semantic_t):
                         st.warning(semantic_t.get('text_changed_warning', 
                             'El texto ha cambiado. Presione Analizar para actualizar los resultados.'))
 
-                    # Mostrar conceptos clave en formato horizontal
+# Mostrar conceptos clave en formato horizontal
                     if 'key_concepts' in analysis and analysis['key_concepts']:
                         st.markdown("""
                             <style>
@@ -120,10 +120,10 @@ def display_semantic_live_interface(lang_code, nlp_models, semantic_t):
                                 display: flex;
                                 flex-wrap: wrap;
                                 gap: 10px;
-                                margin-bottom: 20px;
                                 padding: 10px;
                                 background-color: #f8f9fa;
-                                border-radius: 8px;
+                                border-radius: 8px 8px 0 0;
+                                margin-bottom: 0;
                             }
                             .concept-item {
                                 background-color: white;
@@ -142,9 +142,27 @@ def display_semantic_live_interface(lang_code, nlp_models, semantic_t):
                                 color: #6b7280;
                                 font-size: 0.9em;
                             }
+                            .graph-container {
+                                background-color: white;
+                                border-radius: 0 0 10px 10px;
+                                padding: 20px;
+                                box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+                                margin-top: 0;
+                                min-height: 400px;
+                            }
+                            .results-container {
+                                background-color: white;
+                                border-radius: 10px;
+                                overflow: hidden;
+                                box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+                            }
                             </style>
                         """, unsafe_allow_html=True)
 
+                        # Iniciar contenedor principal
+                        st.markdown('<div class="results-container">', unsafe_allow_html=True)
+
+                        # Crear la visualización horizontal de conceptos
                         concepts_html = ['<div class="concept-table">']
                         concepts_html.extend(
                             f'<div class="concept-item"><span class="concept-name">{concept}</span>'
@@ -155,22 +173,10 @@ def display_semantic_live_interface(lang_code, nlp_models, semantic_t):
                         
                         st.markdown(''.join(concepts_html), unsafe_allow_html=True)
 
-                    # Mostrar gráfico de conceptos en un contenedor fijo
+                    # Mostrar gráfico de conceptos en el mismo contenedor
                     if 'concept_graph' in analysis and analysis['concept_graph'] is not None:
                         with st.container():
-                            st.markdown("""
-                                <style>
-                                .graph-container {
-                                    background-color: white;
-                                    border-radius: 10px;
-                                    padding: 20px;
-                                    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-                                    margin: 10px 0;
-                                    min-height: 400px;
-                                }
-                                </style>
-                                <div class="graph-container">
-                            """, unsafe_allow_html=True)
+                            st.markdown('<div class="graph-container">', unsafe_allow_html=True)
                             
                             st.image(
                                 analysis['concept_graph'],
@@ -180,8 +186,6 @@ def display_semantic_live_interface(lang_code, nlp_models, semantic_t):
                                     'Visualización de relaciones entre conceptos clave identificados en el texto.'
                                 )
                             )
-                            
-                            st.markdown('</div>', unsafe_allow_html=True)
 
                             # Contenedor para botones en la parte inferior del gráfico
                             button_col, spacer_col = st.columns([1,4])
@@ -202,10 +206,8 @@ def display_semantic_live_interface(lang_code, nlp_models, semantic_t):
                                     - ⭕ El tamaño de los nodos representa la frecuencia del concepto
                                     - ↔️ El grosor de las líneas indica la fuerza de la conexión
                                 """)
-                    else:
-                        st.info(semantic_t.get('no_graph', 'No graph available'))
-
-    except Exception as e:
-        logger.error(f"Error general en interfaz semántica en vivo: {str(e)}")
-        st.error(semantic_t.get('general_error', "Se produjo un error. Por favor, intente de nuevo."))
+                            
+                            st.markdown('</div>', unsafe_allow_html=True)
 
+                        # Cerrar el contenedor principal
+                        st.markdown('</div>', unsafe_allow_html=True)