whekin/household-bot
1
0
Fork 0
mirror of https://github.com/whekin/household-bot.git synced 2026-03-31 15:54:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(miniapp): tighten overview screen density

Browse Source
This commit is contained in:
whekin
2026-03-11 19:58:09 +04:00
parent 53d9dea48d
commit ac48cece8a
3 changed files with 47 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
apps/miniapp/src/index.css
View File

@@ -284,6 +284,12 @@ button {
gap: 12px;
}
.summary-card-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.panel {
border-radius: 24px;
padding: 18px;
@@ -904,11 +910,7 @@ button {
padding: 32px 24px 40px;
}
.home-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.home-grid--summary {
.summary-card-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}

2
apps/miniapp/src/screens/balances-screen.tsx
View File

@@ -94,7 +94,7 @@ export function BalancesScreen(props: Props) {
</article>
)}
</Show>
<div class="home-grid home-grid--summary">
<div class="summary-card-grid">
<FinanceSummaryCards
dashboard={props.dashboard}
utilityTotalMajor={props.utilityTotalMajor}

74
apps/miniapp/src/screens/home-screen.tsx
View File

@@ -46,46 +46,50 @@ type Props = {
export function HomeScreen(props: Props) {
if (!props.dashboard) {
return (
<div class="home-grid home-grid--summary">
<article class="stat-card">
<span>{props.copy.remainingLabel ?? ''}</span>
<strong>—</strong>
</article>
<article class="stat-card">
<span>{props.copy.shareRent ?? ''}</span>
<strong>—</strong>
</article>
<article class="stat-card">
<span>{props.copy.shareUtilities ?? ''}</span>
<strong>—</strong>
</article>
<article class="stat-card">
<span>{props.copy.purchasesTitle ?? ''}</span>
<strong>—</strong>
</article>
<div class="home-grid">
<div class="summary-card-grid">
<article class="stat-card">
<span>{props.copy.remainingLabel ?? ''}</span>
<strong>—</strong>
</article>
<article class="stat-card">
<span>{props.copy.shareRent ?? ''}</span>
<strong>—</strong>
</article>
<article class="stat-card">
<span>{props.copy.shareUtilities ?? ''}</span>
<strong>—</strong>
</article>
<article class="stat-card">
<span>{props.copy.purchasesTitle ?? ''}</span>
<strong>—</strong>
</article>
</div>
</div>
)
}
return (
<div class="home-grid home-grid--summary">
<FinanceSummaryCards
dashboard={props.dashboard}
utilityTotalMajor={props.utilityTotalMajor}
purchaseTotalMajor={props.purchaseTotalMajor}
labels={{
remaining: props.copy.remainingLabel ?? '',
rent: props.copy.shareRent ?? '',
utilities: props.copy.shareUtilities ?? '',
purchases: props.copy.purchasesTitle ?? ''
}}
/>
<Show when={props.readyIsAdmin}>
<article class="stat-card">
<span>{props.copy.pendingRequests ?? ''}</span>
<strong>{String(props.pendingMembersCount)}</strong>
</article>
</Show>
<div class="home-grid">
<div class="summary-card-grid">
<FinanceSummaryCards
dashboard={props.dashboard}
utilityTotalMajor={props.utilityTotalMajor}
purchaseTotalMajor={props.purchaseTotalMajor}
labels={{
remaining: props.copy.remainingLabel ?? '',
rent: props.copy.shareRent ?? '',
utilities: props.copy.shareUtilities ?? '',
purchases: props.copy.purchasesTitle ?? ''
}}
/>
<Show when={props.readyIsAdmin}>
<article class="stat-card">
<span>{props.copy.pendingRequests ?? ''}</span>
<strong>{String(props.pendingMembersCount)}</strong>
</article>
</Show>
</div>
<Show
when={props.currentMemberLine}