Updated CSS

app.py

@@ -342,66 +342,65 @@ with gr.Blocks(title="🌍 Climate Q&A", css="style.css", theme=theme) as demo:
     # gr.Markdown("<h1><center>Climate Q&A 🌍</center></h1>")
     # gr.Markdown("<h4><center>Ask climate-related questions to the IPCC and IPBES reports using AI</center></h4>")
 
-    with gr.Tab("💬 Chatbot"):
+    with gr.Tab("🌍 ClimateQ&A"):
 
-        with gr.Row():
+        with gr.Row(elem_id="chatbot-row"):
             with gr.Column(scale=2):
                 # state = gr.State([system_template])
-                bot = gr.Chatbot(height=600,show_copy_button=True,show_label = False,elem_id="chatbot")
-
-                with gr.Row():
-                    with gr.Column(scale = 7):
-                        textbox=gr.Textbox(placeholder="Ask me a question about climate change or biodiversity in any language!",show_label=False)
-                    with gr.Column(scale = 1):
-                        submit_button = gr.Button("Submit")
-                
-                examples_hidden = gr.Textbox(elem_id="hidden-message")
-
-                examples_questions = gr.Examples(
-                    [
-                        "Is climate change caused by humans?",
-                        "What evidence do we have of climate change?",
-                        "What are the impacts of climate change?",
-                        "Can climate change be reversed?",
-                        "What is the difference between climate change and global warming?",
-                        "What can individuals do to address climate change?",
-                        "What are the main causes of climate change?",
-                        "What is the Paris Agreement and why is it important?",
-                        "Which industries have the highest GHG emissions?",
-                        "Is climate change a hoax created by the government or environmental organizations?",
-                        "What is the relationship between climate change and biodiversity loss?",
-                        "What is the link between gender equality and climate change?",
-                        "Is the impact of climate change really as severe as it is claimed to be?",
-                        "What is the impact of rising sea levels?",
-                        "What are the different greenhouse gases (GHG)?",
-                        "What is the warming power of methane?",
-                        "What is the jet stream?",
-                        "What is the breakdown of carbon sinks?",
-                        "How do the GHGs work ? Why does temperature increase ?",
-                        "What is the impact of global warming on ocean currents?",
-                        "How much warming is possible in 2050?",
-                        "What is the impact of climate change in Africa?",
-                        "Will climate change accelerate diseases and epidemics like COVID?",
-                        "What are the economic impacts of climate change?",
-                        "How much is the cost of inaction ?",
-                        "What is the relationship between climate change and poverty?",
-                        "What are the most effective strategies and technologies for reducing greenhouse gas (GHG) emissions?",
-                        "Is economic growth possible? What do you think about degrowth?",
-                        "Will technology save us?",
-                        "Is climate change a natural phenomenon ?",
-                        "Is climate change really happening or is it just a natural fluctuation in Earth's temperature?",
-                        "Is the scientific consensus on climate change really as strong as it is claimed to be?",
-                    ],
-                    [examples_hidden],
-                    examples_per_page=10,
-                )
-
-            with gr.Column(scale=1, variant="panel"):
+                bot = gr.Chatbot(height="100%",show_copy_button=True,show_label = False,elem_id="chatbot")
+                textbox=gr.Textbox(placeholder="Ask me a question about climate change or biodiversity in any language!",show_label=False)
+                submit_button = gr.Button("Submit")
+
+
+            with gr.Column(scale=1, variant="panel",elem_id = "right-panel"):
+
+                with gr.Tab("📝 Examples",elem_id = "tab-examples"):
+                                    
+                    examples_hidden = gr.Textbox(elem_id="hidden-message")
+
+                    examples_questions = gr.Examples(
+                        [
+                            "Is climate change caused by humans?",
+                            "What evidence do we have of climate change?",
+                            "What are the impacts of climate change?",
+                            "Can climate change be reversed?",
+                            "What is the difference between climate change and global warming?",
+                            "What can individuals do to address climate change?",
+                            "What are the main causes of climate change?",
+                            "What is the Paris Agreement and why is it important?",
+                            "Which industries have the highest GHG emissions?",
+                            "Is climate change a hoax created by the government or environmental organizations?",
+                            "What is the relationship between climate change and biodiversity loss?",
+                            "What is the link between gender equality and climate change?",
+                            "Is the impact of climate change really as severe as it is claimed to be?",
+                            "What is the impact of rising sea levels?",
+                            "What are the different greenhouse gases (GHG)?",
+                            "What is the warming power of methane?",
+                            "What is the jet stream?",
+                            "What is the breakdown of carbon sinks?",
+                            "How do the GHGs work ? Why does temperature increase ?",
+                            "What is the impact of global warming on ocean currents?",
+                            "How much warming is possible in 2050?",
+                            "What is the impact of climate change in Africa?",
+                            "Will climate change accelerate diseases and epidemics like COVID?",
+                            "What are the economic impacts of climate change?",
+                            "How much is the cost of inaction ?",
+                            "What is the relationship between climate change and poverty?",
+                            "What are the most effective strategies and technologies for reducing greenhouse gas (GHG) emissions?",
+                            "Is economic growth possible? What do you think about degrowth?",
+                            "Will technology save us?",
+                            "Is climate change a natural phenomenon ?",
+                            "Is climate change really happening or is it just a natural fluctuation in Earth's temperature?",
+                            "Is the scientific consensus on climate change really as strong as it is claimed to be?",
+                        ],
+                        [examples_hidden],
+                        examples_per_page=10,
+                    )
 
-                with gr.Tab("📚 Citations"):
+                with gr.Tab("📚 Citations",elem_id = "tab-citations"):
                     sources_textbox = gr.Markdown(show_label=False, elem_id="sources-textbox")
 
-                with gr.Tab("⚙️ Configuration"):
+                with gr.Tab("⚙️ Configuration",elem_id = "tab-config"):
 
                     gr.Markdown("Reminder: You can talk in any language, ClimateQ&A is multi-lingual!")
 
@@ -613,5 +612,4 @@ Or around 2 to 4 times more than a typical Google search.
 
     demo.queue(concurrency_count=16)
 
-if __name__ == "__main__":
-    demo.launch()
+demo.launch()

climateqa/llm.py

@@ -1,9 +1,11 @@
 from langchain.chat_models import AzureChatOpenAI
-
-# LOAD ENVIRONMENT VARIABLES
-from dotenv import load_dotenv
 import os
-load_dotenv()
+# LOAD ENVIRONMENT VARIABLES
+try:
+    from dotenv import load_dotenv
+    load_dotenv()
+except:
+    pass
 
 
 def get_llm(max_tokens = 1024,temperature = 0.0,verbose = True,streaming = False, **kwargs):
@@ -20,4 +22,4 @@ def get_llm(max_tokens = 1024,temperature = 0.0,verbose = True,streaming = False
         streaming = streaming,
         **kwargs,
     )
-    return llm
+    return llm

climateqa/vectorstore.py

@@ -1,14 +1,16 @@
 # Pinecone
 # More info at https://docs.pinecone.io/docs/langchain
 # And https://python.langchain.com/docs/integrations/vectorstores/pinecone
-
+import os
 import pinecone
 from langchain.vectorstores import Pinecone
 
 # LOAD ENVIRONMENT VARIABLES
-from dotenv import load_dotenv
-import os
-load_dotenv()
+try:
+    from dotenv import load_dotenv
+    load_dotenv()
+except:
+    pass
 
 
 def get_pinecone_vectorstore(embeddings,text_key = "content"):

style.css

@@ -166,7 +166,21 @@ label.selected{
   background:none !important;
 }
 
+
+div#tab-examples{
+    height:calc(100vh - 190px) !important;
+    overflow-y: auto;
+}
+
 div#sources-textbox{
-    height:100vh;
+    height:calc(100vh - 190px) !important;
     overflow-y: auto;
-  }
+  }
+
+div#chatbot-row{
+    height:calc(100vh - 120px);
+}
+
+div#chatbot{
+    height:calc(100vh - 270px)
+}