Update app.py

app.py

@@ -13,8 +13,13 @@ p = pipeline("automatic-speech-recognition")
 os.environ["OPENAI_API_KEY"] = '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'
 
 css = """
+.gradio-container {
+    background-color: #ffffff;
+}
+    
 #component-2 {position: absolute; bottom: 0;    width: 100%;
 }
+
 div.float.svelte-1frtwj3 {
     position: absolute;
     opacity: 0;
@@ -25,11 +30,8 @@ div.float.svelte-1frtwj3 {
     height: 100%;
     max-height: 100%;
     overflow-y: auto;
-    }
-.bot.svelte-6roggh.svelte-6roggh, .pending.svelte-6roggh.svelte-6roggh {
-    border-color: #759ce9;
-    background: #ffffff;
 }
+
 div.svelte-1frtwj3 {
     display: inline-flex;
     align-items: center;
@@ -47,24 +49,80 @@ div.svelte-1frtwj3 {
     width: 100%;
     line-height: var(--line-sm);
     }
-div.svelte-awbtu4 {
+
+div.bot.svelte-6roggh.svelte-6roggh {
+    background: #199FDA;
+}
+
+div.bot.svelte-17nzccn.svelte-17nzccn {
+    background: #199FDA;
+}
+
+div.user.svelte-6roggh.svelte-6roggh {
+    background: #0D1233;
+}
+
+div.user.svelte-17nzccn.svelte-17nzccn {
+    background: #0D1233;
+}    
+
+div.textBoxBot {
     display: flex;
     flex-direction: inherit;
     flex-wrap: wrap;
     gap: var(--form-gap-width);
     box-shadow: var(--block-shadow);
-    border: var(--block-border-width) solid var(--border-color-primary);
+    border: var(--block-border-width) solid #0D1233;
     border-radius: var(--radius-lg);
-    background: var(--border-color-primary);
+    background: #ffffff;
     overflow: hidden;
     position: fixed;
     bottom: 0;
     margin-left: -16px;
 }
-img.svelte-ms5bsk {
-    width: var(--size-full);
-    height: 90px;
-    object-fit: contain;
+
+.textarea.svelte-1pie7s6.svelte-1pie7s6 {
+    display: flex;
+    flex-direction: inherit;
+    flex-wrap: wrap;
+    gap: var(--form-gap-width);
+    box-shadow: var(--block-shadow);
+    border: var(--block-border-width) solid #0D1233;
+    border-radius: var(--radius-lg);
+    background: #ffffff;
+    overflow: hidden;
+    position: fixed;
+    bottom: 0;
+    margin-left: -16px;
+}
+
+.svelte-1pie7s6.svelte-1pie7s6 {
+    display: flex;
+    flex-direction: inherit;
+    flex-wrap: wrap;
+    gap: var(--form-gap-width);
+    box-shadow: var(--block-shadow);
+    border: 5px solid #0D1233;
+    border-radius: var(--radius-lg);
+    border-color: #0D1233;
+    background: #ffffff;
+    color: #0D1233;    
+    font-size: 16px;    
+    overflow: hidden;
+    position: fixed;
+    bottom: 20px; /* Ajuste a distância vertical do rodapé */
+    margin-left: -5px;
+    max-height: 80vh; /* Ajuste a altura máxima da div */
+    max-width: 78%; /* Ajuste a largura máxima da div */
+}
+
+
+.img.svelte-ms5bsk {
+    width: 100%;
+    height: 100%;
+    background-color: #ffffff;    
+    border: 0px;    
+    border-width: 0px;
 }
 .app.svelte-ac4rv4.svelte-ac4rv4 {
     max-width: none;
@@ -72,14 +130,15 @@ img.svelte-ms5bsk {
 }
 .app.svelte-ac4rv4.svelte-ac4rv4{max-width:none}
 .wrap.svelte-1o68geq.svelte-1o68geq {max-height: none}
+
 .block.svelte-mppz8v {
     position: relative;
     margin: 0;
     box-shadow: var(--block-shadow);
     border-width: var(--block-border-width);
-    border-color: #dbeafe;
+    border-color: #ffffff;
     border-radius: var(--block-radius);
-    background: #dbeafe;
+    background: #ffffff;
     width: 100%;
     line-height: var(--line-sm);
 }
@@ -124,7 +183,7 @@ def chatbot(input_text):
 
 with gr.Blocks(css=css, elem_classes=".app.svelte-ac4rv4.svelte-ac4rv4") as demo:
     realPath = str(os.path.dirname(os.path.realpath(__file__)))
-    img1 = gr.Image("images/imagem teste.png")
+    img1 = gr.Image("images/Cabeçalho_GPT_Exposuper.png", elem_classes=".img.svelte-ms5bsk", elem_id="img.svelte-ms5bsk").style(container=False)
     gpt = gr.Chatbot(label="Converse com GPT Super da CD2",elem_classes=".wrap.svelte-1o68geq.svelte-1o68geq", elem_id="chatbot").style(container=True)
     msg = gr.Textbox(elem_id="div.svelte-awbtu4",elem_classes="div.svelte-awbtu4", show_label=False,
                 placeholder="Bem vindo ao ExpoSuper, Qual sua pergunta?",