Add toggleable Minimalist Monochrome UI by boomzero · Pull Request #906 · XMOJ-Script-dev/XMOJ-Script

boomzero · 2026-02-16T02:24:49Z

What does this PR aim to accomplish?:

Add a new toggleable UI theme option ("MonochromeUI") that overhauls the visual design with a minimalist monochrome aesthetic: serif typography (Playfair Display + Source Serif 4), sharp corners, line-based borders, and inverted headers. The setting is under Beautify → 极简黑白界面风格 and defaults to on. When disabled, the original Bootstrap styling is fully restored.

How does this PR accomplish the above?:

Global CSS variables: :root and [data-bs-theme='dark'] define --mono-black, --mono-white, --mono-gray-*, and font families. Dark mode uses charcoal (#1a1a1a) instead of pure black for eye comfort.
Universal reset: border-radius: 0, box-shadow: none on all elements.
Bootstrap overrides: Monochrome styling for navbar, cards, modals, toasts, tables, dropdowns, forms, alerts, list groups — all with !important.
Button differentiation: btn-primary filled (black bg), btn-secondary outlined. btn-success/danger/warning/info preserve functional colors as outline style.
Status indicators: .status_y/n/w keep colored backgrounds. Std submission status uses text labels ([STD], [OK], [ERR]) instead of emojis. Loading spinner uses Bootstrap spinner-border instead of GIF.
Content links: Bottom-border underline (not text-decoration) scoped to .container content, excluding nav/buttons/dropdowns.
Early style injection: Lightweight CSS injected before resource loading to reduce layout shift. Font loaded via <link> element.
Non-blocking status fetches: ImproveACRate fetch and GetStdList API call no longer block with await, reducing layout shift on status page.
Responsive: Problem switcher hidden on screens < 768px. Images constrained with max-width: 100%.
Toggleable: UtilityEnabled("MonochromeUI") gates all changes. Disabling fully restores original Bootstrap styles including blur overlay, rounded navbar, original animations.

By submitting this pull request, I confirm the following:

I have read and understood the contributor's guide, as well as this entire template. I understand which branch to base my commits and Pull Requests against.
I have commented on my proposed changes within the code and I have tested my changes.
I am willing to help maintain this change if there are issues with it later.
It is compatible with the GNU General Public License v3.0
I have squashed any insignificant commits. (git rebase)
I have checked that another pull request for this purpose does not exist.
I have considered and confirmed that this submission will be valuable to others.
I accept that this submission may not be used, and the pull request can be closed at the will of the maintainer.
I give this submission freely and claim no ownership to its content.

I have read the above and my PR is ready for review. Check this box to confirm

Summary by cubic

Adds a toggleable Minimalist Monochrome UI (default on) with serif typography, sharp corners, and a charcoal dark mode. Ships as 3.0.0 and restores the original Bootstrap UI when turned off.

New Features
- MonochromeUI toggle under Beautify; disabling fully restores Bootstrap.
- Monochrome CSS with variables and inverted headers; charcoal dark mode; fonts via fonts.loli.net; early style injection to reduce layout shift.
- Navbar geometry gated by the toggle: flat, full‑width in monochrome; rounded with margin otherwise.
- UI tweaks: filled primary vs outlined secondary buttons; centered tables with spacing; link bottom-border underline; visible copy button on dark headers; images contained; problem switcher gets a solid background and hides <768px; CodeMirror uses a solid border; blur overlay hidden.
- Faster animations and dropdowns (100ms); non‑blocking status page fetches; loader.gif replaced by a Bootstrap spinner; std status uses [STD]/[OK]/[ERR].
Bug Fixes
- Skip UploadStd when GetStdList fails to avoid redundant uploads.

^{Written for commit dbdfbb2. Summary will update on new commits.}

New "极简黑白界面风格" option under Beautify settings that overhauls the visual design with a monochrome palette, serif typography (Playfair Display + Source Serif 4), zero border-radius, and line-based visual structure. Key changes: - Comprehensive monochrome CSS with dark mode support (charcoal bg) - CSS variables for automatic light/dark theme switching - Sharp-cornered cards, modals, toasts with inverted headers - Monochrome buttons with filled primary / outlined secondary - Colored status buttons preserved (success/danger/warning/info) - Faster animations (100ms) and dropdown transitions - Problem switcher with solid bg, hidden on narrow screens - Copy button visibility fix in inverted headers - Image containment (max-width: 100%) - Table cell center alignment - Non-blocking status page fetches to reduce layout shift - Font loading via <link> element to avoid FOUC - Fully toggleable: disabling reverts to original Bootstrap styles Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

…j-code-navigator agent - Emphasize the importance of using xmoj-code-navigator for exploring, searching, and understanding XMOJ.user.js - Provide guidelines on when and how to use the xmoj-code-navigator agent - Explain the benefits of using the agent over loading the entire file

- Replace std status emojis with text labels ([STD]/[OK]/[ERR]) - Replace loader.gif with Bootstrap spinner - Add table margin-top for spacing from elements above - Use bare element selectors for table header styling - Fix table cell text-align center - Soften dark mode colors (charcoal #1a1a1a bg, #e5e5e5 text) - Fix copy button visibility in inverted headers - Hide problem switcher on narrow screens - Differentiate btn-primary (filled) from btn-secondary (outlined) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

cubic-dev-ai

2 issues found across 3 files (changes from recent commits).

Prompt for AI agents (all issues)


Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="XMOJ.user.js">

<violation number="1" location="XMOJ.user.js:3">
P2: Do not manually bump the userscript version; the UpdateVersion workflow owns this field. Revert this change and let CI update it.</violation>
</file>

<file name="package.json">

<violation number="1" location="package.json:3">
P2: Manual version bump in package.json violates the automated versioning workflow; this should be left for the UpdateVersion automation to keep all version files in sync.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 8c39384e67

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-02-16T02:28:21Z

XMOJ.user.js

+                borderRadius: '0',
                boxShadow: '0 4px 8px rgba(0, 0, 0, 0.5)',
-                margin: '16px auto',
+                margin: '0',
+                maxWidth: '100%',


Gate navbar geometry override behind MonochromeUI

The new NavbarStyler.applyStyles values are now always monochrome (borderRadius: '0', margin: '0', maxWidth: '100%') regardless of the MonochromeUI toggle, so users with NewTopBar enabled but MonochromeUI disabled still get the monochrome top-bar layout. This also conflicts with the non-monochrome overlay styling in createOverlay (which still assumes rounded corners), so the “disable MonochromeUI to restore original styling” behavior is no longer true in this path.

Useful? React with 👍 / 👎.

- Navbar applyStyles now conditionally applies monochrome (flat, full-width) or original (rounded, margin) styles based on MonochromeUI setting - Fixes inconsistency where createOverlay assumed rounded corners but navbar was always flat - Switch Google Fonts CDN from fonts.googleapis.com to fonts.loli.net for China accessibility Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

boomzero · 2026-02-16T02:34:41Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 908a3f07e5

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-02-16T02:40:24Z

XMOJ.user.js

+                                            let Std = StdList ? StdList.find((Element) => {
                                                return Element == Number(PID);
-                                            });
+                                            }) : undefined;


