Update app.py

app.py

@@ -377,221 +377,7 @@ def demo():
             inputs=None, \
             outputs=[chatbot, doc_source1, source1_page, doc_source2, source2_page, doc_source3, source3_page], \
             queue=False)
-
+    demo.queue().launch(debug=True)
 
 if __name__ == "__main__":
-    gr.Interface(demo(),
-                  css="""
-                  /* General styling */
-body {
-    font-family: Arial, sans-serif;
-    line-height: 1.6;
-    color: #333;
-    background-color: #f5f5f5;
-    padding: 20px;
-}
-
-h2, h3 {
-    line-height: 1.2;
-}
-
-h2 {
-    font-size: 2rem;
-    margin-bottom: 10px;
-}
-
-h3 {
-    font-size: 1.2rem;
-    margin-top: 20px;
-}
-
-a {
-    color: #007bff;
-    text-decoration: none;
-}
-
-a:hover {
-    text-decoration: underline;
-}
-
-/* Input elements */
-input[type="file"] {
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    padding: 5px;
-    outline: none;
-}
-
-select {
-    appearance: menulist;
-    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8'><polygon points='0,0 14,0 7,8'/></svg>");
-    background-repeat: no-repeat;
-    background-position: right 10px center;
-    background-size: 12px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    padding: 5px;
-    outline: none;
-    cursor: pointer;
-}
-
-slider {
-    width: 100%;
-    margin-bottom: 10px;
-}
-
-button {
-    background-color: #007bff;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    padding: 10px;
-    cursor: pointer;
-}
-
-button:hover {
-    background-color: #0056b3;
-}
-
-button:disabled {
-    opacity: 0.5;
-    cursor: not-allowed;
-}
-
-/* Chatbot section */
-.gradio-Chatbox {
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    padding: 10px;
-    margin-top: 20px;
-}
-
-.gradio-Chatbox .gradio-ChatMessage--system {
-    background-color: #eee;
-    padding: 10px;
-    border-radius: 4px;
-    margin-bottom: 10px;
-}
-
-.gradio-Chatbox .gradio-ChatMessage--assistant {
-    background-color: #f5f5f5;
-    padding: 10px;
-    border-radius: 4px;
-    margin-bottom: 10px;
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer {
-    margin-top: 10px;
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer input[type="text"] {
-    width: calc(100% - 40px);
-    padding: 10px;
-    border: none;
-    border-radius: 4px;
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button {
-    width: 30px;
-    height: 30px;
-    padding: 0;
-    min-width: auto;
-    border: none;
-    border-radius: 50%;
-    position: relative;
-    overflow: hidden;
-    box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 2px 4px rgb(0 0 0 / 10%);
-    transition: all 0.2s ease-in-out;
-    background-color: #007bff;
-    color: white;
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button::before {
-    content: "";
-    position: absolute;
-    left: -50%;
-    top: -50%;
-    width: 200%;
-    height: 200%;
-    background-color: currentColor;
-    opacity: 0;
-    transition: all 0.2s ease-in-out;
-    transform-origin: center;
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button:focus {
-    box-shadow: 0 0 0 2px rgb(0 0 0 / 20%), 0 2px 4px rgb(0 0 0 / 15%);
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button:active {
-    transform: translateY(1px);
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button:hover:not(:focus):not(:active) {
-    filter: brightness(90%);
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button:hover:not(:focus):not(:active)::before {
-    opacity: 0.2;
-}
-
-.gradio-Chatbox .gradio-ChatInputContainer button:active:not(:focus)::before {
-    opacity: 0.5;
-    transform: rotate(-45deg) scaleX(1.5) scaleY(1.3);
-}
-
-/* Accordion sections */
-.accordion-section {
-    margin-top: 20px;
-}
-
-/* Progress bars */
-.progressbar-container {
-    margin-top: 10px;
-}
-
-.progressbar-container .progressbar-label {
-    margin-right: 10px;
-}
-
-.progressbar-container .progressbar-percentage {
-    float: right;
-}
-
-/* Tooltip component */
-.tooltip-wrapper {
-    position: relative;
-}
-
-.tooltip-wrapper .tooltip {
-    visibility: hidden;
-    background-color: #f9f9f9;
-    color: #333;
-    text-align: center;
-    padding: 5px 0;
-    border-radius: 6px;
-    position: absolute;
-    z-index: 1;
-    bottom: 100%;
-    left: 50%;
-    margin-left: -60px;
-    opacity: 0;
-    transition: opacity 0.3s;
-}
-
-.tooltip-wrapper .tooltip::after {
-    content: "";
-    position: absolute;
-    top: 100%;
-    left: 50%;
-    margin-left: -5px;
-    border-width: 5px;
-    border-style: solid;
-    border-color: #f9f9f9 transparent transparent transparent;
-}
-
-.tooltip-wrapper:hover .tooltip {
-    visibility: visible;
-    opacity: 1;
-}
-                  """).launch(debug=True)
+    demo()