From 6e315decfcaaa72b40853facee78a8cff4f7ce92 Mon Sep 17 00:00:00 2001 From: Claude Date: Sat, 12 Sep 2026 20:32:45 +0000 Subject: [PATCH 1/2] Restyle the blood infuser, accumulator and broom modifier appendices Follows the restyle in cyclops-infobook-html, which lays out all recipe appendices from one set of shared rules. The blood infuser and environmental accumulator recipes no longer need their own icon offsets here, and the blood infuser shows the required tier next to the machine instead of at a fixed pixel offset. Broom modifiers become rows of items with their modifier counts. The config sets border to the same value as outer_background, which is too dark for the page frame and for links on parchment, so this overrides those tokens with the purple and red from the book instead. Also fixes the favicon, which pointed at assets/icons/evilcraft__dark_dark_gem.png and returned a 404, and shows the book item next to the book name in the header through the new bookIconItem option. Co-Authored-By: Claude Opus 5 Claude-Session: https://claude.ai/code/session_01FuDB4UAnaLnNEEv8kVuotH --- assets/styles-evilcraft.css | 96 ++++++++++++++++++++++++------------- config.json | 3 +- 2 files changed, 64 insertions(+), 35 deletions(-) diff --git a/assets/styles-evilcraft.css b/assets/styles-evilcraft.css index ce86d6ea..0669b4b5 100644 --- a/assets/styles-evilcraft.css +++ b/assets/styles-evilcraft.css @@ -1,55 +1,83 @@ -.blood-infuser-recipe, -.envir-acc-recipe, -.broom-modifier { - width: 300px; +/* + * EvilCraft specific appendix styles. + * + * The blood infuser and environmental accumulator recipes are laid out by the shared + * recipe rules in the base stylesheet, so only the tier icon and the broom modifiers + * are styled here, next to a few token overrides for the EvilCraft palette. + */ + +:root { + /* The config sets border to the same value as the outer background, which is too dark + for the page frame and for links on parchment, so those are given their own values. */ + --frame: var(--color-border-light); + --link: #8a1c1c; + --link-hover: #300707; + --button-border: #6e509f; + --page-line: color-mix(in srgb, #6e509f 35%, var(--page)); + --ink: #2b1f1f; } -.appendix .blood-infuser-recipe .appendix-icon, -.appendix .envir-acc-recipe .appendix-icon { - position: relative; - top: 10px; - left: 133px; - margin-bottom: -28px; - z-index: 10; +/* ---------- Blood infuser ---------- */ + +/* The required tier is shown next to the machine, above the arrow. */ +.appendix .blood-infuser-recipe { + grid-template-areas: + 'inputs icon tier output' + 'inputs arrow arrow output' + 'inputs duration duration output'; } .appendix .blood-infuser-recipe .tier-icon { - position: relative; - top: 4px; - left: 166px; - margin-bottom: -28px; - z-index: 10; + grid-area: tier; + align-self: end; + position: static; + margin: 0; } -.appendix .blood-infuser-recipe .recipe-duration, -.appendix .envir-acc-recipe .recipe-duration { - font-size: 10px; - position: relative; - top: 36px; +.appendix .blood-infuser-recipe .tier-icon:empty { + display: none; +} + +/* ---------- Broom modifiers ---------- */ + +.broom-modifier { + width: auto; + text-align: left; + font-size: 14px; } .broom-modifier .broom-modifier-name { - font-weight: bold; + font-weight: 700; + color: var(--color-h); } .broom-modifier .items { - font-size: 18px; - list-style-type: none; - margin: 0; + list-style: none; + margin: 6px 0 0; padding: 0; + display: flex; + flex-wrap: wrap; + gap: 4px 10px; } -.broom-modifier-modifier { - margin-left: 4px; - vertical-align: center; - position: relative; - top: -8px; +.broom-modifier .items li { + display: flex; + align-items: center; + gap: 4px; } -.broom-modifier-modifier::before { - content: "x"; +.broom-modifier .broom-modifier-item { + display: inline-flex; } -.broom-modifier .broom-modifier-item { - display: inline-block; +.broom-modifier-modifier { + position: static; + margin: 0; + font-family: var(--font-mono); + font-size: 12px; + color: var(--ink-muted); +} + +.broom-modifier-modifier::before { + content: '\00d7'; } diff --git a/config.json b/config.json index 859cf581..3f32aa9b 100644 --- a/config.json +++ b/config.json @@ -17,7 +17,8 @@ "main_background": "#fcefe3", "outer_background": "#110c1f" }, - "icon": "https://evilcraft.rubensworks.net/book/assets/icons/evilcraft__dark_dark_gem.png", + "icon": "https://evilcraft.rubensworks.net/book/assets/icon/evilcraft__dark_gem.png", + "bookIconItem": "evilcraft:origins_of_darkness", "modId": "evilcraft", "modName": "EvilCraft", "modUrl": "https://evilcraft.rubensworks.net/", From 866a996370daf7da56ac6c4285d9f99dddc4548c Mon Sep 17 00:00:00 2001 From: Claude Date: Sun, 13 Sep 2026 04:23:07 +0000 Subject: [PATCH 2/2] Bump cyclops-infobook-html to 6.0.0 The restyle landed as a major release, so the caret range on 5.2.0 does not pick it up. This stylesheet needs the shared recipe layout from that release. Co-Authored-By: Claude Opus 5 Claude-Session: https://claude.ai/code/session_01FuDB4UAnaLnNEEv8kVuotH --- package-lock.json | 22 +++++++++++++++++----- package.json | 2 +- 2 files changed, 18 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index 603a9663..b3b65481 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "1.0.0", "license": "MIT", "dependencies": { - "cyclops-infobook-html": "^5.2.0", + "cyclops-infobook-html": "^6.0.0", "pug": "^2.0.4" }, "devDependencies": { @@ -1044,9 +1044,9 @@ } }, "node_modules/cyclops-infobook-html": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/cyclops-infobook-html/-/cyclops-infobook-html-5.2.0.tgz", - "integrity": "sha512-ksStkiEa4wNNubCbFhX/qW0A1asbB2IG3l6xUJLIwMVKrZ97S3RPbul2kcky1vsbt6zz3rS1ja3E4p4NJrnMQg==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/cyclops-infobook-html/-/cyclops-infobook-html-6.0.0.tgz", + "integrity": "sha512-TUiAg7jlozbE9EXCWK+Tv9EkFcFjYP+Ien0o3B4AiLlcVVNWIWMVnP5tT6uSnpeAFJJTV4hsx95FkVpGlCxVaw==", "license": "MIT", "dependencies": { "@types/minimist": "^1.2.0", @@ -1066,7 +1066,7 @@ "pug": "^3.0.0", "rimraf": "^3.0.0", "xml2js": "^0.4.19", - "yauzl": "^2.10.0" + "yauzl": "^3.3.1" }, "bin": { "compress-icons": "bin/compress-icons.js", @@ -1262,6 +1262,18 @@ "node": ">= 10.0.0" } }, + "node_modules/cyclops-infobook-html/node_modules/yauzl": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-3.4.0.tgz", + "integrity": "sha512-jIH9yLR9wqr0wOS0TpBvo/g/2UgZH5qePVbjgRliiF0BYvOZyaBknKsF+x9Iht0O6sqgnB93rCICdOZFecJuDw==", + "license": "MIT", + "dependencies": { + "pend": "~1.2.0" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/decamelize": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz", diff --git a/package.json b/package.json index ffebe9c0..af8d05e1 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "generate:compress": "compress-icons output" }, "dependencies": { - "cyclops-infobook-html": "^5.2.0", + "cyclops-infobook-html": "^6.0.0", "pug": "^2.0.4" } }