header & footer

This commit is contained in:
2024-01-16 10:24:21 +01:00
parent 92eacc2764
commit 226beb974f
13 changed files with 101 additions and 41 deletions

View File

@@ -6,6 +6,7 @@ import { BillBadge } from "./BillBadge";
import { BillingLocation } from "../lib/db-types";
import { formatYearMonth } from "../lib/format";
import { formatCurrency } from "../lib/formatStrings";
import Link from "next/link";
export interface LocationCardProps {
location: BillingLocation
@@ -17,19 +18,19 @@ export const LocationCard:FC<LocationCardProps> = ({location: { _id, name, yearM
const monthlyExpense = bills.reduce((acc, bill) => acc + (bill.payedAmount ?? 0), 0);
return(
<div className="card card-compact card-bordered max-w-[36em] bg-base-100 shadow-s my-1">
<div className="card card-compact card-bordered min-w-96 max-w-[36em] bg-base-100 shadow-s my-1">
<div className="card-body">
<a href={`/location/${_id}/edit`} className="card-subtitle tooltip" data-tip="Edit Location">
<Link href={`/location/${_id}/edit`} className="card-subtitle tooltip" data-tip="Edit Location">
<Cog8ToothIcon className="h-[1em] w-[1em] absolute cursor-pointer top-3 right-3 text-2xl" />
</a>
</Link>
<h2 className="card-title mr-[2em]">{formatYearMonth(yearMonth)} {name}</h2>
<div className="card-actions">
{
bills.map(bill => <BillBadge key={`${bill._id}`} locationId={_id} bill={bill} />)
}
<a href={`/bill/${_id}/add`} className="tooltip" data-tip="Add a new bill">
<Link href={`/bill/${_id}/add`} className="tooltip" data-tip="Add a new bill">
<PlusCircleIcon className="h-[1em] w-[1em] cursor-pointer text-2xl" />
</a>
</Link>
</div>
{
monthlyExpense > 0 ?