ui: record_detail: click to expand compiler message

packages/ui-default/pages/record_detail.page.styl

@@ -6,6 +6,9 @@
     &:empty
       display: none
 
+  .compiler-text-mask
+    display: none
+
   .col--case
     width: rem(70px)
 
@@ -28,3 +31,25 @@
 
     .col--memory
       width: rem(100px)
+
+// dont hide compiler text if compile error
+.hasjs .collapsed #status:not([data-status="7"])
+  .compiler-text
+    max-height: rem(250px)
+    overflow: hidden
+    position: relative
+
+  .compiler-text-mask, .compiler-text-mask p
+    display: block
+    position: absolute
+    cursor: pointer
+    bottom: 0
+    left: 0
+    right: 0
+    z-index: 1
+
+  .compiler-text-mask
+    height: rem(50px)
+    background-image: linear-gradient(to bottom, transparent, #ffffff 25px)
+    p
+      text-align: center

packages/ui-default/pages/record_detail.page.tsx

@@ -5,6 +5,20 @@ import { NamedPage } from 'vj/misc/Page';
 import { tpl, withTransistionCallback } from 'vj/utils';
 
 export default new NamedPage('record_detail', async () => {
+  $(document).on('click', '.compiler-text', () => {
+    withTransistionCallback(() => {
+      $('.collapsed').removeClass('collapsed');
+    });
+  });
+  $(document).on('click', '.subtask-case', function () {
+    const text = $(this).find('.message').text();
+    const data = $(this).find('.message').html();
+    if (!text?.trim()) return;
+    new InfoDialog({
+      $body: tpl(<pre dangerouslySetInnerHTML={{ __html: data }} />),
+    }).open();
+  });
+
   if (!UiContext.socketUrl) return;
   const [{ default: WebSocket }, { DiffDOM }] = await Promise.all([
     import('../components/socket'),
@@ -25,12 +39,4 @@ export default new NamedPage('record_detail', async () => {
       dd.apply(oldSummary[0], dd.diff(oldSummary[0], newSummary[0]));
     });
   };
-  $(document).on('click', '.subtask-case', function () {
-    const text = $(this).find('.message').text();
-    const data = $(this).find('.message').html();
-    if (!text?.trim()) return;
-    new InfoDialog({
-      $body: tpl(<pre dangerouslySetInnerHTML={{ __html: data }} />),
-    }).open();
-  });
 });