Merge branch 'feat/ui-1.1.0' of git.backyard.segmentfault.com:opensource/answer into feat/ui-1.1.0

i18n/en_US.yaml

@@ -1361,6 +1361,8 @@ ui:
     invalid: is invalid
     btn_submit: Save
     not_found_props: "Required property {{ key }} not found."
+    select: Select
+    
   page_review:
     review: Review
     proposed: proposed

ui/src/components/Editor/utils/index.ts

@@ -113,4 +113,20 @@ export function htmlRender(el: HTMLElement | null) {
       });
     },
   );
+
+  el.querySelectorAll('table').forEach((table) => {
+    if (
+      (table.parentNode as HTMLDivElement)?.classList.contains(
+        'table-responsive',
+      )
+    ) {
+      return;
+    }
+
+    table.classList.add('table', 'table-bordered');
+    const div = document.createElement('div');
+    div.className = 'table-responsive';
+    table.parentNode?.replaceChild(div, table);
+    div.appendChild(table);
+  });
 }

ui/src/components/SchemaForm/index.tsx

@@ -312,6 +312,9 @@ const SchemaForm: ForwardRefRenderFunction<IRef, IProps> = (
                 value={formData[key]?.value || defaultValue}
                 onChange={handleSelectChange}
                 isInvalid={formData[key].isInvalid}>
+                <option disabled selected>
+                  {t('select')}
+                </option>
                 {properties[key].enum?.map((item, index) => {
                   return (
                     <option value={String(item)} key={String(item)}>

ui/src/index.scss

@@ -239,6 +239,12 @@ a {
       margin-bottom: 0;
     }
   }
+  table {
+    td,
+    th {
+      word-break: initial;
+    }
+  }
 }
 
 .upload-img-wrap {
@@ -285,8 +291,13 @@ a {
 }
 
 @keyframes bg-fade-out {
-  0%, 25% {background-color: var(--bs-highlight-bg)}
+  0%,
-  100% { background-color: transparent }
+  25% {
+    background-color: var(--bs-highlight-bg);
+  }
+  100% {
+    background-color: transparent;
+  }
 }
 .bg-fade-out {
   animation: 2s ease 1s bg-fade-out;