feat: add recurring places and transaction pagination
Build MoneyMap image / build-and-push (push) Failing after 4s
Build MoneyMap image / build-and-push (push) Failing after 4s
This commit is contained in:
+431
-431
@@ -1,431 +1,431 @@
|
||||
/* ============================================
|
||||
MoneyMap – Modern Fintech Light Theme
|
||||
============================================ */
|
||||
|
||||
/* --- Palette (CSS custom properties) --- */
|
||||
:root {
|
||||
--mm-bg: #f7f8fc;
|
||||
--mm-surface: #ffffff;
|
||||
--mm-primary: #6366f1;
|
||||
--mm-primary-hover:#4f46e5;
|
||||
--mm-primary-soft: rgba(99,102,241,0.10);
|
||||
--mm-success: #10b981;
|
||||
--mm-success-soft: rgba(16,185,129,0.10);
|
||||
--mm-danger: #ef4444;
|
||||
--mm-danger-soft: rgba(239,68,68,0.10);
|
||||
--mm-warning: #f59e0b;
|
||||
--mm-warning-soft: rgba(245,158,11,0.10);
|
||||
--mm-info: #06b6d4;
|
||||
--mm-info-soft: rgba(6,182,212,0.10);
|
||||
--mm-text: #1e293b;
|
||||
--mm-text-secondary: #64748b;
|
||||
--mm-border: #e2e8f0;
|
||||
--mm-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
|
||||
--mm-shadow: 0 4px 12px rgba(0,0,0,0.06);
|
||||
--mm-radius: 12px;
|
||||
--mm-radius-sm: 8px;
|
||||
}
|
||||
|
||||
/* --- Base --- */
|
||||
html {
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
min-height: 100%;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
html { font-size: 16px; }
|
||||
}
|
||||
|
||||
body {
|
||||
margin-bottom: 60px;
|
||||
background-color: var(--mm-bg);
|
||||
color: var(--mm-text);
|
||||
font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* --- Focus rings --- */
|
||||
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
|
||||
.form-control:focus, .form-check-input:focus, .form-select:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(99,102,241,0.35);
|
||||
border-color: var(--mm-primary);
|
||||
}
|
||||
|
||||
/* --- Navbar --- */
|
||||
.navbar {
|
||||
background-color: var(--mm-surface);
|
||||
border-bottom: 1px solid var(--mm-border) !important;
|
||||
box-shadow: var(--mm-shadow-sm);
|
||||
padding-top: 0.65rem;
|
||||
padding-bottom: 0.65rem;
|
||||
}
|
||||
.navbar-brand {
|
||||
color: var(--mm-primary) !important;
|
||||
font-weight: 700;
|
||||
font-size: 1.2rem;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
.navbar .nav-link {
|
||||
color: var(--mm-text-secondary) !important;
|
||||
font-weight: 500;
|
||||
font-size: 0.9rem;
|
||||
transition: color 0.15s ease;
|
||||
}
|
||||
.navbar .nav-link:hover,
|
||||
.navbar .nav-link:focus {
|
||||
color: var(--mm-primary) !important;
|
||||
}
|
||||
.navbar .nav-item.dropdown .nav-link.dropdown-toggle.active-parent {
|
||||
color: var(--mm-primary) !important;
|
||||
}
|
||||
.navbar .dropdown-menu {
|
||||
border: 1px solid var(--mm-border);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
box-shadow: var(--mm-shadow);
|
||||
padding: 0.35rem 0;
|
||||
}
|
||||
.navbar .dropdown-item {
|
||||
font-size: 0.875rem;
|
||||
padding: 0.45rem 1rem;
|
||||
color: var(--mm-text);
|
||||
}
|
||||
.navbar .dropdown-item:hover,
|
||||
.navbar .dropdown-item:focus {
|
||||
background-color: var(--mm-primary-soft);
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
.navbar .btn-primary,
|
||||
.navbar .btn-sm.btn-primary {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
font-weight: 600;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.navbar .btn-primary:hover {
|
||||
background-color: var(--mm-primary-hover);
|
||||
border-color: var(--mm-primary-hover);
|
||||
}
|
||||
/* Hamburger icon for light navbar */
|
||||
.navbar-toggler {
|
||||
border-color: var(--mm-border);
|
||||
}
|
||||
.navbar-toggler-icon {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(100,116,139,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
/* --- Breadcrumbs --- */
|
||||
.breadcrumb-nav { margin-bottom: 1rem; }
|
||||
.breadcrumb-nav .breadcrumb {
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.breadcrumb-nav .breadcrumb a {
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
.breadcrumb-item.active {
|
||||
color: var(--mm-text-secondary);
|
||||
}
|
||||
|
||||
/* --- Cards --- */
|
||||
.card {
|
||||
background-color: var(--mm-surface);
|
||||
border: 1px solid var(--mm-border);
|
||||
border-radius: var(--mm-radius) !important;
|
||||
box-shadow: var(--mm-shadow-sm);
|
||||
transition: box-shadow 0.2s ease;
|
||||
}
|
||||
.card:hover {
|
||||
box-shadow: var(--mm-shadow);
|
||||
}
|
||||
.card-header {
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid var(--mm-border);
|
||||
font-weight: 600;
|
||||
font-size: 0.95rem;
|
||||
color: var(--mm-text);
|
||||
padding: 0.85rem 1.15rem;
|
||||
}
|
||||
.card-body {
|
||||
padding: 1.15rem;
|
||||
}
|
||||
|
||||
/* Stat cards on dashboard */
|
||||
.card .fs-3 {
|
||||
color: var(--mm-text);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* --- Quick-action cards --- */
|
||||
.quick-action-card {
|
||||
transition: transform 0.15s ease, box-shadow 0.15s ease;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
.quick-action-card:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 6px 20px rgba(99,102,241,0.12) !important;
|
||||
}
|
||||
.quick-action-icon {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
/* --- Buttons --- */
|
||||
.btn-primary {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
font-weight: 600;
|
||||
}
|
||||
.btn-primary:hover, .btn-primary:active {
|
||||
background-color: var(--mm-primary-hover);
|
||||
border-color: var(--mm-primary-hover);
|
||||
}
|
||||
.btn-outline-primary {
|
||||
color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
.btn-outline-primary:hover {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
color: #fff;
|
||||
}
|
||||
.btn-outline-secondary {
|
||||
color: var(--mm-text-secondary);
|
||||
border-color: var(--mm-border);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
.btn-outline-secondary:hover {
|
||||
background-color: var(--mm-bg);
|
||||
border-color: var(--mm-border);
|
||||
color: var(--mm-text);
|
||||
}
|
||||
.btn-success {
|
||||
background-color: var(--mm-success);
|
||||
border-color: var(--mm-success);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
.btn-danger {
|
||||
background-color: var(--mm-danger);
|
||||
border-color: var(--mm-danger);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
|
||||
/* --- Tables --- */
|
||||
.table {
|
||||
--bs-table-hover-bg: rgba(99,102,241,0.04);
|
||||
--bs-table-striped-bg: rgba(0,0,0,0.015);
|
||||
color: var(--mm-text);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.table > thead > tr > th {
|
||||
background-color: var(--mm-bg);
|
||||
color: var(--mm-text-secondary);
|
||||
font-weight: 600;
|
||||
font-size: 0.8rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
border-bottom: 2px solid var(--mm-border);
|
||||
padding: 0.7rem 0.75rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.table > tbody > tr > td {
|
||||
padding: 0.65rem 0.75rem;
|
||||
vertical-align: middle;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.04);
|
||||
}
|
||||
.table > tbody > tr:last-child > td {
|
||||
border-bottom: none;
|
||||
}
|
||||
.table-hover > tbody > tr {
|
||||
transition: background-color 0.1s ease;
|
||||
}
|
||||
|
||||
/* --- Forms --- */
|
||||
.form-control, .form-select {
|
||||
border-radius: var(--mm-radius-sm);
|
||||
border: 1px solid var(--mm-border);
|
||||
font-size: 0.9rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
.form-control:hover, .form-select:hover {
|
||||
border-color: #cbd5e1;
|
||||
}
|
||||
.form-label {
|
||||
color: var(--mm-text);
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* --- Badges --- */
|
||||
.badge {
|
||||
font-weight: 600;
|
||||
font-size: 0.75rem;
|
||||
border-radius: 6px;
|
||||
padding: 0.3em 0.6em;
|
||||
}
|
||||
.badge.bg-success {
|
||||
background-color: var(--mm-success) !important;
|
||||
}
|
||||
.badge.bg-danger {
|
||||
background-color: var(--mm-danger) !important;
|
||||
}
|
||||
.badge.bg-warning {
|
||||
background-color: var(--mm-warning) !important;
|
||||
}
|
||||
.badge.bg-info {
|
||||
background-color: var(--mm-info) !important;
|
||||
}
|
||||
.badge.bg-primary {
|
||||
background-color: var(--mm-primary) !important;
|
||||
}
|
||||
.badge.bg-secondary {
|
||||
background-color: #e2e8f0 !important;
|
||||
color: var(--mm-text-secondary) !important;
|
||||
}
|
||||
|
||||
/* --- Progress bars --- */
|
||||
.progress {
|
||||
background-color: #e2e8f0;
|
||||
border-radius: 999px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.progress-bar {
|
||||
border-radius: 999px;
|
||||
font-size: 0.7rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.progress-bar.bg-success { background-color: var(--mm-success) !important; }
|
||||
.progress-bar.bg-warning { background-color: var(--mm-warning) !important; }
|
||||
.progress-bar.bg-danger { background-color: var(--mm-danger) !important; }
|
||||
|
||||
/* --- Alerts --- */
|
||||
.alert {
|
||||
border-radius: var(--mm-radius-sm);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.alert-success {
|
||||
background-color: var(--mm-success-soft);
|
||||
border-color: rgba(16,185,129,0.2);
|
||||
color: #065f46;
|
||||
}
|
||||
.alert-danger {
|
||||
background-color: var(--mm-danger-soft);
|
||||
border-color: rgba(239,68,68,0.2);
|
||||
color: #991b1b;
|
||||
}
|
||||
.alert-info {
|
||||
background-color: var(--mm-info-soft);
|
||||
border-color: rgba(6,182,212,0.2);
|
||||
color: #155e75;
|
||||
}
|
||||
|
||||
/* --- Modals --- */
|
||||
.modal-content {
|
||||
border-radius: var(--mm-radius);
|
||||
border: 1px solid var(--mm-border);
|
||||
box-shadow: 0 8px 30px rgba(0,0,0,0.12);
|
||||
}
|
||||
.modal-header {
|
||||
border-bottom: 1px solid var(--mm-border);
|
||||
}
|
||||
.modal-footer {
|
||||
border-top: 1px solid var(--mm-border);
|
||||
}
|
||||
|
||||
/* --- Footer --- */
|
||||
.footer {
|
||||
background-color: var(--mm-surface);
|
||||
border-top: 1px solid var(--mm-border) !important;
|
||||
padding: 1rem 0;
|
||||
font-size: 0.85rem;
|
||||
color: var(--mm-text-secondary);
|
||||
}
|
||||
|
||||
/* --- Links --- */
|
||||
a {
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
a:hover {
|
||||
color: var(--mm-primary-hover);
|
||||
}
|
||||
.text-decoration-none.text-body:hover {
|
||||
color: var(--mm-primary) !important;
|
||||
}
|
||||
|
||||
/* --- Amount coloring --- */
|
||||
.text-success { color: var(--mm-success) !important; }
|
||||
.text-danger { color: var(--mm-danger) !important; }
|
||||
|
||||
/* --- Muted text --- */
|
||||
.text-muted {
|
||||
color: var(--mm-text-secondary) !important;
|
||||
}
|
||||
|
||||
/* --- Pagination --- */
|
||||
.page-link {
|
||||
border-radius: var(--mm-radius-sm);
|
||||
border: 1px solid var(--mm-border);
|
||||
color: var(--mm-text-secondary);
|
||||
font-size: 0.875rem;
|
||||
margin: 0 2px;
|
||||
}
|
||||
.page-link:hover {
|
||||
background-color: var(--mm-primary-soft);
|
||||
border-color: var(--mm-primary);
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
.page-item.active .page-link {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* --- Selection bar (Transactions page) --- */
|
||||
.alert.alert-info.sticky-top {
|
||||
background-color: var(--mm-primary-soft);
|
||||
border-color: rgba(99,102,241,0.2);
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
|
||||
/* --- Headings --- */
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: var(--mm-text);
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
/* --- Utility overrides for light theme --- */
|
||||
.bg-primary.bg-opacity-25 {
|
||||
background-color: var(--mm-primary-soft) !important;
|
||||
}
|
||||
.bg-warning.bg-opacity-25 {
|
||||
background-color: var(--mm-warning-soft) !important;
|
||||
}
|
||||
.bg-info.bg-opacity-25 {
|
||||
background-color: var(--mm-info-soft) !important;
|
||||
}
|
||||
.bg-success.bg-opacity-25 {
|
||||
background-color: var(--mm-success-soft) !important;
|
||||
}
|
||||
.text-primary { color: var(--mm-primary) !important; }
|
||||
.text-warning { color: var(--mm-warning) !important; }
|
||||
.text-info { color: var(--mm-info) !important; }
|
||||
|
||||
/* --- Scrollbar (subtle for light theme) --- */
|
||||
::-webkit-scrollbar { width: 8px; height: 8px; }
|
||||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #cbd5e1;
|
||||
border-radius: 999px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
|
||||
/* ============================================
|
||||
MoneyMap – Modern Fintech Light Theme
|
||||
============================================ */
|
||||
|
||||
/* --- Palette (CSS custom properties) --- */
|
||||
:root {
|
||||
--mm-bg: #f7f8fc;
|
||||
--mm-surface: #ffffff;
|
||||
--mm-primary: #6366f1;
|
||||
--mm-primary-hover:#4f46e5;
|
||||
--mm-primary-soft: rgba(99,102,241,0.10);
|
||||
--mm-success: #10b981;
|
||||
--mm-success-soft: rgba(16,185,129,0.10);
|
||||
--mm-danger: #ef4444;
|
||||
--mm-danger-soft: rgba(239,68,68,0.10);
|
||||
--mm-warning: #f59e0b;
|
||||
--mm-warning-soft: rgba(245,158,11,0.10);
|
||||
--mm-info: #06b6d4;
|
||||
--mm-info-soft: rgba(6,182,212,0.10);
|
||||
--mm-text: #1e293b;
|
||||
--mm-text-secondary: #64748b;
|
||||
--mm-border: #e2e8f0;
|
||||
--mm-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
|
||||
--mm-shadow: 0 4px 12px rgba(0,0,0,0.06);
|
||||
--mm-radius: 12px;
|
||||
--mm-radius-sm: 8px;
|
||||
}
|
||||
|
||||
/* --- Base --- */
|
||||
html {
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
min-height: 100%;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
html { font-size: 16px; }
|
||||
}
|
||||
|
||||
body {
|
||||
margin-bottom: 60px;
|
||||
background-color: var(--mm-bg);
|
||||
color: var(--mm-text);
|
||||
font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* --- Focus rings --- */
|
||||
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
|
||||
.form-control:focus, .form-check-input:focus, .form-select:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(99,102,241,0.35);
|
||||
border-color: var(--mm-primary);
|
||||
}
|
||||
|
||||
/* --- Navbar --- */
|
||||
.navbar {
|
||||
background-color: var(--mm-surface);
|
||||
border-bottom: 1px solid var(--mm-border) !important;
|
||||
box-shadow: var(--mm-shadow-sm);
|
||||
padding-top: 0.65rem;
|
||||
padding-bottom: 0.65rem;
|
||||
}
|
||||
.navbar-brand {
|
||||
color: var(--mm-primary) !important;
|
||||
font-weight: 700;
|
||||
font-size: 1.2rem;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
.navbar .nav-link {
|
||||
color: var(--mm-text-secondary) !important;
|
||||
font-weight: 500;
|
||||
font-size: 0.9rem;
|
||||
transition: color 0.15s ease;
|
||||
}
|
||||
.navbar .nav-link:hover,
|
||||
.navbar .nav-link:focus {
|
||||
color: var(--mm-primary) !important;
|
||||
}
|
||||
.navbar .nav-item.dropdown .nav-link.dropdown-toggle.active-parent {
|
||||
color: var(--mm-primary) !important;
|
||||
}
|
||||
.navbar .dropdown-menu {
|
||||
border: 1px solid var(--mm-border);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
box-shadow: var(--mm-shadow);
|
||||
padding: 0.35rem 0;
|
||||
}
|
||||
.navbar .dropdown-item {
|
||||
font-size: 0.875rem;
|
||||
padding: 0.45rem 1rem;
|
||||
color: var(--mm-text);
|
||||
}
|
||||
.navbar .dropdown-item:hover,
|
||||
.navbar .dropdown-item:focus {
|
||||
background-color: var(--mm-primary-soft);
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
.navbar .btn-primary,
|
||||
.navbar .btn-sm.btn-primary {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
font-weight: 600;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.navbar .btn-primary:hover {
|
||||
background-color: var(--mm-primary-hover);
|
||||
border-color: var(--mm-primary-hover);
|
||||
}
|
||||
/* Hamburger icon for light navbar */
|
||||
.navbar-toggler {
|
||||
border-color: var(--mm-border);
|
||||
}
|
||||
.navbar-toggler-icon {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(100,116,139,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
/* --- Breadcrumbs --- */
|
||||
.breadcrumb-nav { margin-bottom: 1rem; }
|
||||
.breadcrumb-nav .breadcrumb {
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.breadcrumb-nav .breadcrumb a {
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
.breadcrumb-item.active {
|
||||
color: var(--mm-text-secondary);
|
||||
}
|
||||
|
||||
/* --- Cards --- */
|
||||
.card {
|
||||
background-color: var(--mm-surface);
|
||||
border: 1px solid var(--mm-border);
|
||||
border-radius: var(--mm-radius) !important;
|
||||
box-shadow: var(--mm-shadow-sm);
|
||||
transition: box-shadow 0.2s ease;
|
||||
}
|
||||
.card:hover {
|
||||
box-shadow: var(--mm-shadow);
|
||||
}
|
||||
.card-header {
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid var(--mm-border);
|
||||
font-weight: 600;
|
||||
font-size: 0.95rem;
|
||||
color: var(--mm-text);
|
||||
padding: 0.85rem 1.15rem;
|
||||
}
|
||||
.card-body {
|
||||
padding: 1.15rem;
|
||||
}
|
||||
|
||||
/* Stat cards on dashboard */
|
||||
.card .fs-3 {
|
||||
color: var(--mm-text);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* --- Quick-action cards --- */
|
||||
.quick-action-card {
|
||||
transition: transform 0.15s ease, box-shadow 0.15s ease;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
.quick-action-card:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 6px 20px rgba(99,102,241,0.12) !important;
|
||||
}
|
||||
.quick-action-icon {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
/* --- Buttons --- */
|
||||
.btn-primary {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
font-weight: 600;
|
||||
}
|
||||
.btn-primary:hover, .btn-primary:active {
|
||||
background-color: var(--mm-primary-hover);
|
||||
border-color: var(--mm-primary-hover);
|
||||
}
|
||||
.btn-outline-primary {
|
||||
color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
.btn-outline-primary:hover {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
color: #fff;
|
||||
}
|
||||
.btn-outline-secondary {
|
||||
color: var(--mm-text-secondary);
|
||||
border-color: var(--mm-border);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
.btn-outline-secondary:hover {
|
||||
background-color: var(--mm-bg);
|
||||
border-color: var(--mm-border);
|
||||
color: var(--mm-text);
|
||||
}
|
||||
.btn-success {
|
||||
background-color: var(--mm-success);
|
||||
border-color: var(--mm-success);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
.btn-danger {
|
||||
background-color: var(--mm-danger);
|
||||
border-color: var(--mm-danger);
|
||||
border-radius: var(--mm-radius-sm);
|
||||
}
|
||||
|
||||
/* --- Tables --- */
|
||||
.table {
|
||||
--bs-table-hover-bg: rgba(99,102,241,0.04);
|
||||
--bs-table-striped-bg: rgba(0,0,0,0.015);
|
||||
color: var(--mm-text);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.table > thead > tr > th {
|
||||
background-color: var(--mm-bg);
|
||||
color: var(--mm-text-secondary);
|
||||
font-weight: 600;
|
||||
font-size: 0.8rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
border-bottom: 2px solid var(--mm-border);
|
||||
padding: 0.7rem 0.75rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.table > tbody > tr > td {
|
||||
padding: 0.65rem 0.75rem;
|
||||
vertical-align: middle;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.04);
|
||||
}
|
||||
.table > tbody > tr:last-child > td {
|
||||
border-bottom: none;
|
||||
}
|
||||
.table-hover > tbody > tr {
|
||||
transition: background-color 0.1s ease;
|
||||
}
|
||||
|
||||
/* --- Forms --- */
|
||||
.form-control, .form-select {
|
||||
border-radius: var(--mm-radius-sm);
|
||||
border: 1px solid var(--mm-border);
|
||||
font-size: 0.9rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
.form-control:hover, .form-select:hover {
|
||||
border-color: #cbd5e1;
|
||||
}
|
||||
.form-label {
|
||||
color: var(--mm-text);
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* --- Badges --- */
|
||||
.badge {
|
||||
font-weight: 600;
|
||||
font-size: 0.75rem;
|
||||
border-radius: 6px;
|
||||
padding: 0.3em 0.6em;
|
||||
}
|
||||
.badge.bg-success {
|
||||
background-color: var(--mm-success) !important;
|
||||
}
|
||||
.badge.bg-danger {
|
||||
background-color: var(--mm-danger) !important;
|
||||
}
|
||||
.badge.bg-warning {
|
||||
background-color: var(--mm-warning) !important;
|
||||
}
|
||||
.badge.bg-info {
|
||||
background-color: var(--mm-info) !important;
|
||||
}
|
||||
.badge.bg-primary {
|
||||
background-color: var(--mm-primary) !important;
|
||||
}
|
||||
.badge.bg-secondary {
|
||||
background-color: #e2e8f0 !important;
|
||||
color: var(--mm-text-secondary) !important;
|
||||
}
|
||||
|
||||
/* --- Progress bars --- */
|
||||
.progress {
|
||||
background-color: #e2e8f0;
|
||||
border-radius: 999px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.progress-bar {
|
||||
border-radius: 999px;
|
||||
font-size: 0.7rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.progress-bar.bg-success { background-color: var(--mm-success) !important; }
|
||||
.progress-bar.bg-warning { background-color: var(--mm-warning) !important; }
|
||||
.progress-bar.bg-danger { background-color: var(--mm-danger) !important; }
|
||||
|
||||
/* --- Alerts --- */
|
||||
.alert {
|
||||
border-radius: var(--mm-radius-sm);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.alert-success {
|
||||
background-color: var(--mm-success-soft);
|
||||
border-color: rgba(16,185,129,0.2);
|
||||
color: #065f46;
|
||||
}
|
||||
.alert-danger {
|
||||
background-color: var(--mm-danger-soft);
|
||||
border-color: rgba(239,68,68,0.2);
|
||||
color: #991b1b;
|
||||
}
|
||||
.alert-info {
|
||||
background-color: var(--mm-info-soft);
|
||||
border-color: rgba(6,182,212,0.2);
|
||||
color: #155e75;
|
||||
}
|
||||
|
||||
/* --- Modals --- */
|
||||
.modal-content {
|
||||
border-radius: var(--mm-radius);
|
||||
border: 1px solid var(--mm-border);
|
||||
box-shadow: 0 8px 30px rgba(0,0,0,0.12);
|
||||
}
|
||||
.modal-header {
|
||||
border-bottom: 1px solid var(--mm-border);
|
||||
}
|
||||
.modal-footer {
|
||||
border-top: 1px solid var(--mm-border);
|
||||
}
|
||||
|
||||
/* --- Footer --- */
|
||||
.footer {
|
||||
background-color: var(--mm-surface);
|
||||
border-top: 1px solid var(--mm-border) !important;
|
||||
padding: 1rem 0;
|
||||
font-size: 0.85rem;
|
||||
color: var(--mm-text-secondary);
|
||||
}
|
||||
|
||||
/* --- Links --- */
|
||||
a {
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
a:hover {
|
||||
color: var(--mm-primary-hover);
|
||||
}
|
||||
.text-decoration-none.text-body:hover {
|
||||
color: var(--mm-primary) !important;
|
||||
}
|
||||
|
||||
/* --- Amount coloring --- */
|
||||
.text-success { color: var(--mm-success) !important; }
|
||||
.text-danger { color: var(--mm-danger) !important; }
|
||||
|
||||
/* --- Muted text --- */
|
||||
.text-muted {
|
||||
color: var(--mm-text-secondary) !important;
|
||||
}
|
||||
|
||||
/* --- Pagination --- */
|
||||
.page-link {
|
||||
border-radius: var(--mm-radius-sm);
|
||||
border: 1px solid var(--mm-border);
|
||||
color: var(--mm-text-secondary);
|
||||
font-size: 0.875rem;
|
||||
margin: 0 2px;
|
||||
}
|
||||
.page-link:hover {
|
||||
background-color: var(--mm-primary-soft);
|
||||
border-color: var(--mm-primary);
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
.page-item.active .page-link {
|
||||
background-color: var(--mm-primary);
|
||||
border-color: var(--mm-primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* --- Selection bar (Transactions page) --- */
|
||||
.alert.alert-info.sticky-top {
|
||||
background-color: var(--mm-primary-soft);
|
||||
border-color: rgba(99,102,241,0.2);
|
||||
color: var(--mm-primary);
|
||||
}
|
||||
|
||||
/* --- Headings --- */
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: var(--mm-text);
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
/* --- Utility overrides for light theme --- */
|
||||
.bg-primary.bg-opacity-25 {
|
||||
background-color: var(--mm-primary-soft) !important;
|
||||
}
|
||||
.bg-warning.bg-opacity-25 {
|
||||
background-color: var(--mm-warning-soft) !important;
|
||||
}
|
||||
.bg-info.bg-opacity-25 {
|
||||
background-color: var(--mm-info-soft) !important;
|
||||
}
|
||||
.bg-success.bg-opacity-25 {
|
||||
background-color: var(--mm-success-soft) !important;
|
||||
}
|
||||
.text-primary { color: var(--mm-primary) !important; }
|
||||
.text-warning { color: var(--mm-warning) !important; }
|
||||
.text-info { color: var(--mm-info) !important; }
|
||||
|
||||
/* --- Scrollbar (subtle for light theme) --- */
|
||||
::-webkit-scrollbar { width: 8px; height: 8px; }
|
||||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #cbd5e1;
|
||||
border-radius: 999px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
|
||||
|
||||
@@ -1,69 +1,69 @@
|
||||
// Category Mappings Page JavaScript
|
||||
|
||||
function openEditModal(id, category, pattern, priority, merchant) {
|
||||
console.log('Opening modal for:', id, category, pattern, priority, merchant);
|
||||
|
||||
document.getElementById('editId').value = id;
|
||||
document.getElementById('editCategory').value = category;
|
||||
document.getElementById('editPattern').value = pattern;
|
||||
document.getElementById('editPriority').value = priority;
|
||||
document.getElementById('editMerchant').value = merchant || '';
|
||||
|
||||
var modalElement = document.getElementById('editModal');
|
||||
if (modalElement && typeof bootstrap !== 'undefined') {
|
||||
var modal = new bootstrap.Modal(modalElement);
|
||||
modal.show();
|
||||
} else {
|
||||
console.error('Bootstrap modal not available');
|
||||
alert('Error: Modal system not loaded. Please refresh the page.');
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
// Debug: Log form values before submission
|
||||
var addForm = document.querySelector('#addModal form');
|
||||
if (addForm) {
|
||||
addForm.addEventListener('submit', function(e) {
|
||||
var categoryInput = document.getElementById('addCategory');
|
||||
var patternInput = document.getElementById('addPattern');
|
||||
var priorityInput = document.getElementById('addPriority');
|
||||
|
||||
console.log('=== ADD FORM SUBMISSION ===');
|
||||
console.log('Category:', categoryInput.value, 'Name:', categoryInput.name);
|
||||
console.log('Pattern:', patternInput.value, 'Name:', patternInput.name);
|
||||
console.log('Priority:', priorityInput.value, 'Name:', priorityInput.name);
|
||||
console.log('Form Data:');
|
||||
var formData = new FormData(addForm);
|
||||
for (var pair of formData.entries()) {
|
||||
console.log(' ' + pair[0] + ': ' + pair[1]);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var editForm = document.querySelector('#editModal form');
|
||||
if (editForm) {
|
||||
editForm.addEventListener('submit', function(e) {
|
||||
var id = document.getElementById('editId').value;
|
||||
var category = document.getElementById('editCategory').value;
|
||||
var pattern = document.getElementById('editPattern').value;
|
||||
var priority = document.getElementById('editPriority').value;
|
||||
console.log('Submitting Edit form:', { id, category, pattern, priority });
|
||||
console.log('Category input name:', document.getElementById('editCategory').name);
|
||||
});
|
||||
}
|
||||
|
||||
// Reopen modals if there are validation errors
|
||||
var addCategoryInput = document.getElementById('addCategory');
|
||||
var editCategoryInput = document.getElementById('editCategory');
|
||||
|
||||
if (addCategoryInput && addCategoryInput.classList.contains('input-validation-error')) {
|
||||
var addModal = new bootstrap.Modal(document.getElementById('addModal'));
|
||||
addModal.show();
|
||||
}
|
||||
|
||||
if (editCategoryInput && editCategoryInput.classList.contains('input-validation-error')) {
|
||||
var editModal = new bootstrap.Modal(document.getElementById('editModal'));
|
||||
editModal.show();
|
||||
}
|
||||
});
|
||||
// Category Mappings Page JavaScript
|
||||
|
||||
function openEditModal(id, category, pattern, priority, merchant) {
|
||||
console.log('Opening modal for:', id, category, pattern, priority, merchant);
|
||||
|
||||
document.getElementById('editId').value = id;
|
||||
document.getElementById('editCategory').value = category;
|
||||
document.getElementById('editPattern').value = pattern;
|
||||
document.getElementById('editPriority').value = priority;
|
||||
document.getElementById('editMerchant').value = merchant || '';
|
||||
|
||||
var modalElement = document.getElementById('editModal');
|
||||
if (modalElement && typeof bootstrap !== 'undefined') {
|
||||
var modal = new bootstrap.Modal(modalElement);
|
||||
modal.show();
|
||||
} else {
|
||||
console.error('Bootstrap modal not available');
|
||||
alert('Error: Modal system not loaded. Please refresh the page.');
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
// Debug: Log form values before submission
|
||||
var addForm = document.querySelector('#addModal form');
|
||||
if (addForm) {
|
||||
addForm.addEventListener('submit', function(e) {
|
||||
var categoryInput = document.getElementById('addCategory');
|
||||
var patternInput = document.getElementById('addPattern');
|
||||
var priorityInput = document.getElementById('addPriority');
|
||||
|
||||
console.log('=== ADD FORM SUBMISSION ===');
|
||||
console.log('Category:', categoryInput.value, 'Name:', categoryInput.name);
|
||||
console.log('Pattern:', patternInput.value, 'Name:', patternInput.name);
|
||||
console.log('Priority:', priorityInput.value, 'Name:', priorityInput.name);
|
||||
console.log('Form Data:');
|
||||
var formData = new FormData(addForm);
|
||||
for (var pair of formData.entries()) {
|
||||
console.log(' ' + pair[0] + ': ' + pair[1]);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var editForm = document.querySelector('#editModal form');
|
||||
if (editForm) {
|
||||
editForm.addEventListener('submit', function(e) {
|
||||
var id = document.getElementById('editId').value;
|
||||
var category = document.getElementById('editCategory').value;
|
||||
var pattern = document.getElementById('editPattern').value;
|
||||
var priority = document.getElementById('editPriority').value;
|
||||
console.log('Submitting Edit form:', { id, category, pattern, priority });
|
||||
console.log('Category input name:', document.getElementById('editCategory').name);
|
||||
});
|
||||
}
|
||||
|
||||
// Reopen modals if there are validation errors
|
||||
var addCategoryInput = document.getElementById('addCategory');
|
||||
var editCategoryInput = document.getElementById('editCategory');
|
||||
|
||||
if (addCategoryInput && addCategoryInput.classList.contains('input-validation-error')) {
|
||||
var addModal = new bootstrap.Modal(document.getElementById('addModal'));
|
||||
addModal.show();
|
||||
}
|
||||
|
||||
if (editCategoryInput && editCategoryInput.classList.contains('input-validation-error')) {
|
||||
var editModal = new bootstrap.Modal(document.getElementById('editModal'));
|
||||
editModal.show();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1,73 +1,73 @@
|
||||
// Edit Transaction Page JavaScript
|
||||
|
||||
function handleCategoryChange() {
|
||||
const select = document.getElementById('categorySelect');
|
||||
const customInputDiv = document.getElementById('customCategoryInput');
|
||||
const categoryInput = document.getElementById('categoryInput');
|
||||
|
||||
if (select.value === '__custom__') {
|
||||
customInputDiv.style.display = 'block';
|
||||
categoryInput.value = '';
|
||||
categoryInput.focus();
|
||||
} else {
|
||||
customInputDiv.style.display = 'none';
|
||||
categoryInput.value = select.value;
|
||||
}
|
||||
}
|
||||
|
||||
function handleMerchantChange() {
|
||||
const select = document.getElementById('merchantSelect');
|
||||
const customInput = document.getElementById('customMerchantInput');
|
||||
const hiddenInput = document.getElementById('merchantHidden');
|
||||
const merchantNameInput = document.querySelector('input[name="Transaction.MerchantName"]');
|
||||
|
||||
if (select.value === '__custom__') {
|
||||
customInput.style.display = 'block';
|
||||
hiddenInput.value = '';
|
||||
merchantNameInput.value = '';
|
||||
merchantNameInput.focus();
|
||||
} else {
|
||||
customInput.style.display = 'none';
|
||||
hiddenInput.value = select.value;
|
||||
merchantNameInput.value = '';
|
||||
}
|
||||
}
|
||||
|
||||
function copyTransactionId(transactionId) {
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
navigator.clipboard.writeText(transactionId.toString());
|
||||
} else {
|
||||
var ta = document.createElement('textarea');
|
||||
ta.value = transactionId;
|
||||
document.body.appendChild(ta);
|
||||
ta.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(ta);
|
||||
}
|
||||
var btns = document.querySelectorAll('button[onclick*="copyTransactionId"]');
|
||||
btns.forEach(function(btn) {
|
||||
var old = btn.textContent;
|
||||
btn.textContent = 'Copied!';
|
||||
setTimeout(function() {
|
||||
btn.textContent = old;
|
||||
}, 1500);
|
||||
});
|
||||
}
|
||||
|
||||
// Update hidden field when custom input changes
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const categoryInput = document.querySelector('input[name="Transaction.Category"]');
|
||||
const categorySelect = document.getElementById('categorySelect');
|
||||
|
||||
if (categoryInput) {
|
||||
categoryInput.addEventListener('input', function() {
|
||||
if (categorySelect.value === '__custom__') {
|
||||
// Keep custom selected when typing
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Initialize on page load
|
||||
handleCategoryChange();
|
||||
handleMerchantChange();
|
||||
});
|
||||
// Edit Transaction Page JavaScript
|
||||
|
||||
function handleCategoryChange() {
|
||||
const select = document.getElementById('categorySelect');
|
||||
const customInputDiv = document.getElementById('customCategoryInput');
|
||||
const categoryInput = document.getElementById('categoryInput');
|
||||
|
||||
if (select.value === '__custom__') {
|
||||
customInputDiv.style.display = 'block';
|
||||
categoryInput.value = '';
|
||||
categoryInput.focus();
|
||||
} else {
|
||||
customInputDiv.style.display = 'none';
|
||||
categoryInput.value = select.value;
|
||||
}
|
||||
}
|
||||
|
||||
function handleMerchantChange() {
|
||||
const select = document.getElementById('merchantSelect');
|
||||
const customInput = document.getElementById('customMerchantInput');
|
||||
const hiddenInput = document.getElementById('merchantHidden');
|
||||
const merchantNameInput = document.querySelector('input[name="Transaction.MerchantName"]');
|
||||
|
||||
if (select.value === '__custom__') {
|
||||
customInput.style.display = 'block';
|
||||
hiddenInput.value = '';
|
||||
merchantNameInput.value = '';
|
||||
merchantNameInput.focus();
|
||||
} else {
|
||||
customInput.style.display = 'none';
|
||||
hiddenInput.value = select.value;
|
||||
merchantNameInput.value = '';
|
||||
}
|
||||
}
|
||||
|
||||
function copyTransactionId(transactionId) {
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
navigator.clipboard.writeText(transactionId.toString());
|
||||
} else {
|
||||
var ta = document.createElement('textarea');
|
||||
ta.value = transactionId;
|
||||
document.body.appendChild(ta);
|
||||
ta.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(ta);
|
||||
}
|
||||
var btns = document.querySelectorAll('button[onclick*="copyTransactionId"]');
|
||||
btns.forEach(function(btn) {
|
||||
var old = btn.textContent;
|
||||
btn.textContent = 'Copied!';
|
||||
setTimeout(function() {
|
||||
btn.textContent = old;
|
||||
}, 1500);
|
||||
});
|
||||
}
|
||||
|
||||
// Update hidden field when custom input changes
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const categoryInput = document.querySelector('input[name="Transaction.Category"]');
|
||||
const categorySelect = document.getElementById('categorySelect');
|
||||
|
||||
if (categoryInput) {
|
||||
categoryInput.addEventListener('input', function() {
|
||||
if (categorySelect.value === '__custom__') {
|
||||
// Keep custom selected when typing
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Initialize on page load
|
||||
handleCategoryChange();
|
||||
handleMerchantChange();
|
||||
});
|
||||
|
||||
@@ -1,31 +1,31 @@
|
||||
// Merchants Page JavaScript
|
||||
|
||||
function openEditModal(id, name) {
|
||||
document.getElementById('editId').value = id;
|
||||
document.getElementById('editName').value = name;
|
||||
|
||||
var modalElement = document.getElementById('editModal');
|
||||
if (modalElement && typeof bootstrap !== 'undefined') {
|
||||
var modal = new bootstrap.Modal(modalElement);
|
||||
modal.show();
|
||||
} else {
|
||||
console.error('Bootstrap modal not available');
|
||||
alert('Error: Modal system not loaded. Please refresh the page.');
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Reopen modals if there are validation errors
|
||||
var addNameInput = document.getElementById('addName');
|
||||
var editNameInput = document.getElementById('editName');
|
||||
|
||||
if (addNameInput && addNameInput.classList.contains('input-validation-error')) {
|
||||
var addModal = new bootstrap.Modal(document.getElementById('addModal'));
|
||||
addModal.show();
|
||||
}
|
||||
|
||||
if (editNameInput && editNameInput.classList.contains('input-validation-error')) {
|
||||
var editModal = new bootstrap.Modal(document.getElementById('editModal'));
|
||||
editModal.show();
|
||||
}
|
||||
});
|
||||
// Merchants Page JavaScript
|
||||
|
||||
function openEditModal(id, name) {
|
||||
document.getElementById('editId').value = id;
|
||||
document.getElementById('editName').value = name;
|
||||
|
||||
var modalElement = document.getElementById('editModal');
|
||||
if (modalElement && typeof bootstrap !== 'undefined') {
|
||||
var modal = new bootstrap.Modal(modalElement);
|
||||
modal.show();
|
||||
} else {
|
||||
console.error('Bootstrap modal not available');
|
||||
alert('Error: Modal system not loaded. Please refresh the page.');
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Reopen modals if there are validation errors
|
||||
var addNameInput = document.getElementById('addName');
|
||||
var editNameInput = document.getElementById('editName');
|
||||
|
||||
if (addNameInput && addNameInput.classList.contains('input-validation-error')) {
|
||||
var addModal = new bootstrap.Modal(document.getElementById('addModal'));
|
||||
addModal.show();
|
||||
}
|
||||
|
||||
if (editNameInput && editNameInput.classList.contains('input-validation-error')) {
|
||||
var editModal = new bootstrap.Modal(document.getElementById('editModal'));
|
||||
editModal.show();
|
||||
}
|
||||
});
|
||||
|
||||
+19
-19
@@ -1,19 +1,19 @@
|
||||
// Highlight active dropdown parent when a child page is active
|
||||
(function () {
|
||||
var path = window.location.pathname.toLowerCase().replace(/\/+$/, '') || '/';
|
||||
document.querySelectorAll('.navbar .dropdown-menu .dropdown-item').forEach(function (item) {
|
||||
var href = (item.getAttribute('href') || '').toLowerCase().replace(/\/+$/, '');
|
||||
if (href && (path === href || path.startsWith(href + '/'))) {
|
||||
item.classList.add('active');
|
||||
var toggle = item.closest('.dropdown').querySelector('.dropdown-toggle');
|
||||
if (toggle) toggle.classList.add('active-parent');
|
||||
}
|
||||
});
|
||||
// Direct nav-links (non-dropdown)
|
||||
document.querySelectorAll('.navbar .nav-link:not(.dropdown-toggle)').forEach(function (link) {
|
||||
var href = (link.getAttribute('href') || '').toLowerCase().replace(/\/+$/, '');
|
||||
if (href && path === href) {
|
||||
link.classList.add('active');
|
||||
}
|
||||
});
|
||||
})();
|
||||
// Highlight active dropdown parent when a child page is active
|
||||
(function () {
|
||||
var path = window.location.pathname.toLowerCase().replace(/\/+$/, '') || '/';
|
||||
document.querySelectorAll('.navbar .dropdown-menu .dropdown-item').forEach(function (item) {
|
||||
var href = (item.getAttribute('href') || '').toLowerCase().replace(/\/+$/, '');
|
||||
if (href && (path === href || path.startsWith(href + '/'))) {
|
||||
item.classList.add('active');
|
||||
var toggle = item.closest('.dropdown').querySelector('.dropdown-toggle');
|
||||
if (toggle) toggle.classList.add('active-parent');
|
||||
}
|
||||
});
|
||||
// Direct nav-links (non-dropdown)
|
||||
document.querySelectorAll('.navbar .nav-link:not(.dropdown-toggle)').forEach(function (link) {
|
||||
var href = (link.getAttribute('href') || '').toLowerCase().replace(/\/+$/, '');
|
||||
if (href && path === href) {
|
||||
link.classList.add('active');
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
@@ -1,44 +1,44 @@
|
||||
// Transactions Page JavaScript
|
||||
|
||||
// Initialize Bootstrap tooltips for notes badges
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
||||
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||
return new bootstrap.Tooltip(tooltipTriggerEl);
|
||||
});
|
||||
});
|
||||
|
||||
// Quick date range functions
|
||||
function formatDate(date) {
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(date.getDate()).padStart(2, '0');
|
||||
return `${year}-${month}-${day}`;
|
||||
}
|
||||
|
||||
function setDateRange(days) {
|
||||
const endDate = new Date();
|
||||
const startDate = new Date();
|
||||
startDate.setDate(startDate.getDate() - days);
|
||||
|
||||
document.getElementById('startDateInput').value = formatDate(startDate);
|
||||
document.getElementById('endDateInput').value = formatDate(endDate);
|
||||
}
|
||||
|
||||
function setDateRangeThisMonth() {
|
||||
const now = new Date();
|
||||
const startDate = new Date(now.getFullYear(), now.getMonth(), 1);
|
||||
const endDate = new Date(now.getFullYear(), now.getMonth() + 1, 0);
|
||||
|
||||
document.getElementById('startDateInput').value = formatDate(startDate);
|
||||
document.getElementById('endDateInput').value = formatDate(endDate);
|
||||
}
|
||||
|
||||
function setDateRangeLastMonth() {
|
||||
const now = new Date();
|
||||
const startDate = new Date(now.getFullYear(), now.getMonth() - 1, 1);
|
||||
const endDate = new Date(now.getFullYear(), now.getMonth(), 0);
|
||||
|
||||
document.getElementById('startDateInput').value = formatDate(startDate);
|
||||
document.getElementById('endDateInput').value = formatDate(endDate);
|
||||
}
|
||||
// Transactions Page JavaScript
|
||||
|
||||
// Initialize Bootstrap tooltips for notes badges
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
||||
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||
return new bootstrap.Tooltip(tooltipTriggerEl);
|
||||
});
|
||||
});
|
||||
|
||||
// Quick date range functions
|
||||
function formatDate(date) {
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(date.getDate()).padStart(2, '0');
|
||||
return `${year}-${month}-${day}`;
|
||||
}
|
||||
|
||||
function setDateRange(days) {
|
||||
const endDate = new Date();
|
||||
const startDate = new Date();
|
||||
startDate.setDate(startDate.getDate() - days);
|
||||
|
||||
document.getElementById('startDateInput').value = formatDate(startDate);
|
||||
document.getElementById('endDateInput').value = formatDate(endDate);
|
||||
}
|
||||
|
||||
function setDateRangeThisMonth() {
|
||||
const now = new Date();
|
||||
const startDate = new Date(now.getFullYear(), now.getMonth(), 1);
|
||||
const endDate = new Date(now.getFullYear(), now.getMonth() + 1, 0);
|
||||
|
||||
document.getElementById('startDateInput').value = formatDate(startDate);
|
||||
document.getElementById('endDateInput').value = formatDate(endDate);
|
||||
}
|
||||
|
||||
function setDateRangeLastMonth() {
|
||||
const now = new Date();
|
||||
const startDate = new Date(now.getFullYear(), now.getMonth() - 1, 1);
|
||||
const endDate = new Date(now.getFullYear(), now.getMonth(), 0);
|
||||
|
||||
document.getElementById('startDateInput').value = formatDate(startDate);
|
||||
document.getElementById('endDateInput').value = formatDate(endDate);
|
||||
}
|
||||
|
||||
+126
-126
@@ -1,126 +1,126 @@
|
||||
// Upload Page JavaScript
|
||||
let currentPage = 0;
|
||||
const pageSize = 100;
|
||||
let totalRows = 0;
|
||||
|
||||
function togglePaymentSelection() {
|
||||
const mode = document.querySelector('input[name="PaymentMode"]:checked').value;
|
||||
const cardRow = document.getElementById('cardSelectRow');
|
||||
const accountRow = document.getElementById('accountSelectRow');
|
||||
|
||||
cardRow.style.display = mode === 'Card' ? 'block' : 'none';
|
||||
accountRow.style.display = mode === 'Account' ? 'block' : 'none';
|
||||
}
|
||||
|
||||
function toggleAllCheckboxes() {
|
||||
const selectAll = document.getElementById('selectAll');
|
||||
const checkboxes = document.querySelectorAll('.transaction-checkbox');
|
||||
checkboxes.forEach(cb => cb.checked = selectAll.checked);
|
||||
updateSelectedCount();
|
||||
}
|
||||
|
||||
function updateSelectedCount() {
|
||||
const checkboxes = document.querySelectorAll('.transaction-checkbox:checked');
|
||||
const count = checkboxes.length;
|
||||
const selectedCountEl = document.getElementById('selectedCount');
|
||||
const selectedCountButtonEl = document.getElementById('selectedCountButton');
|
||||
if (selectedCountEl) selectedCountEl.textContent = count;
|
||||
if (selectedCountButtonEl) selectedCountButtonEl.textContent = count;
|
||||
}
|
||||
|
||||
function updateAllTransactionAccounts() {
|
||||
// Called when the global account dropdown changes
|
||||
// No action needed - we'll read the global account on form submit
|
||||
}
|
||||
|
||||
function showPage(pageNum) {
|
||||
const rows = document.querySelectorAll('.transaction-row');
|
||||
const start = pageNum * pageSize;
|
||||
const end = start + pageSize;
|
||||
|
||||
rows.forEach((row, index) => {
|
||||
row.style.display = (index >= start && index < end) ? '' : 'none';
|
||||
});
|
||||
|
||||
// Update pagination display
|
||||
const pageStartEl = document.getElementById('pageStart');
|
||||
const pageEndEl = document.getElementById('pageEnd');
|
||||
if (pageStartEl && pageEndEl) {
|
||||
pageStartEl.textContent = start + 1;
|
||||
pageEndEl.textContent = Math.min(end, totalRows);
|
||||
}
|
||||
|
||||
currentPage = pageNum;
|
||||
}
|
||||
|
||||
function nextPage() {
|
||||
const maxPage = Math.ceil(totalRows / pageSize) - 1;
|
||||
if (currentPage < maxPage) {
|
||||
showPage(currentPage + 1);
|
||||
}
|
||||
}
|
||||
|
||||
function previousPage() {
|
||||
if (currentPage > 0) {
|
||||
showPage(currentPage - 1);
|
||||
}
|
||||
}
|
||||
|
||||
function prepareFormData() {
|
||||
// Collect selected indices
|
||||
const selectedIndices = [];
|
||||
document.querySelectorAll('.transaction-checkbox:checked').forEach(cb => {
|
||||
selectedIndices.push(cb.getAttribute('data-index'));
|
||||
});
|
||||
document.getElementById('selectedIndices').value = selectedIndices.join(',');
|
||||
|
||||
// Get the global account ID
|
||||
const globalAccountId = document.getElementById('globalAccountId')?.value;
|
||||
if (!globalAccountId) {
|
||||
alert('Please select an account for all transactions');
|
||||
return false;
|
||||
}
|
||||
|
||||
// Collect payment data (account + optional card + category per transaction)
|
||||
const paymentData = {};
|
||||
document.querySelectorAll('.card-select').forEach((select) => {
|
||||
const index = select.getAttribute('data-index');
|
||||
const cardId = select.value ? parseInt(select.value) : null;
|
||||
|
||||
// Get category for this transaction
|
||||
const categoryInput = document.querySelector(`.category-input[data-index="${index}"]`);
|
||||
const category = categoryInput ? categoryInput.value.trim() : '';
|
||||
|
||||
paymentData[index] = {
|
||||
AccountId: parseInt(globalAccountId),
|
||||
CardId: cardId,
|
||||
Category: category
|
||||
};
|
||||
});
|
||||
document.getElementById('paymentData').value = JSON.stringify(paymentData);
|
||||
|
||||
return true; // Allow form submission
|
||||
}
|
||||
|
||||
// Initialize on page load
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
togglePaymentSelection();
|
||||
|
||||
// Get total rows from the preview transactions count
|
||||
const previewCount = document.querySelectorAll('.transaction-row').length;
|
||||
totalRows = previewCount;
|
||||
|
||||
if (totalRows > pageSize) {
|
||||
showPage(0);
|
||||
}
|
||||
|
||||
// Enable/disable preview button based on file selection
|
||||
const csvFileInput = document.getElementById('csvFileInput');
|
||||
const previewButton = document.getElementById('previewButton');
|
||||
|
||||
if (csvFileInput && previewButton) {
|
||||
csvFileInput.addEventListener('change', function() {
|
||||
previewButton.disabled = !this.files || this.files.length === 0;
|
||||
});
|
||||
}
|
||||
});
|
||||
// Upload Page JavaScript
|
||||
let currentPage = 0;
|
||||
const pageSize = 100;
|
||||
let totalRows = 0;
|
||||
|
||||
function togglePaymentSelection() {
|
||||
const mode = document.querySelector('input[name="PaymentMode"]:checked').value;
|
||||
const cardRow = document.getElementById('cardSelectRow');
|
||||
const accountRow = document.getElementById('accountSelectRow');
|
||||
|
||||
cardRow.style.display = mode === 'Card' ? 'block' : 'none';
|
||||
accountRow.style.display = mode === 'Account' ? 'block' : 'none';
|
||||
}
|
||||
|
||||
function toggleAllCheckboxes() {
|
||||
const selectAll = document.getElementById('selectAll');
|
||||
const checkboxes = document.querySelectorAll('.transaction-checkbox');
|
||||
checkboxes.forEach(cb => cb.checked = selectAll.checked);
|
||||
updateSelectedCount();
|
||||
}
|
||||
|
||||
function updateSelectedCount() {
|
||||
const checkboxes = document.querySelectorAll('.transaction-checkbox:checked');
|
||||
const count = checkboxes.length;
|
||||
const selectedCountEl = document.getElementById('selectedCount');
|
||||
const selectedCountButtonEl = document.getElementById('selectedCountButton');
|
||||
if (selectedCountEl) selectedCountEl.textContent = count;
|
||||
if (selectedCountButtonEl) selectedCountButtonEl.textContent = count;
|
||||
}
|
||||
|
||||
function updateAllTransactionAccounts() {
|
||||
// Called when the global account dropdown changes
|
||||
// No action needed - we'll read the global account on form submit
|
||||
}
|
||||
|
||||
function showPage(pageNum) {
|
||||
const rows = document.querySelectorAll('.transaction-row');
|
||||
const start = pageNum * pageSize;
|
||||
const end = start + pageSize;
|
||||
|
||||
rows.forEach((row, index) => {
|
||||
row.style.display = (index >= start && index < end) ? '' : 'none';
|
||||
});
|
||||
|
||||
// Update pagination display
|
||||
const pageStartEl = document.getElementById('pageStart');
|
||||
const pageEndEl = document.getElementById('pageEnd');
|
||||
if (pageStartEl && pageEndEl) {
|
||||
pageStartEl.textContent = start + 1;
|
||||
pageEndEl.textContent = Math.min(end, totalRows);
|
||||
}
|
||||
|
||||
currentPage = pageNum;
|
||||
}
|
||||
|
||||
function nextPage() {
|
||||
const maxPage = Math.ceil(totalRows / pageSize) - 1;
|
||||
if (currentPage < maxPage) {
|
||||
showPage(currentPage + 1);
|
||||
}
|
||||
}
|
||||
|
||||
function previousPage() {
|
||||
if (currentPage > 0) {
|
||||
showPage(currentPage - 1);
|
||||
}
|
||||
}
|
||||
|
||||
function prepareFormData() {
|
||||
// Collect selected indices
|
||||
const selectedIndices = [];
|
||||
document.querySelectorAll('.transaction-checkbox:checked').forEach(cb => {
|
||||
selectedIndices.push(cb.getAttribute('data-index'));
|
||||
});
|
||||
document.getElementById('selectedIndices').value = selectedIndices.join(',');
|
||||
|
||||
// Get the global account ID
|
||||
const globalAccountId = document.getElementById('globalAccountId')?.value;
|
||||
if (!globalAccountId) {
|
||||
alert('Please select an account for all transactions');
|
||||
return false;
|
||||
}
|
||||
|
||||
// Collect payment data (account + optional card + category per transaction)
|
||||
const paymentData = {};
|
||||
document.querySelectorAll('.card-select').forEach((select) => {
|
||||
const index = select.getAttribute('data-index');
|
||||
const cardId = select.value ? parseInt(select.value) : null;
|
||||
|
||||
// Get category for this transaction
|
||||
const categoryInput = document.querySelector(`.category-input[data-index="${index}"]`);
|
||||
const category = categoryInput ? categoryInput.value.trim() : '';
|
||||
|
||||
paymentData[index] = {
|
||||
AccountId: parseInt(globalAccountId),
|
||||
CardId: cardId,
|
||||
Category: category
|
||||
};
|
||||
});
|
||||
document.getElementById('paymentData').value = JSON.stringify(paymentData);
|
||||
|
||||
return true; // Allow form submission
|
||||
}
|
||||
|
||||
// Initialize on page load
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
togglePaymentSelection();
|
||||
|
||||
// Get total rows from the preview transactions count
|
||||
const previewCount = document.querySelectorAll('.transaction-row').length;
|
||||
totalRows = previewCount;
|
||||
|
||||
if (totalRows > pageSize) {
|
||||
showPage(0);
|
||||
}
|
||||
|
||||
// Enable/disable preview button based on file selection
|
||||
const csvFileInput = document.getElementById('csvFileInput');
|
||||
const previewButton = document.getElementById('previewButton');
|
||||
|
||||
if (csvFileInput && previewButton) {
|
||||
csvFileInput.addEventListener('change', function() {
|
||||
previewButton.disabled = !this.files || this.files.length === 0;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user