docs: add Bitcount Prop Single font template from befailproof.ai#390
Open
NiveditJain wants to merge 4 commits into
Open
docs: add Bitcount Prop Single font template from befailproof.ai#390NiveditJain wants to merge 4 commits into
NiveditJain wants to merge 4 commits into
Conversation
Reusable title/wordmark treatment recovered from the web platform: a next/font/google loader (fonts.ts.example) plus framework-agnostic bitcount.css (.bitcount-title class, tunable knobs, self-host @font-face). Fine-tuned instance wght 417 / ELSH 55, scaleX 0.9, 0.08em tracking, lowercase. Shipped under templates/ with a .ts.example extension so repo tsc/eslint skip it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
📝 WalkthroughWalkthroughAdds a Bitcount Prop Single font template: self-hostable CSS with tuning variables and ChangesBitcount Font Template
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Comment |
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
templates/bitcount-font/README.md (1)
25-34: ⚡ Quick winAdd blank line before the table.
The table at line 26 should be surrounded by blank lines per Markdown best practices.
📝 Proposed fix
## Tuning knobs (`:root` in `bitcount.css`) + | Variable | Default | Effect | |---|---|---|As per coding guidelines (implied by static analysis): Tables should be surrounded by blank lines for proper Markdown rendering.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@templates/bitcount-font/README.md` around lines 25 - 34, The Markdown table starting at the line with header "| Variable | Default | Effect |" must be surrounded by blank lines; edit the README content so there's an empty line before that table (i.e., between the "## Tuning knobs (`:root` in `bitcount.css`)" heading and the "| Variable | Default | Effect |" row) and an empty line after the table (i.e., before the "To re-tune the glyph shape itself..." paragraph), leaving the table contents and the `:root` / `.bitcount-title` references unchanged.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@templates/bitcount-font/README.md`:
- Around line 25-34: The Markdown table starting at the line with header "|
Variable | Default | Effect |" must be surrounded by blank lines; edit the
README content so there's an empty line before that table (i.e., between the "##
Tuning knobs (`:root` in `bitcount.css`)" heading and the "| Variable | Default
| Effect |" row) and an empty line after the table (i.e., before the "To re-tune
the glyph shape itself..." paragraph), leaving the table contents and the
`:root` / `.bitcount-title` references unchanged.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: dde05fec-7b24-48b5-ac21-7618539f089d
📒 Files selected for processing (4)
CHANGELOG.mdtemplates/bitcount-font/README.mdtemplates/bitcount-font/bitcount.csstemplates/bitcount-font/fonts.ts.example
Self-contained demo page (loads the font via the validated Google Fonts CDN URL + the artifact's bitcount.css) showing the .bitcount-title treatment at fluid sizes. Verified rendering across 320/375/768/1280/1920px viewports with a headless browser. Also fills in the verified CDN @import URL note in bitcount.css. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@templates/bitcount-font/preview.html`:
- Around line 54-57: Replace the non-semantic demo text blocks with real heading
elements: change the elements that currently use the classes "hero
bitcount-title", "h1 bitcount-title", "h2 bitcount-title", and "h3
bitcount-title" from generic <div>/<span> to semantic <h1>, <h2>, <h3> (use <h1>
for the hero/wordmark if appropriate) while preserving the existing classes and
label wrapper structure so styling/JS keeps working; apply the same change to
the similar instances mentioned (lines 62-64).
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 606d2c16-f144-421f-abdc-1f0143c1390d
📒 Files selected for processing (3)
CHANGELOG.mdtemplates/bitcount-font/bitcount.csstemplates/bitcount-font/preview.html
✅ Files skipped from review due to trivial changes (1)
- CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (1)
- templates/bitcount-font/bitcount.css
Address CodeRabbit a11y feedback on PR #390: the demo's heading-styled text used <div>/<span>; switch to real <h1>-<h4> in <section> wrappers (classes preserved). Add a .stack heading reset (margin:0; font-weight:inherit) so the size classes + .bitcount-title still drive rendering — verified identical layout at 375 and 1280px. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds a reusable Bitcount Prop Single font template under
templates/bitcount-font/, capturing the title/wordmark treatment from befailproof.ai so the exact settings can be reused elsewhere.Contents
bitcount.css—.bitcount-titleclass + tunable:rootknobs (--title-scale0.9,--title-squish0.9,--title-tracking0.08em) + a self-host@font-face. Framework-agnostic.fonts.ts.example— Next.jsnext/font/googleloader (axes: [ELSH], exposes--font-bitcount). Uses the.ts.exampleextension so the repo tsc/eslint skip it.preview.html— self-contained demo page (loads the font via the validated Google Fonts CDN URL plus the artifact bitcount.css) showing.bitcount-titleat fluid sizes.README.md— usage for Next and non-Next, knob table, provenance.Fine-tuned instance
font-variation-settings: "wght" 417, "ELSH" 55(slnt 0),scaleX(0.9),letter-spacing: 0.08em, lowercase.Verification
Rendered
preview.htmlon a local server and captured screenshots across 320 / 375 / 768 / 1280 / 1920px viewports with a headless browser — the dot-matrix Bitcount font loads and the treatment scales cleanly at every size, with no console errors.Provenance / caveat
Recovered from the befailproof.ai web platform (PR #374) session. Axis values verified against the final iteration (earlier passes: wght 413/414, ELSH 51.4). The exact
--title-scaleapplication and fallback stack are reconstructed from the session.🤖 Generated with Claude Code
Summary by CodeRabbit
New Features
Documentation