Added custom colours to Gradio components

app.py

@@ -572,7 +572,7 @@ def update_use_embeddings(widget, state):
         return state
 
 
-with gr.Blocks(css=".gradio-container {background-color: black}") as block:
+with gr.Blocks(css=".gradio-container {background-color: #090c17} #gr-component {background-color: #202937}") as block:
     llm_state = gr.State()
     history_state = gr.State()
     chain_state = gr.State()
@@ -608,29 +608,30 @@ with gr.Blocks(css=".gradio-container {background-color: black}") as block:
     docsearch_state = gr.State()
     use_embeddings_state = gr.State(False)
 
-    with gr.Tab("Chat"):
+    with gr.Tab("Chat", elem_id="gr-component"):
         with gr.Row():
             openai_api_key_textbox = gr.Textbox(placeholder="Paste your OpenAI API key (sk-...)",
                                                 show_label=False, lines=1, type='password')
 
         with gr.Row():
             with gr.Column(scale=7):
-                chatbot = gr.Chatbot()
+                chatbot = gr.Chatbot(elem_id="gr-component")
 
         with gr.Row():
             message = gr.Textbox(label="What's on your mind?",
                                  placeholder="What's the answer to life, the universe, and everything?",
-                                 lines=1)
+                                 lines=1,
+                                 elem_id="gr-component")
             submit = gr.Button(value="Send", variant="secondary").style(full_width=False)
 
     with gr.Tab("Settings"):
         tools_cb_group = gr.CheckboxGroup(label="Tools:", choices=TOOLS_LIST,
-                                          value=TOOLS_DEFAULT_LIST)
+                                          value=TOOLS_DEFAULT_LIST, elem_id="gr-component")
         tools_cb_group.change(update_selected_tools,
                               inputs=[tools_cb_group, tools_list_state, llm_state],
                               outputs=[tools_list_state, llm_state, chain_state, express_chain_state])
 
-        trace_chain_cb = gr.Checkbox(label="Show reasoning chain in chat bubble", value=False)
+        trace_chain_cb = gr.Checkbox(label="Show reasoning chain in chat bubble", value=False, elem_id="gr-component")
         trace_chain_cb.change(update_foo, inputs=[trace_chain_cb, trace_chain_state],
                               outputs=[trace_chain_state])
 
@@ -647,7 +648,7 @@ with gr.Blocks(css=".gradio-container {background-color: black}") as block:
         # monologue_cb.change(update_foo, inputs=[monologue_cb, monologue_state],
         #                    outputs=[monologue_state])
 
-        reset_btn = gr.Button(value="Reset chat", variant="secondary").style(full_width=False)
+        reset_btn = gr.Button(value="Reset chat", variant="secondary").style(full_width=False, elem_id="gr-component")
         reset_btn.click(reset_memory, inputs=[history_state, memory_state], outputs=[chatbot, history_state, memory_state])
 
     message.submit(chat, inputs=[openai_api_key_textbox, message, history_state, chain_state, trace_chain_state,
@@ -677,4 +678,4 @@ with gr.Blocks(css=".gradio-container {background-color: black}") as block:
                                   outputs=[chain_state, express_chain_state, llm_state, embeddings_state,
                                            qa_chain_state, memory_state])
 
-block.launch(debug=True)
+block.launch(debug=True, share=True)