From 9b2c36efbf3bddb3775d1a7e8c3a258d77169a6e Mon Sep 17 00:00:00 2001 From: undefined Date: Tue, 22 Feb 2022 00:24:50 +0800 Subject: [PATCH] ui: allow font customization --- .github/workflows/build.yml | 1 - package.json | 8 ++-- packages/ui-default/common/variables.inc.styl | 6 +-- packages/ui-default/locales/zh.yaml | 4 ++ packages/ui-default/misc/Page.ts | 4 +- packages/ui-default/misc/typography.styl | 7 +++- packages/ui-default/package.json | 12 +++--- .../ui-default/pages/home_preference.page.jsx | 10 ++++- .../ui-default/pages/problem_detail.page.jsx | 2 - .../ui-default/pages/problem_main.page.js | 2 +- packages/ui-default/setting.yaml | 26 ++++++++++++ .../components/comments_discussion.html | 2 +- .../ui-default/templates/layout/html5.html | 40 ++++++++++++++----- 13 files changed, 93 insertions(+), 31 deletions(-) diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index b1efa3fe..b153b54b 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -34,7 +34,6 @@ jobs: run: | yarn build yarn build:ui:production - ./packages/geoip/download.sh - name: Lint run: yarn lint:ci - name: Publish diff --git a/package.json b/package.json index eb8b45eb..c783d765 100644 --- a/package.json +++ b/package.json @@ -28,15 +28,15 @@ "license": "AGPL-3.0-only", "devDependencies": { "@types/cross-spawn": "^6.0.2", - "@types/node": "^16.11.22", + "@types/node": "^16.11.25", "@types/semver": "^7.3.9", - "@typescript-eslint/eslint-plugin": "5.11.0", - "@typescript-eslint/parser": "5.11.0", + "@typescript-eslint/eslint-plugin": "5.12.0", + "@typescript-eslint/parser": "5.12.0", "cac": "^6.7.12", "cross-env": "^7.0.3", "cross-spawn": "^7.0.3", "esbuild": "0.14.3", - "eslint": "^8.8.0", + "eslint": "^8.9.0", "eslint-config-airbnb-typescript": "12.3.1", "eslint-import-resolver-typescript": "2.5.0", "eslint-plugin-import": "2.25.4", diff --git a/packages/ui-default/common/variables.inc.styl b/packages/ui-default/common/variables.inc.styl index 9d9b7ecf..d49fe75c 100644 --- a/packages/ui-default/common/variables.inc.styl +++ b/packages/ui-default/common/variables.inc.styl @@ -2,9 +2,9 @@ $grid-padding = 15px // half gutter // fonts -$primary-font-family = "Open Sans", "Seravek", "Segoe UI", "Verdana", "PingFang SC", "Hiragino Sans GB", "Lantinghei SC", "Microsoft Yahei", "WenQuanYi Micro Hei", "sans" -$header-font-family = "Open Sans", "Seravek", "Segoe UI", "Verdana", "PingFang SC", "Lantinghei SC", "Microsoft Yahei", "Hiragino Sans GB", "Microsoft Sans Serif", "WenQuanYi Micro Hei", "sans-serif" -$code-font-family = "monaco", "Source Code Pro", "Consolas", "Lucida Console", "monospace" +$primary-font-family = var(--font-family) +$header-font-family = var(--font-family) +$code-font-family = var(--code-font-family) // primary palette $default-color = #ddd diff --git a/packages/ui-default/locales/zh.yaml b/packages/ui-default/locales/zh.yaml index 08050560..48ede8d4 100644 --- a/packages/ui-default/locales/zh.yaml +++ b/packages/ui-default/locales/zh.yaml @@ -323,6 +323,7 @@ File: 文件 Filename: 文件名 Files: 文件 Filter: 过滤 +fontFamily: 字体 Footer: 页脚 Footnote: 脚注 Forgot Password and/or Username: 忘记密码和/或用户名 @@ -458,6 +459,7 @@ Memory: 内存 Message {0} not found.: 消息 {0} 不存在。 Messages: 消息 Method: 方法 +Microsoft Yahei: 微软雅黑 Moderator: 管理员 Month: 月 Monthly Popular: 月度最受欢迎 @@ -549,6 +551,7 @@ Permission: 权限 Permissions: 权限 Pick a problem randomly based on current filter: 根据当前过滤条件随机选择一道题 Pin: 置顶 +PingFang SC: 苹方简体 Plan: 计划 Please attend contest to see the problems.: 请参加比赛来查看题目。 Please claim the assignment to see the problems.: 认领作业后才可以查看作业内容。 @@ -863,6 +866,7 @@ We will check code similarity after this contest.: 我们会在赛后检查代 WeChat Visibility: 微信可见性 WeChat: 微信 Week: 周 +WenQuanYi Micro Hei: 文泉驿 What is domain?: 什么是域? What is this?: 这是什么？ What's domain?: 什么是域？ diff --git a/packages/ui-default/misc/Page.ts b/packages/ui-default/misc/Page.ts index ccf0621b..d1854ae6 100644 --- a/packages/ui-default/misc/Page.ts +++ b/packages/ui-default/misc/Page.ts @@ -24,13 +24,13 @@ export class Page { } export class NamedPage extends Page { - constructor(name: string | string[], afterLoading = null, beforeLoading = null) { + constructor(name: string | string[], afterLoading: (pagename: string) => any = null, beforeLoading = null) { super(name, false, afterLoading, beforeLoading); } } export class AutoloadPage extends Page { - constructor(name: string | string[], afterLoading = null, beforeLoading = null) { + constructor(name: string | string[], afterLoading: (pagename: string) => any = null, beforeLoading = null) { super(name, true, afterLoading, beforeLoading); } } diff --git a/packages/ui-default/misc/typography.styl b/packages/ui-default/misc/typography.styl index f04fc740..7bacfcf8 100644 --- a/packages/ui-default/misc/typography.styl +++ b/packages/ui-default/misc/typography.styl @@ -472,8 +472,13 @@ h1, h2, h3, h4, h5, h6 color: darken(black, 40%) textarea - font-family: "monaco", "Consolas", "Source Code Pro", "Lucida Console", "monospace" !important + font-family: $code-font-family !important :focus outline: 0px; outline-offset: 2px; + +@font-face + font-family: "XiaoLai SC"; + font-display: swap; + src: url('https://raw.githubusercontent.com/lxgw/kose-font/master/TTF%20(Simplified%20Chinese)/XiaolaiSC-Regular.ttf') format('truetype'); diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json index 206c714a..a9a8c948 100644 --- a/packages/ui-default/package.json +++ b/packages/ui-default/package.json @@ -1,6 +1,6 @@ { "name": "@hydrooj/ui-default", - "version": "4.31.19", + "version": "4.32.0", "author": "undefined ", "license": "AGPL-3.0", "main": "hydro.js", @@ -33,7 +33,7 @@ "emojis-keywords": "2.0.0", "emojis-list": "2.1.0", "esbuild-loader": "^2.18.0", - "eslint": "^8.8.0", + "eslint": "^8.9.0", "eslint-config-airbnb": "^18.2.1", "eslint-import-resolver-webpack": "^0.13.2", "eslint-plugin-import": "^2.25.4", @@ -42,7 +42,7 @@ "fancy-log": "^1.3.3", "file-loader": "^6.2.0", "friendly-errors-webpack-plugin": "^1.7.0", - "graphiql": "^1.5.17", + "graphiql": "^1.5.19", "gulp": "^4.0.2", "gulp-cli": "^2.3.0", "gulp-iconfont": "^11.0.1", @@ -59,7 +59,7 @@ "monaco-editor-nls": "^2.0.0", "monaco-editor-webpack-plugin": "^7.0.1", "monaco-themes": "^0.4.0", - "nanoid": "^3.2.0", + "nanoid": "^3.3.0", "normalize.css": "^8.0.1", "nprogress": "^0.2.0", "pickadate": "^3.6.4", @@ -117,8 +117,8 @@ "markdown-it-table-of-contents": "^0.6.0", "mongodb": "^3.7.3", "nunjucks": "^3.2.3", - "react-query": "^3.34.14", - "streamsaver": "^2.0.5", + "react-query": "^3.34.15", + "streamsaver": "^2.0.6", "xss": "^1.0.10" } } diff --git a/packages/ui-default/pages/home_preference.page.jsx b/packages/ui-default/pages/home_preference.page.jsx index e9a85467..81cfa1ac 100644 --- a/packages/ui-default/pages/home_preference.page.jsx +++ b/packages/ui-default/pages/home_preference.page.jsx @@ -2,7 +2,7 @@ import { NamedPage } from 'vj/misc/Page'; import i18n from 'vj/utils/i18n'; import tpl from 'vj/utils/tpl'; -const page = new NamedPage('home_preference', () => { +function initCodeLangHelper() { function setOptions($el, options) { $el.empty(); $.each(options, (key, value) => { @@ -66,6 +66,14 @@ const page = new NamedPage('home_preference', () => { $('#codelang-sub-select').on('change', function () { $('[name="codeLang"]').val(this.value); }); +} + +const page = new NamedPage('home_preference', () => { + initCodeLangHelper(); + $('[name="fontFamily"] option, [name="codeFontFamily"] option').each(function () { + this.style.fontFamily = this.getAttribute('value'); + this.textContent = i18n(this.textContent.trim()); + }); }); export default page; diff --git a/packages/ui-default/pages/problem_detail.page.jsx b/packages/ui-default/pages/problem_detail.page.jsx index d1460bfb..65bb1d92 100644 --- a/packages/ui-default/pages/problem_detail.page.jsx +++ b/packages/ui-default/pages/problem_detail.page.jsx @@ -231,8 +231,6 @@ const page = new NamedPage(['problem_detail', 'contest_detail_problem', 'homewor { value: UiContext.pdoc.stats.WA, name: 'WA' }, { value: UiContext.pdoc.stats.RE, name: 'RE' }, { value: UiContext.pdoc.stats.CE, name: 'CE' }, - { value: UiContext.pdoc.stats.SE, name: 'SE' }, - { value: UiContext.pdoc.stats.IGN, name: 'IGN' }, ], }, ], diff --git a/packages/ui-default/pages/problem_main.page.js b/packages/ui-default/pages/problem_main.page.js index 4a3b2b11..f7e4496c 100644 --- a/packages/ui-default/pages/problem_main.page.js +++ b/packages/ui-default/pages/problem_main.page.js @@ -205,7 +205,7 @@ async function handleOperation(operation) { await request.post('', { operation, pids, ...payload }); Notification.success(i18n(`Selected problems have been ${operation === 'copy' ? 'copie' : operation}d.`)); await delay(2000); - window.location.reload(); + updateSelection(true); } catch (error) { Notification.error(error.message); } diff --git a/packages/ui-default/setting.yaml b/packages/ui-default/setting.yaml index de5e0796..4f23d0b4 100644 --- a/packages/ui-default/setting.yaml +++ b/packages/ui-default/setting.yaml @@ -1,3 +1,29 @@ +fontFamily: + type: + Open Sans: Open Sans + Seravek: Seravek + Segoe UI: Segoe UI + Verdana: Verdana + PingFang SC: PingFang SC + Hiragino Sans GB: Hiragino Sans GB + Microsoft Yahei: Microsoft Yahei + WenQuanYi Micro Hei: WenQuanYi Micro Hei + sans: sans + XiaoLai SC: 小赖 SC + family: setting_display + category: preference + value: Open Sans +codeFontFamily: + type: + monaco: Monaco + Source Code Pro: Source Code Pro + Consolas: Consolas + Lucida Console: Lucida Console + monospace: monospace + Fira Code: Fira Code + family: setting_display + category: preference + value: Source Code Pro footer_extra_html: type: textarea name: footer_extra_html diff --git a/packages/ui-default/templates/components/comments_discussion.html b/packages/ui-default/templates/components/comments_discussion.html index 8dd20b4c..3f928c24 100644 --- a/packages/ui-default/templates/components/comments_discussion.html +++ b/packages/ui-default/templates/components/comments_discussion.html @@ -89,7 +89,7 @@
-
+
{{ user.render_inline(udoc, avatar=false) }} diff --git a/packages/ui-default/templates/layout/html5.html b/packages/ui-default/templates/layout/html5.html index e1fc0f2e..b459f9b5 100644 --- a/packages/ui-default/templates/layout/html5.html +++ b/packages/ui-default/templates/layout/html5.html @@ -24,13 +24,23 @@ {% endblock %} - {{ handler.renderTitle(page_name) }} + + {% if process.env.DEV %} + + {% else %} + + {% endif %} {% if not isIE(handler.request.headers['user-agent']) %} - + {% endif %} @@ -40,12 +50,24 @@ var UiContext = '{{ UiContext|json|jsesc|safe }}'; var UserContext = '{{ UserContext|json|jsesc|safe }}'; - - {% if process.env.DEV %} - + {% if process.env.DEV and vite %} + + + {% else %} - + + {% if process.env.DEV %} + + {% else %} + + {% endif %} {% endif %} {% endif %}