ui: display mode fix

packages/ui-default/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.18.11",
+  "version": "4.18.12",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",
@@ -10,10 +10,10 @@
     "lint": "eslint ."
   },
   "devDependencies": {
-    "@blockly/block-extension-tooltip": "^1.0.15",
-    "@blueprintjs/core": "^3.47.0",
-    "@blueprintjs/icons": "^3.27.0",
-    "@blueprintjs/select": "^3.16.6",
+    "@blockly/block-extension-tooltip": "^1.0.17",
+    "@blueprintjs/core": "^3.48.0",
+    "@blueprintjs/icons": "^3.28.0",
+    "@blueprintjs/select": "^3.17.0",
     "@hydrooj/utils": "workspace:*",
     "@types/jquery": "^3.5.6",
     "@types/json-schema": "^7.0.9",
@@ -32,13 +32,13 @@
     "diff-dom": "^4.2.2",
     "echarts": "^5.1.2",
     "emojify.js": "^1.1.0",
-    "esbuild-loader": "^2.14.0",
+    "esbuild-loader": "^2.15.1",
     "eslint": "^7.32.0",
     "eslint-config-airbnb": "^18.2.1",
     "eslint-import-resolver-webpack": "^0.13.1",
-    "eslint-plugin-import": "^2.23.4",
+    "eslint-plugin-import": "^2.24.2",
     "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-react": "^7.24.0",
+    "eslint-plugin-react": "^7.25.0",
     "fancy-log": "^1.3.3",
     "file-loader": "^6.2.0",
     "friendly-errors-webpack-plugin": "^1.7.0",
@@ -58,8 +58,8 @@
     "mini-css-extract-plugin": "^1.6.2",
     "moment": "^2.29.1",
     "monaco-editor": "^0.26.1",
-    "monaco-editor-webpack-plugin": "^4.1.1",
-    "nanoid": "^3.1.23",
+    "monaco-editor-webpack-plugin": "^4.1.2",
+    "nanoid": "^3.1.25",
     "normalize.css": "^8.0.1",
     "nprogress": "^0.2.0",
     "pickadate": "^3.6.4",
@@ -78,7 +78,7 @@
     "redux-thunk": "^2.3.0",
     "rupture": "^0.7.1",
     "slideout": "^1.0.1",
-    "sockjs-client": "^1.5.1",
+    "sockjs-client": "^1.5.2",
     "speed-measure-webpack-plugin": "^1.5.0",
     "sticky-kit": "^1.1.3",
     "style-loader": "^2.0.0",
@@ -99,13 +99,13 @@
     "webpackbar": "^5.0.0-3"
   },
   "dependencies": {
-    "esbuild": "^0.12.18",
+    "esbuild": "^0.12.24",
     "js-yaml": "^4.1.0",
     "jsesc": "^3.0.2",
-    "katex": "^0.13.13",
+    "katex": "^0.13.16",
     "lodash": "^4.17.21",
     "markdown-it": "^12.2.0",
-    "markdown-it-anchor": "^8.1.2",
+    "markdown-it-anchor": "^8.3.0",
     "markdown-it-footnote": "^3.0.3",
     "markdown-it-imsize": "^2.0.1",
     "markdown-it-mark": "^3.0.1",

packages/ui-default/pages/problem_main.page.js

@@ -1,4 +1,5 @@
 import _ from 'lodash';
+import $ from 'jquery';
 import { NamedPage } from 'vj/misc/Page';
 import Notification from 'vj/components/notification';
 import { ConfirmDialog } from 'vj/components/dialog';
@@ -200,7 +201,9 @@ async function handleDownload(ev) {
 }
 
 const page = new NamedPage(['problem_main', 'problem_category'], () => {
-  const doc = document.getElementById('listSection');
+  const doc = document.body;
+  doc.className += ' display-mode';
+  $('.section.display-mode').removeClass('display-mode');
   buildCategoryFilter();
   parseCategorySelection();
   $('[name="leave-edit-mode"]').on('click', () => {

packages/ui-default/templates/problem_main.html

@@ -9,7 +9,7 @@
   }) }}
   <div class="row">
     <div class="medium-9 columns">
-      <div class="section display-mode" id="listSection">
+      <div class="section display-mode">
         <div class="section__body no-padding">
           <form method="get" id="searchForm" action="{{ url('problem_main') }}">
             <div class="search">