Theme-AtCoder

AtCoderのWAやTLEの表示をテーマ別に装飾する拡張機能(ハロウィン、春など)

Aby zainstalować ten skrypt, wymagana jest instalacje jednego z następujących rozszerzeń: Tampermonkey, Greasemonkey lub Violentmonkey.

You will need to install an extension such as Tampermonkey to install this script.

Aby zainstalować ten skrypt, wymagana jest instalacje jednego z następujących rozszerzeń: Tampermonkey, Violentmonkey.

Aby zainstalować ten skrypt, wymagana będzie instalacja rozszerzenia Tampermonkey lub Userscripts.

You will need to install an extension such as Tampermonkey to install this script.

Aby zainstalować ten skrypt, musisz zainstalować rozszerzenie menedżera skryptów użytkownika.

(Mam już menedżera skryptów użytkownika, pozwól mi to zainstalować!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

Będziesz musiał zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

Będziesz musiał zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

Musisz zainstalować rozszerzenie menedżera stylów użytkownika, aby zainstalować ten styl.

(Mam już menedżera stylów użytkownika, pozwól mi to zainstalować!)

Autor
mimiminomi
Dziennych instalacji
0
Wszystkich instalacji
7
Oceny
0 0 0
Wersja
2.0.5
Utworzono
21-10-2025
Zaktualizowano
28-03-2026
Rozmiar
34,6 KB
Licencja
MIT
Dotyczy

🎃 Theme AtCoder Extension

AtCoderのジャッジ結果(WA、TLE、MLE、RE、CE、AC)を季節のテーマで装飾する拡張機能です。

現在対応しているテーマ:

  • 🎃 ハロウィン(10月1日〜11月7日)
  • 🌸 春/桜(3月20日〜4月30日)

Install from GreasyFork GitHub Repository

🎃 プレビュー

提出一覧や、提出結果などでかわいく装飾されます!

image image
image

🚀 インストール方法

  1. Tampermonkey などのスクリプトマネージャーをインストール
  2. Install from GreasyFork からインストール

🎯 対象サイト

🛠️ 技術仕様

  • 対応ブラウザ: Chrome, Firefox, Safari, Edge
  • 依存関係: なし
  • 権限: なし(DOM操作のみ)
  • 装飾内容:
    • WA/TLE/MLE/RE/CE: かぼちゃマーク付きの背景グラデーション
    • AC: キャンディマークとおばけマーク付きの背景グラデーション
    • ページ動的更新に対応(MutationObserver利用)

📝 使用方法

  • ページを開くだけで自動で装飾が適用されます
  • ステータスを右クリック(ACなど)することで設定の編集が行えます

🔧 開発者向け

ファイル構造

src/
├── themes/
│   ├── halloween.js    # ハロウィンテーマ定義
│   └── spring.js       # 春テーマ定義
├── config.js           # 設定管理
├── themeManager.js     # テーマ選択・管理ロジック
├── decorator.js        # 装飾適用ロジック
└── main.js            # エントリーポイント
build.js               # ビルドスクリプト
.user.js              # ビルド後のユーザースクリプト

ビルド方法

npm run build

新しいテーマの追加方法

  1. src/themes/ に新しいテーマファイルを作成
  2. src/themeManager.jsthemes オブジェクトに追加
  3. build.jsfiles 配列に追加
  4. npm run build でビルド

📝 ライセンス

MIT License

🛠️ 作者

twitter: @_mimiminomi


Happy Halloween! 🎃👻🍭