Skip UploadStd when standard list fetch failed

When GetStdList returns Success: false, StdList remains null, but this check treats that state the same as “problem not in list,” so the later else path uploads every AC submission in RefreshResult. In that failure scenario, a transient list-fetch error can trigger redundant UploadStd requests for already-uploaded problems and show misleading [OK]/[ERR] statuses; uploads should be gated on a successful standard-list fetch.

Useful? React with 👍 / 👎.

When GetStdList returns Success: false, StdList remains null. Previously this fell through to the else branch, triggering redundant UploadStd requests for already-uploaded problems. Now the entire upload block is skipped when StdList is null. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

cubic-dev-ai

2 issues found across 2 files (changes from recent commits).

Prompt for AI agents (all issues)


Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="XMOJ.user.js">

<violation number="1" location="XMOJ.user.js:3">
P2: Do not manually edit the userscript @version header. Version numbers are auto-managed by the UpdateVersion workflow and must remain unchanged in PRs.</violation>
</file>

<file name="Update.json">

<violation number="1" location="Update.json:3314">
P2: Update.json version entries are auto-generated; manually adding a new version (3.0.0) violates the repository’s automated versioning workflow. Remove manual edits and let UpdateVersion.js generate the entry.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

cubic-dev-ai · 2026-02-16T03:12:13Z

XMOJ.user.js

 // ==UserScript==
 // @name         XMOJ
-// @version      2.7.3
+// @version      3.0.0


