Update app.py

app.py

@@ -16,8 +16,8 @@ def generate_headlines(number_of_headlines, target_audience, product, temperatur
     # Llama a la API de Claude para generar titulares
     message = client.messages.create(
         model="claude-3-5-sonnet-20240620",
-        max_tokens=2500,
-        temperature=temperature,
+        max_tokens=4000,  # Cambiado a 4000 tokens
+        temperature=temperature,  # Usa el valor del slider aquí
         system="You are a world-class copywriter, with experience in creating hooks, headlines, and subject lines that immediately capture attention. Your skill lies in deeply understanding the emotions, desires, and challenges of a specific audience, allowing you to design personalized marketing strategies that resonate and motivate action. You know how to use proven structures to attract your target audience, generating interest and achieving a powerful connection that drives desired results in advertising and content campaigns.\n\nAnswer in Spanish.",
         messages=[
             {
@@ -37,47 +37,31 @@ def generate_headlines(number_of_headlines, target_audience, product, temperatur
 def gradio_generate_headlines(number_of_headlines, target_audience, product, temperature):
     return generate_headlines(number_of_headlines, target_audience, product, temperature)
 
-# Define los colores de la interfaz según el logo de Anthropic (ejemplo)
-logo_colors = {
-    "background": "#f8f8f8",
-    "primary": "#2c7be5",
-    "text_color": "#212529"
-}
-
-with gr.Blocks(css=f"""
-    .gradio-container {{ background-color: {logo_colors["background"]}; }}
-    .headline-output {{ text-align: left; white-space: pre-line; }}
-    .gradio-slider .slider-container {{ margin: 20px 0; }}
-    .gradio-column {{ margin: 20px; }}
-""") as demo:
+with gr.Blocks(css=".gradio-container { background-color: #f8f8f8; }") as demo:
     gr.Markdown(
-        f"""
-        <h1 style="color: {logo_colors['primary']}; text-align: center;">Generador de Titulares</h1>
-        <p style="color: {logo_colors['text_color']}; text-align: center;">Usa el poder de Claude AI para crear titulares atractivos</p>
+        """
+        <h1 style="color: #2c7be5; text-align: center;">Generador de Titulares</h1>
+        <p style="color: #212529; text-align: center;">Usa el poder de Claude AI para crear titulares atractivos</p>
         """
     )
-    
+
     with gr.Row():
-        with gr.Column(scale=1):
-            number_of_headlines = gr.Dropdown(
-                label="Número de Titulares",
-                choices=[i for i in range(1, 11)],
-                value=5
-            )
+        with gr.Column():
+            number_of_headlines = gr.Dropdown(choices=[str(i) for i in range(1, 11)], label="Número de Titulares", value="5")
             target_audience = gr.Textbox(label="Público Objetivo", placeholder="Ejemplo: Estudiantes Universitarios")
             product = gr.Textbox(label="Producto", placeholder="Ejemplo: Curso de Inglés")
-            temperature = gr.Slider(
-                minimum=0,
-                maximum=1,
-                value=0,
-                step=0.1,
-                label="Temperature",
-                interactive=True
+            temperature = gr.Slider(minimum=0, maximum=1, value=0, step=0.1, label="Creatividad")
+            submit_btn = gr.Button("Generar Titulares")
+        
+        with gr.Column(scale=2):
+            output = gr.HTML(
+                """
+                <div id="result-container" style="background-color: #ffffff; padding: 10px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);">
+                    <p id="result-text" style="font-size: 16px; color: #333333;">Los titulares aparecerán aquí...</p>
+                </div>
+                """,
+                label="Titulares Generados"
             )
-        with gr.Column(scale=1):
-            submit_btn = gr.Button("Generar Titulares", elem_id="submit-btn")
-
-    output = gr.Textbox(label="Titulares Generados", lines=10)
 
     submit_btn.click(
         fn=gradio_generate_headlines,