Balance Mobile Static Site

Static GitHub Pages-ready balance screen based on the supplied mobile screenshot. It is plain HTML/CSS/JS, so there is no build step.

Files

• index.html is the page GitHub Pages serves.
• styles.css controls the mobile layout.
• config.js contains the default currency, balances, accent color, and transactions.
• app.js handles editing, reset, and the simulated pull-to-refresh interaction with a Safari-style spinner.
• .nojekyll keeps GitHub Pages from processing the site with Jekyll.
• .github/workflows/pages.yml deploys the static site from the main branch.

Edit Defaults

Change the starting currency, balances, current transactions, and older month groups in config.js. Visitors can tap the gear button to edit the visible balances, currency, month groups, and every transaction row. Changes save immediately in the browser. The History row expands and collapses the older months.

Use Hard reset in the Setup sheet to restore the defaults from config.js.

Publish With GitHub Pages

1. Create a new GitHub repository.
2. Upload everything in this folder to the repository root.
3. In GitHub, open Settings -> Pages.
4. Set Source to GitHub Actions.
5. Push to the main branch. The included workflow will deploy the site.

You can also publish without Actions by setting Pages source to Deploy from a branch and choosing the repository root on main.