P2: Do not manually edit the userscript @Version header. Version numbers are auto-managed by the UpdateVersion workflow and must remain unchanged in PRs.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At XMOJ.user.js, line 3: <comment>Do not manually edit the userscript @version header. Version numbers are auto-managed by the UpdateVersion workflow and must remain unchanged in PRs.</comment> <file context> @@ -1,6 +1,6 @@ // ==UserScript== // @name XMOJ -// @version 2.7.4 +// @version 3.0.0 // @description XMOJ增强脚本 // @author @XMOJ-Script-dev, @langningchen and the community </file context>

cubic-dev-ai · 2026-02-16T03:12:13Z

Update.json

+            ],
+            "Notes": "Added a new toggleable \"极简黑白界面风格\" (Minimalist Monochrome UI) setting under Beautify options. Features serif typography, zero border-radius, line-based visual structure, and automatic dark mode support with charcoal tones."
+        },
+        "3.0.0": {


P2: Update.json version entries are auto-generated; manually adding a new version (3.0.0) violates the repository’s automated versioning workflow. Remove manual edits and let UpdateVersion.js generate the entry.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At Update.json, line 3314: <comment>Update.json version entries are auto-generated; manually adding a new version (3.0.0) violates the repository’s automated versioning workflow. Remove manual edits and let UpdateVersion.js generate the entry.</comment> <file context> @@ -3310,6 +3310,17 @@ ], "Notes": "Added a new toggleable \"极简黑白界面风格\" (Minimalist Monochrome UI) setting under Beautify options. Features serif typography, zero border-radius, line-based visual structure, and automatic dark mode support with charcoal tones." + }, + "3.0.0": { + "UpdateDate": 1771211353041, + "Prerelease": true, </file context>

boomzero and others added 3 commits February 16, 2026 09:35

pull-request-size bot added the size/L label Feb 16, 2026

hendragon-bot bot added the user-script This issue or pull request is related to the main user script label Feb 16, 2026

github-actions bot added 2 commits February 16, 2026 02:25

2.7.4

ad80452

Update version info to 2.7.4

8c39384

pull-request-size bot added size/XL and removed size/L labels Feb 16, 2026

cubic-dev-ai bot reviewed Feb 16, 2026

View reviewed changes

chatgpt-codex-connector bot reviewed Feb 16, 2026

View reviewed changes

XMOJ-Script-dev deleted a comment from cubic-dev-ai bot Feb 16, 2026

boomzero and others added 4 commits February 16, 2026 10:30

Update font link for MonochromeUI to use alternative CDN

95ee27f

Update time and description of 2.7.4

ea13855

Update time and description of 2.7.4

908a3f0

chatgpt-codex-connector bot reviewed Feb 16, 2026

View reviewed changes

boomzero and others added 4 commits February 16, 2026 11:06

Update time and description of 2.7.4

9368f47

3.0.0

4674c60

Update version info to 3.0.0

dbdfbb2

boomzero merged commit c31dced into dev Feb 16, 2026
6 checks passed

boomzero deleted the monochrome-ui branch February 16, 2026 03:10

cubic-dev-ai bot reviewed Feb 16, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add toggleable Minimalist Monochrome UI#906

Add toggleable Minimalist Monochrome UI#906
boomzero merged 13 commits intodevfrom
monochrome-ui

boomzero commented Feb 16, 2026 •

edited by cubic-dev-ai bot

Loading

Uh oh!

cubic-dev-ai bot left a comment

Uh oh!

chatgpt-codex-connector bot left a comment

Uh oh!

chatgpt-codex-connector bot Feb 16, 2026

Uh oh!

boomzero commented Feb 16, 2026 •

edited by hendragon-bot bot

Loading

Uh oh!

chatgpt-codex-connector bot left a comment

Uh oh!

chatgpt-codex-connector bot Feb 16, 2026

Uh oh!

Uh oh!

cubic-dev-ai bot left a comment

Uh oh!

cubic-dev-ai bot Feb 16, 2026 •

edited

Loading

Uh oh!

cubic-dev-ai bot Feb 16, 2026 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

boomzero commented Feb 16, 2026 • edited by cubic-dev-ai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by cubic

Uh oh!

cubic-dev-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Feb 16, 2026

Choose a reason for hiding this comment

Uh oh!

boomzero commented Feb 16, 2026 • edited by hendragon-bot bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Feb 16, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

cubic-dev-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai bot Feb 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai bot Feb 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

boomzero commented Feb 16, 2026 •

edited by cubic-dev-ai bot

Loading

boomzero commented Feb 16, 2026 •

edited by hendragon-bot bot

Loading

cubic-dev-ai bot Feb 16, 2026 •

edited

Loading

cubic-dev-ai bot Feb 16, 2026 •

edited

Loading