chore(release): 4.57.4 [skip ci]

## [4.57.4](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.57.3...v4.57.4) (2025-10-21) ### Bug Fixes * **homepage:** align container width breakpoint with grid columns ([422bf3d](422bf3d968)) * **homepage:** make MiniAbacus fill container properly ([3b5d147](3b5d14765d)) * **homepage:** widen skill cards container to 650px ([bc1ad3a](bc1ad3a43a))
fix(homepage): align container width breakpoint with grid columns
2025-10-21 00:30:13 +00:00 · 2025-10-20 19:29:05 -05:00 · 2025-10-20 19:27:58 -05:00 · 2025-10-20 19:26:45 -05:00 · 2025-10-21 00:25:47 +00:00 · 2025-10-20 19:24:37 -05:00
3 changed files with 22 additions and 6 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,19 @@
+## [4.57.4](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.57.3...v4.57.4) (2025-10-21)
+
+
+### Bug Fixes
+
+* **homepage:** align container width breakpoint with grid columns ([422bf3d](https://github.com/antialias/soroban-abacus-flashcards/commit/422bf3d968b67e4683ac7ea7e487a84513f992f9))
+* **homepage:** make MiniAbacus fill container properly ([3b5d147](https://github.com/antialias/soroban-abacus-flashcards/commit/3b5d14765dfb2d61a76f66ba3ae09695ce88bb6d))
+* **homepage:** widen skill cards container to 650px ([bc1ad3a](https://github.com/antialias/soroban-abacus-flashcards/commit/bc1ad3a43a79570e1f9c61d5118d14ac4c201d71))
+
+## [4.57.3](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.57.2...v4.57.3) (2025-10-21)
+
+
+### Bug Fixes
+
+* **homepage:** increase abacus container width to 120px/150px ([57c212f](https://github.com/antialias/soroban-abacus-flashcards/commit/57c212f4f5be591f712e1c5610e1f323e56e15dd))
+
 ## [4.57.2](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.57.1...v4.57.2) (2025-10-21)


--- a/apps/web/src/app/page.tsx
+++ b/apps/web/src/app/page.tsx
@@ -54,14 +54,14 @@ function MiniAbacus({
  return (
    <div
      className={css({
-        width: '75px',
-        height: '80px',
+        width: '100%',
+        height: '100%',
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
      })}
    >
-      <div className={css({ transform: 'scale(0.6)', transformOrigin: 'center center' })}>
+      <div className={css({ transform: 'scale(0.75)', transformOrigin: 'center center' })}>
        <AbacusReact
          value={values[currentIndex] || 0}
          columns={columns}
@@ -188,7 +188,7 @@ export default function HomePage() {
                  <div
                    className={css({
                      flex: '0 0 auto',
-                      w: { base: '100%', md: '420px' },
+                      w: { base: '100%', lg: '650px' },
                    })}
                  >
                    <h3
@@ -274,7 +274,7 @@ export default function HomePage() {
                              <div
                                className={css({
                                  fontSize: '3xl',
-                                  width: { base: '95px', lg: '110px' },
+                                  width: { base: '120px', lg: '150px' },
                                  minHeight: { base: '115px', lg: '140px' },
                                  display: 'flex',
                                  alignItems: 'center',
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "soroban-monorepo",
-  "version": "4.57.2",
+  "version": "4.57.4",
  "private": true,
  "description": "Beautiful Soroban Flashcard Generator - Monorepo",
  "workspaces": [
Author	SHA1	Message	Date
semantic-release-bot	64e2464ec1	chore(release): 4.57.4 [skip ci] ## [4.57.4](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.57.3...v4.57.4) (2025-10-21) ### Bug Fixes * homepage: align container width breakpoint with grid columns ([`422bf3d`](`422bf3d968`)) * homepage: make MiniAbacus fill container properly ([`3b5d147`](`3b5d14765d`)) * homepage: widen skill cards container to 650px ([`bc1ad3a`](`bc1ad3a43a`))	2025-10-21 00:30:13 +00:00
Thomas Hallock	422bf3d968	fix(homepage): align container width breakpoint with grid columns Changed width breakpoint from md to lg to match when the grid switches to 2 columns. This prevents overflow on medium-width screens where the container was 650px wide but still showing 1-column layout. Now: - Below lg: 100% width, 1 column - At lg+: 650px width, 2 columns 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-20 19:29:05 -05:00
Thomas Hallock	bc1ad3a43a	fix(homepage): widen skill cards container to 650px Increased the "What You'll Learn" container width from 420px to 650px to give the 2-column grid of skill cards proper breathing room and prevent cramped layouts. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-20 19:27:58 -05:00
Thomas Hallock	3b5d14765d	fix(homepage): make MiniAbacus fill container properly Fixed skill card abacus sizing by: - Changing MiniAbacus to use width/height 100% instead of fixed 75px/80px - Increased scale from 0.6 to 0.75 for better visibility - Now properly fills the 120px/150px container set on the wrapper This fixes the clipping issue by making the component hierarchy work correctly: outer container (120px/150px) -> MiniAbacus (100%) -> scaled AbacusReact 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-20 19:26:45 -05:00
semantic-release-bot	9847f8f461	chore(release): 4.57.3 [skip ci] ## [4.57.3](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.57.2...v4.57.3) (2025-10-21) ### Bug Fixes * homepage: increase abacus container width to 120px/150px ([`57c212f`](`57c212f4f5`))	2025-10-21 00:25:47 +00:00
Thomas Hallock	57c212f4f5	fix(homepage): increase abacus container width to 120px/150px Increase abacus container width from 95px/110px to 120px (mobile) and 150px (desktop) to properly accommodate 3-column abacus visualizations without clipping. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-20 19:24:37 -05:00