Fix: design and few function

This commit is contained in:
2025-11-27 18:13:06 +05:30
parent 7460157b46
commit c1d0519c09
25 changed files with 1446 additions and 395 deletions

View File

@@ -108,7 +108,7 @@ export default function AccountDetails() {
if (!authorized) return null;
return (
<Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Paper shadow="sm" radius="md" p="md" withBorder h={500}>
<Title order={3} mb="md">
Account Details
</Title>

View File

@@ -168,7 +168,7 @@ export default function AccountStatementPage() {
<Grid gutter="md">
{/* Left side form */}
<Grid.Col span={{ base: 12, md: 4 }}>
<Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Paper shadow="sm" radius="md" p="md" withBorder h={500}>
<Title order={4} mb="sm">Account Transactions</Title>
<Select
label="Select Account Number"
@@ -202,7 +202,7 @@ export default function AccountStatementPage() {
{/* Right side transaction list */}
<Grid.Col span={{ base: 12, md: 8 }}>
<Paper shadow="sm" radius="md" p="md" withBorder h={400} style={{ display: 'flex', flexDirection: 'column' }}>
<Paper shadow="sm" radius="md" p="md" withBorder h={500} style={{ display: 'flex', flexDirection: 'column' }}>
<Title order={5} mb="xs">Account Transactions</Title>
<Group justify="space-between" align="center" mt="sm">
<div>
@@ -291,13 +291,68 @@ export default function AccountStatementPage() {
) : (
// ✅ Desktop View Table Layout
<Table style={{ borderCollapse: "collapse", width: "100%" }}>
<thead style={{ backgroundColor: "#3385ff" }}>
{/* <tr>
<th style={{ ...cellStyle, textAlign: "left", color: "white" }}>Narration</th>
<th style={{ ...cellStyle, textAlign: "left", color: "white" }}>Date</th>
<th style={{ ...cellStyle, textAlign: "right", color: "white" }}>Amount (₹)</th>
<th style={{ ...cellStyle, textAlign: "right", color: "white" }}>Balance (₹)</th>
</tr> */}
<thead
style={{
background: "linear-gradient(56deg, rgba(24,140,186,1) 0%, rgba(62,230,132,1) 86%)",
position: "sticky",
top: 0,
zIndex: 5,
}}
>
<tr>
<th
style={{
...cellStyle,
textAlign: "left",
color: "white",
position: "sticky",
top: 0,
// background: "linear-gradient(56deg, rgba(24,140,186,1) 0%, rgba(62,230,132,1) 86%)",
zIndex: 10,
}}
>
Narration
</th>
<th
style={{
...cellStyle,
textAlign: "left",
color: "white",
position: "sticky",
top: 0,
// background: "linear-gradient(56deg, rgba(24,140,186,1) 0%, rgba(62,230,132,1) 86%)",
zIndex: 10,
}}
>
Date
</th>
<th
style={{
...cellStyle,
textAlign: "right",
color: "white",
position: "sticky",
top: 0,
// background: "linear-gradient(56deg, rgba(24,140,186,1) 0%, rgba(62,230,132,1) 86%)",
zIndex: 10,
}}
>
Amount ()
</th>
<th
style={{
...cellStyle,
textAlign: "right",
color: "white",
position: "sticky",
top: 0,
// background: "linear-gradient(56deg, rgba(24,140,186,1) 0%, rgba(62,230,132,1) 86%)",
zIndex: 10,
}}
>
Balance ()
</th>
</tr>
</thead>
<tbody>
{transactions.map((txn, i) => (

View File

@@ -16,7 +16,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
const [drawerOpened, setDrawerOpened] = useState(false);
const links = [
{ label: "Account Summary", href: "/accounts" },
{ label: " Account Summary", href: "/accounts" },
{ label: "Account Statement ", href: "/accounts/account_statement" },
{ label: "Account Details", href: "/accounts/account_details" },
];
@@ -98,7 +98,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
color="white"
/>
<Text fw={600} c="white">
Send Money
Accounts
</Text>
</Box>
@@ -131,7 +131,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
style={{ borderRadius: "50%" }}
/>
<Text fw={700} ml="10px" style={{ fontSize: "19px", color: "#1565c0" }}>
Send Money
Accounts
</Text>
</Box>

View File

@@ -106,7 +106,7 @@ export default function AccountSummary() {
<ScrollArea>
<Table style={{ borderCollapse: "collapse", width: "100%" }}>
<thead>
<tr style={{ backgroundColor: "#3385ff" }}>
<tr style={{ background: "linear-gradient(56deg, rgba(24,140,186,1) 0%, rgba(62,230,132,1) 86%)", }}>
<th style={{ ...cellStyle, textAlign: "left" }}>Account Type</th>
<th style={{ ...cellStyle, textAlign: "right" }}>Account No.</th>
{title.includes("Deposit Accounts (INR)") ?
@@ -124,7 +124,7 @@ export default function AccountSummary() {
if (!authorized) return null;
return (
<Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Paper shadow="sm" radius="md" p="md" withBorder h={500}>
<Title
order={isMobile ? 4 : 3}
mb="md"
@@ -133,7 +133,7 @@ export default function AccountSummary() {
Account Summary
</Title>
{/* Responsive layout: Group for desktop, Stack for mobile */}
{/* Responsive layout: Group for desktop, Stack for mobile */}
{isMobile ? (
<Stack gap="md">
{depositAccounts.length > 0 &&