5c21f131fd
Features (see spec.md v2): - Wire receipt classification into the upload flow; cheap model (Haiku 4.5) is now the default, shown as a footnote with per-scan cost in cents. - Skip-AI toggle to enter fields by hand. - Duplicate-transaction warning: live check on date+amount, gated submit. - Tally tab: person x year totals with margins and grand total. - Recent uploads / recent receipts tabs with paging and file serving. - People reconcile on startup: merge stray partial names (e.g. "Jude" -> "Jude Tremblay"), reassigning receipts; idempotent seeding. - scripts/build.sh builds the binary; scripts/run.sh builds and runs with .env. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
141 lines
3.1 KiB
CSS
141 lines
3.1 KiB
CSS
body {
|
|
font-family: system-ui, sans-serif;
|
|
max-width: 30rem;
|
|
margin: 0 auto;
|
|
padding: 1rem;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: .85rem;
|
|
color: #555;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
h2 { margin-top: 1.5rem; }
|
|
|
|
label {
|
|
display: block;
|
|
margin: 1rem 0 .25rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
input, select {
|
|
font-size: 1.1rem;
|
|
width: 100%;
|
|
padding: .6rem;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
a { color: #1a73e8; }
|
|
small { color: #555; }
|
|
|
|
/* Footnote under the file picker: which model auto-fills the form. */
|
|
.footnote {
|
|
font-size: .8rem;
|
|
color: #555;
|
|
margin: .4rem 0 0;
|
|
}
|
|
.footnote code {
|
|
background: #eee;
|
|
padding: .05rem .3rem;
|
|
border-radius: .25rem;
|
|
}
|
|
.footnote .err-inline { color: #a50e0e; }
|
|
|
|
/* Skip-AI / "add anyway" inline checkboxes. */
|
|
label.check {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: .4rem;
|
|
font-weight: 400;
|
|
font-size: .9rem;
|
|
margin: .5rem 0 0;
|
|
}
|
|
label.check input { width: auto; }
|
|
|
|
/* Possible-duplicate warning panel. */
|
|
.dup-warn {
|
|
background: #fef7e0;
|
|
border: 1px solid #f0c000;
|
|
color: #7a5a00;
|
|
padding: .6rem;
|
|
border-radius: .4rem;
|
|
margin: 1rem 0;
|
|
font-size: .9rem;
|
|
}
|
|
.dup-warn ul { margin: .4rem 0; padding-left: 1.1rem; }
|
|
.dup-warn label.check { color: #7a5a00; font-weight: 600; }
|
|
button.primary:disabled { background: #9aa0a6; }
|
|
|
|
/* Tally matrix. */
|
|
.tally-wrap { overflow-x: auto; }
|
|
table.tally { border-collapse: collapse; width: 100%; font-size: .95rem; }
|
|
table.tally th, table.tally td { padding: .4rem .6rem; border-bottom: 1px solid #eee; }
|
|
table.tally .num { text-align: right; font-variant-numeric: tabular-nums; }
|
|
table.tally thead th { border-bottom: 2px solid #ccc; }
|
|
table.tally tbody th { text-align: left; font-weight: 600; }
|
|
table.tally .total { font-weight: 600; }
|
|
table.tally tfoot { border-top: 2px solid #ccc; }
|
|
table.tally tfoot th, table.tally tfoot td { font-weight: 700; }
|
|
table.tally .grand { color: #137333; }
|
|
table.tally .muted { color: #bbb; }
|
|
|
|
/* Recent lists + tabs + pager. */
|
|
p.tabs a.active { font-weight: 700; text-decoration: none; color: #137333; }
|
|
ul.recent { list-style: none; padding: 0; }
|
|
ul.recent li { padding: .5rem 0; border-bottom: 1px solid #eee; }
|
|
ul.recent small { color: #555; }
|
|
p.pager { margin-top: 1rem; }
|
|
|
|
.err {
|
|
background: #fce8e6;
|
|
color: #a50e0e;
|
|
padding: .6rem;
|
|
border-radius: .4rem;
|
|
margin: .5rem 0;
|
|
}
|
|
|
|
.ok {
|
|
color: #137333;
|
|
font-weight: 600;
|
|
font-size: 1.3rem;
|
|
}
|
|
|
|
/* Full-width primary submit button (upload form). */
|
|
button.primary {
|
|
font-size: 1.1rem;
|
|
width: 100%;
|
|
padding: .6rem;
|
|
margin-top: 1.5rem;
|
|
background: #137333;
|
|
color: #fff;
|
|
border: 0;
|
|
border-radius: .4rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* Links styled as buttons. */
|
|
a.button {
|
|
display: block;
|
|
text-align: center;
|
|
color: #fff;
|
|
padding: .7rem;
|
|
border-radius: .4rem;
|
|
text-decoration: none;
|
|
margin: .75rem 0;
|
|
}
|
|
a.button.green { background: #137333; }
|
|
a.button.blue { background: #1a73e8; }
|
|
|
|
/* Inline rename/add rows on the manage page. */
|
|
form.row {
|
|
display: flex;
|
|
gap: .4rem;
|
|
margin: .3rem 0;
|
|
}
|
|
form.row input { flex: 1; padding: .4rem; }
|
|
form.row button { padding: .4rem .7rem; }
|
|
.add input { border: 1px solid #137333; }
|