feat(cashier): add CBS Blue Warm Stone theme, validations, non-individual support, and custom alert modal
- Replace table grid with ws-wrap card-form layout (Warm Stone / CBS Blue design) - Add day-status blocking banners (previousDayUnsettled, morningTransferReceived) - Add custom styled alert modal replacing browser alert() — error/warning/info/success types - Add Non-Individual Account Details section with Partners table (click-to-view signature/image) - Fix denomination overdraft inline alert in Closing Position panel - Fix bannedEntityMatch/willfulDefaulter false positive (DB stores YES/NO strings) - Fix denomination mismatch 403 — only send denomination when cash payment matches amount - Fix Today's Activity for CA accounts (m_current_account_transaction, remarks column, type=7 label) - Fix A/C TYPE [object Object] — map from acTyp label - Fix charge deduction sign — use transactionType.deposit instead of withdrawal - Remove Add Row buttons everywhere - CBS Blue theme variables: focus #2563eb, accent #e87722, Hanken Grotesk + Newsreader fonts Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jaanu423
co-authored by
Claude Sonnet 4.6
Claude Sonnet 4.6
parent
f64047080a
commit
f7d9259eb7
@@ -60,31 +60,31 @@
|
||||
}
|
||||
}
|
||||
|
||||
// ── Entry Grid Card ───────────────────────────────────────────────────────────
|
||||
// ── CBS Blue Transaction Entry ────────────────────────────────────────────────
|
||||
|
||||
// ── Warm Stone Transaction Entry ─────────────────────────────────────────────
|
||||
|
||||
$ws-ink: #2c2723;
|
||||
$ws-canvas: #f3f0e9;
|
||||
$ws-card: #fffefb;
|
||||
$ws-border: #e7e0d2;
|
||||
$ws-accent: #b45309;
|
||||
$ws-text: #3a322a;
|
||||
$ws-muted: #8a7e6e;
|
||||
$ws-micro: #a89a85;
|
||||
$ws-dr: #b0412a;
|
||||
$ws-cr: #4f7d3a;
|
||||
$ws-divider: #ece4d6;
|
||||
$ws-fld-bg: #faf8f2;
|
||||
$ws-fld-bd: #e6dfd0;
|
||||
$ws-ink: #0d1b2e; // nav bar dark navy
|
||||
$ws-ink2: #162542; // slightly lighter navy (menu bar)
|
||||
$ws-canvas: #f0f4f9; // page bg — light blue-grey
|
||||
$ws-card: #fff;
|
||||
$ws-border: #dce4ef;
|
||||
$ws-accent: #e87722; // CBS orange — buttons only
|
||||
$ws-focus: #2563eb; // CBS blue — field focus ring
|
||||
$ws-text: #1a2a3e;
|
||||
$ws-muted: #5a7089;
|
||||
$ws-micro: #7a95b0;
|
||||
$ws-dr: #c0392b;
|
||||
$ws-cr: #1a7a4a;
|
||||
$ws-divider: #dde6f0;
|
||||
$ws-fld-bg: #f4f7fc;
|
||||
$ws-fld-bd: #c8d8eb;
|
||||
|
||||
.ws-wrap {
|
||||
background: $ws-canvas;
|
||||
border-radius: 14px;
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
box-shadow:
|
||||
0 1px 2px rgb(80 60 30 / 5%),
|
||||
0 10px 26px -14px rgb(90 70 40 / 20%);
|
||||
0 1px 3px rgb(13 27 46 / 8%),
|
||||
0 8px 24px -10px rgb(13 27 46 / 18%);
|
||||
border: 1px solid $ws-border;
|
||||
font-family: 'Hanken Grotesk', Inter, sans-serif;
|
||||
}
|
||||
@@ -95,9 +95,9 @@ $ws-fld-bd: #e6dfd0;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 18px;
|
||||
height: 52px;
|
||||
background: $ws-ink;
|
||||
border-bottom: 2px solid #211d19;
|
||||
height: 48px;
|
||||
background: linear-gradient(90deg, #0d1b2e 0%, #162542 100%);
|
||||
border-bottom: 2px solid $ws-accent;
|
||||
|
||||
&__left {
|
||||
display: flex;
|
||||
@@ -112,9 +112,9 @@ $ws-fld-bd: #e6dfd0;
|
||||
}
|
||||
|
||||
&__icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 8px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border-radius: 7px;
|
||||
background: $ws-accent;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -127,9 +127,9 @@ $ws-fld-bd: #e6dfd0;
|
||||
|
||||
&__title {
|
||||
font-family: Newsreader, Georgia, serif;
|
||||
font-size: 17px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #f4ece0;
|
||||
color: #e8f0fb;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
|
||||
@@ -138,26 +138,27 @@ $ws-fld-bd: #e6dfd0;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
font-size: 11.5px;
|
||||
color: #b6a591;
|
||||
color: #7a95b0;
|
||||
|
||||
svg {
|
||||
stroke: #8a7e6e;
|
||||
stroke: #5a7589;
|
||||
}
|
||||
}
|
||||
|
||||
&__date {
|
||||
height: 28px;
|
||||
padding: 0 8px;
|
||||
border: 1px solid #3d342e;
|
||||
border-radius: 7px;
|
||||
background: #1a1512;
|
||||
color: #f4ece0;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #2a4060;
|
||||
border-radius: 6px;
|
||||
background: #0a1628;
|
||||
color: #e8f0fb;
|
||||
font-family: 'Hanken Grotesk', monospace;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
outline: none;
|
||||
|
||||
&:focus {
|
||||
border-color: $ws-accent;
|
||||
border-color: $ws-focus;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -205,12 +206,45 @@ $ws-fld-bd: #e6dfd0;
|
||||
}
|
||||
}
|
||||
|
||||
&--ghost {
|
||||
background: #fff;
|
||||
color: $ws-text;
|
||||
border: 1px solid $ws-border;
|
||||
font-size: 12px;
|
||||
|
||||
&:hover {
|
||||
background: $ws-canvas;
|
||||
border-color: #a8bdd4;
|
||||
}
|
||||
}
|
||||
|
||||
&--exit {
|
||||
color: $ws-dr;
|
||||
border-color: rgb(192 57 43 / 30%);
|
||||
|
||||
&:hover {
|
||||
background: #fef2f0;
|
||||
border-color: $ws-dr;
|
||||
}
|
||||
}
|
||||
|
||||
&--mode {
|
||||
background: $ws-ink;
|
||||
color: #c8daf0;
|
||||
border: 1px solid #2a4060;
|
||||
font-size: 12px;
|
||||
|
||||
&:hover {
|
||||
background: $ws-ink2;
|
||||
}
|
||||
}
|
||||
|
||||
&--post {
|
||||
background: $ws-accent;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
padding: 8px 20px;
|
||||
box-shadow: 0 2px 8px rgb(180 83 9 / 30%);
|
||||
box-shadow: 0 2px 8px rgb(232 119 34 / 30%);
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
filter: brightness(1.08);
|
||||
@@ -246,15 +280,15 @@ $ws-fld-bd: #e6dfd0;
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
border-color: #cdbfa6;
|
||||
box-shadow: 0 2px 10px rgb(90 70 40 / 8%);
|
||||
border-color: #a8bdd4;
|
||||
box-shadow: 0 2px 10px rgb(13 27 46 / 8%);
|
||||
}
|
||||
|
||||
&--active {
|
||||
border-color: $ws-accent;
|
||||
box-shadow:
|
||||
0 0 0 3px rgb(180 83 9 / 12%),
|
||||
0 2px 10px rgb(90 70 40 / 10%);
|
||||
0 0 0 3px rgb(232 119 34 / 14%),
|
||||
0 2px 10px rgb(13 27 46 / 10%);
|
||||
}
|
||||
|
||||
&__badge {
|
||||
@@ -263,7 +297,7 @@ $ws-fld-bd: #e6dfd0;
|
||||
height: 26px;
|
||||
border-radius: 50%;
|
||||
background: $ws-ink;
|
||||
color: #f4ece0;
|
||||
color: #c8daf0;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
display: flex;
|
||||
@@ -286,7 +320,7 @@ $ws-fld-bd: #e6dfd0;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #c4b8a8;
|
||||
color: #9ab0c8;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -349,14 +383,14 @@ $ws-fld-bd: #e6dfd0;
|
||||
font-family: Newsreader, Georgia, serif;
|
||||
font-style: italic;
|
||||
font-size: 11px;
|
||||
color: #b6a791;
|
||||
color: #7a95b0;
|
||||
padding-bottom: 1px;
|
||||
}
|
||||
|
||||
.ws-vdivider {
|
||||
width: 1px;
|
||||
background: $ws-divider;
|
||||
margin: 18px 12px 0;
|
||||
margin: 18px 10px 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -432,7 +466,7 @@ $ws-fld-bd: #e6dfd0;
|
||||
white-space: nowrap;
|
||||
|
||||
&--accent {
|
||||
color: $ws-accent;
|
||||
color: $ws-focus;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -453,12 +487,12 @@ $ws-fld-bd: #e6dfd0;
|
||||
box-sizing: border-box;
|
||||
|
||||
&:hover {
|
||||
border-color: #cdbfa6;
|
||||
border-color: #9ab5d0;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
border-color: $ws-accent;
|
||||
box-shadow: 0 0 0 3px rgb(180 83 9 / 13%);
|
||||
border-color: $ws-focus;
|
||||
box-shadow: 0 0 0 3px rgb(37 99 235 / 12%);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
@@ -469,13 +503,13 @@ $ws-fld-bd: #e6dfd0;
|
||||
}
|
||||
|
||||
&--accent {
|
||||
color: $ws-accent;
|
||||
color: $ws-text;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&--req {
|
||||
border-color: #e0a060;
|
||||
background: #fdf6ee;
|
||||
border-color: #f97316;
|
||||
background: #fff7ed;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -497,8 +531,8 @@ select.ws-f__ctl {
|
||||
box-shadow 0.15s;
|
||||
|
||||
&:focus-within {
|
||||
border-color: $ws-accent;
|
||||
box-shadow: 0 0 0 3px rgb(180 83 9 / 13%);
|
||||
border-color: $ws-focus;
|
||||
box-shadow: 0 0 0 3px rgb(37 99 235 / 12%);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
@@ -591,7 +625,7 @@ select.ws-f__ctl {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px 18px;
|
||||
background: $ws-card;
|
||||
background: linear-gradient(180deg, #f4f7fc, #edf2f9);
|
||||
border-top: 1px solid $ws-divider;
|
||||
|
||||
&__stats {
|
||||
|
||||
Reference in New Issue
Block a user