Update modules/discourse/discourse_interface.py

modules/discourse/discourse_interface.py

@@ -152,6 +152,7 @@ def display_discourse_results(result, lang_code, discourse_t):
             border-radius: 8px;
             overflow-x: auto;
             margin-bottom: 15px;
+            white-space: nowrap;
         }
         .concept-item {
             background-color: white;
@@ -162,6 +163,7 @@ def display_discourse_results(result, lang_code, discourse_t):
             gap: 4px;
             box-shadow: 0 1px 2px rgba(0,0,0,0.1);
             flex-shrink: 0;
+            min-width: fit-content;
         }
         .concept-name {
             font-weight: 500;
@@ -189,23 +191,23 @@ def display_discourse_results(result, lang_code, discourse_t):
         with st.expander(discourse_t.get('doc1_title', 'Documento 1'), expanded=True):
             st.subheader(discourse_t.get('key_concepts', 'Conceptos Clave'))
             if 'key_concepts1' in result:
-                # Crear HTML para conceptos horizontales
-                concepts_html = '<div class="concepts-container">'
-                for concept, freq in result['key_concepts1']:
-                    concepts_html += f"""
-                        <div class="concept-item">
-                            <span class="concept-name">{concept}</span>
-                            <span class="concept-freq">({freq:.2f})</span>
-                        </div>
-                    """
-                concepts_html += '</div>'
+                # Crear HTML para conceptos horizontales de manera más compacta
+                concepts_html = f"""
+                    <div class="concepts-container">
+                        {''.join([
+                            f'<div class="concept-item"><span class="concept-name">{concept}</span>'
+                            f'<span class="concept-freq">({freq:.2f})</span></div>'
+                            for concept, freq in result['key_concepts1']
+                        ])}
+                    </div>
+                """
                 st.markdown(concepts_html, unsafe_allow_html=True)
 
+                # Mostrar grafo
                 if 'graph1' in result:
-                    with st.container():
-                        st.markdown('<div class="graph-container">', unsafe_allow_html=True)
-                        st.pyplot(result['graph1'])
-                        st.markdown('</div>', unsafe_allow_html=True)
+                    st.markdown('<div class="graph-container">', unsafe_allow_html=True)
+                    st.pyplot(result['graph1'])
+                    st.markdown('</div>', unsafe_allow_html=True)
                 else:
                     st.warning(discourse_t.get('graph_not_available', 'Gráfico no disponible'))
             else:
@@ -216,23 +218,23 @@ def display_discourse_results(result, lang_code, discourse_t):
         with st.expander(discourse_t.get('doc2_title', 'Documento 2'), expanded=True):
             st.subheader(discourse_t.get('key_concepts', 'Conceptos Clave'))
             if 'key_concepts2' in result:
-                # Crear HTML para conceptos horizontales
-                concepts_html = '<div class="concepts-container">'
-                for concept, freq in result['key_concepts2']:
-                    concepts_html += f"""
-                        <div class="concept-item">
-                            <span class="concept-name">{concept}</span>
-                            <span class="concept-freq">({freq:.2f})</span>
-                        </div>
-                    """
-                concepts_html += '</div>'
+                # Crear HTML para conceptos horizontales de manera más compacta
+                concepts_html = f"""
+                    <div class="concepts-container">
+                        {''.join([
+                            f'<div class="concept-item"><span class="concept-name">{concept}</span>'
+                            f'<span class="concept-freq">({freq:.2f})</span></div>'
+                            for concept, freq in result['key_concepts2']
+                        ])}
+                    </div>
+                """
                 st.markdown(concepts_html, unsafe_allow_html=True)
 
+                # Mostrar grafo
                 if 'graph2' in result:
-                    with st.container():
-                        st.markdown('<div class="graph-container">', unsafe_allow_html=True)
-                        st.pyplot(result['graph2'])
-                        st.markdown('</div>', unsafe_allow_html=True)
+                    st.markdown('<div class="graph-container">', unsafe_allow_html=True)
+                    st.pyplot(result['graph2'])
+                    st.markdown('</div>', unsafe_allow_html=True)
                 else:
                     st.warning(discourse_t.get('graph_not_available', 'Gráfico no disponible'))
             else:
@@ -240,4 +242,4 @@ def display_discourse_results(result, lang_code, discourse_t):
 
     # Nota informativa sobre la comparación
     st.info(discourse_t.get('comparison_note', 
-        'La funcionalidad de comparación detallada estará disponible en una próxima actualización.'))
+        'La funcionalidad de comparación detallada estará disponible en una próxima actualización.'))