admin2/openfreebooks-bookgenerator
1
0
Fork 0
mirror of https://github.com/HananoshikaYomaru/openfreebooks.git synced 2026-11-12 20:45:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Enhance math content and widget responsiveness: Add detailed explanations for calculating remainders in written calculation chapters, including examples in _index.md and core.html. Update SKILL.md to include mobile-first demo responsiveness guidelines for all widgets. Revise styles in chapter.scss to improve mobile layout and introduce a mobile toggle for the vertical arithmetic workbench. Update feed.xml and sitemap.xml to reflect recent content additions and modifications.

Browse source
This commit is contained in:
Hananoshika Yomaru 2026-05-22 00:32:28 -07:00
parent 30b4f4cf53
commit 61963350e7
9 changed files with 231 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

6
.agents/skills/ofb/SKILL.md
View file

@ -52,6 +52,7 @@ bun run build # production: JS + Zola + pagefind → public/
| Graph | `graph.edges` must be **acyclic**; builder throws on cycles |
| Chart axes (all widgets) | Every coordinate chart must render **x/y axis labels, positive-direction arrowheads, and visible graduations (ticks + scale labels)**. Apply this consistently across all subjects/widgets. |
| Accessibility | Avoid decorative characters that may render as emoji on mobile. Prefer broadly supported symbols/text so desktop and mobile stay visually consistent. |
| Demo responsiveness (all widgets) | Mobile-first: keep demo viewport short, reserve stage/canvas height up front to avoid CLS, and never let status/controls overlap or block the interactive area. Use collapsible/toggle controls on small screens when needed. |
## Common tasks → where to edit
@ -139,6 +140,11 @@ Live chapters live under `content/{subject}/{slug}/`:
**Dialog/modals in widgets:** when adding a `<dialog>` in chapter widgets, use the shared modal pattern and classes from `themes/openfreebooks/sass/_contributors.scss` (`contributor-dialog`, `contributor-dialog-panel`, `contributor-dialog-close`) as the base style, keep the dialog centered in modal mode, and only layer minimal widget-specific overrides on top.
**Widget layout standards (all subjects):**
- Keep the primary demo stage visible without long pre-scroll on mobile.
- Reserve stage space from first render (`min-height`/fixed aspect) so hydration or assets do not shift nearby content.
- Keep feedback UI (step badges, status, toolbars) outside the canvas interaction area, or anchored so they never occlude controls/content.
### Interactive demo technology choices
Interactive demos can use different technologies based on the learning goal and interaction type: