fix UI

app.py

@@ -38,7 +38,7 @@ examples = [
     [
         "license.jpeg",
         "Name;DOB;ISS;EXP",
-],
+    ],
     [
         "invoice.jpeg",
         "名称;纳税人识别号;开票日期",
@@ -160,11 +160,15 @@ def run_taskflow(document, schema, argument):
 
 
 def process_doc(document, schema, ocr_lang, layout_analysis):
+    if [document, schema] in examples:
+        ocr_lang = lang_map[document]
+
     if not schema:
         schema = '时间;组织机构;人物'
     if document is None:
         return None, None
 
+    layout_analysis = True if layout_analysis == "yes" else False
     schema, schema_lang = get_schema(dbc2sbc(schema))
     argument = {
         "ocr_lang": ocr_lang,
@@ -190,7 +194,6 @@ def load_example_document(img, schema, ocr_lang, layout_analysis):
         document = example_files[schema]
         choice = lang_map[document].split("-")
         ocr_lang = choice[0]
-        layout_analysis = False if len(choice) == 1 else True
         preview, answer = process_doc(document, schema, ocr_lang, layout_analysis)
         return document, schema, preview, gr.update(visible=True), answer
     else:
@@ -206,91 +209,7 @@ def read_content(file_path: str) -> str:
     return content
 
 
-CSS = """
-#prompt input {
-    font-size: 16px;
-}
-#url-textbox {
-    padding: 0 !important;
-}
-#short-upload-box .w-full {
-    min-height: 10rem !important;
-}
-/* I think something like this can be used to re-shape
- * the table
- */
-/*
-.gr-samples-table tr {
-    display: inline;
-}
-.gr-samples-table .p-2 {
-    width: 100px;
-}
-*/
-#select-a-file {
-    width: 100%;
-}
-#file-clear {
-    padding-top: 2px !important;
-    padding-bottom: 2px !important;
-    padding-left: 8px !important;
-    padding-right: 8px !important;
-	margin-top: 10px;
-}
-.gradio-container .gr-button-primary {
-    background: linear-gradient(180deg, #CDF9BE 0%, #AFF497 100%);
-    border: 1px solid #B0DCCC;
-    border-radius: 8px;
-    color: #1B8700;
-}
-.gradio-container.dark button#submit-button {
-    background: linear-gradient(180deg, #CDF9BE 0%, #AFF497 100%);
-    border: 1px solid #B0DCCC;
-    border-radius: 8px;
-    color: #1B8700
-}
-table.gr-samples-table tr td {
-    border: none;
-    outline: none;
-}
-table.gr-samples-table tr td:first-of-type {
-    width: 0%;
-}
-div#short-upload-box div.absolute {
-    display: none !important;
-}
-gradio-app > div > div > div > div.w-full > div, .gradio-app > div > div > div > div.w-full > div {
-    gap: 0px 2%;
-}
-gradio-app div div div div.w-full, .gradio-app div div div div.w-full {
-    gap: 0px;
-}
-gradio-app h2, .gradio-app h2 {
-    padding-top: 10px;
-}
-#answer {
-    overflow-y: scroll;
-    color: white;
-    background: #666;
-    border-color: #666;
-    font-size: 20px;
-    font-weight: bold;
-}
-#answer span {
-    color: white;
-}
-#answer textarea {
-    color:white;
-    background: #777;
-    border-color: #777;
-    font-size: 18px;
-}
-#url-error input {
-    color: red;
-}
-"""
-
-with gr.Blocks(css=CSS) as demo:
+with gr.Blocks() as demo:
     gr.HTML(read_content("header.html"))
     gr.Markdown(
         "Open-sourced by PaddleNLP, **UIE-X** is a universal information extraction engine for both scanned document and text inputs. It supports Entity Extraction, Relation Extraction and Event Extraction tasks."

header.html

@@ -1,16 +1,7 @@
 <div style="text-align: center; max-width: 650px; margin: 0 auto;">
-    <div
-      style="
-        display: inline-flex;
-        gap: 0.8rem;
-        font-size: 1.75rem;
-        margin-bottom: 10px;
-        margin-left: 220px;
-        justify-content: center;
-      "
-    >
-    <a href="https://github.com/PaddlePaddle/PaddleNLP"><img src="https://user-images.githubusercontent.com/1371212/175816733-8ec25eb0-9af3-4380-9218-27c154518258.png" alt="PaddleNLP" width="60%"></a>
-    </div> 
+    <p align="center">
+      <img src="https://user-images.githubusercontent.com/1371212/175816733-8ec25eb0-9af3-4380-9218-27c154518258.png" align="middle"  width="500" />
+    </p>
     <div
       style="
         display: inline-flex;