Spaces:
Running
Running
Update index.html
Browse files- index.html +45 -0
index.html
CHANGED
|
@@ -60,6 +60,34 @@
|
|
| 60 |
50% { color: #00FF41; }
|
| 61 |
}
|
| 62 |
</style>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 63 |
</head>
|
| 64 |
<body>
|
| 65 |
|
|
@@ -355,6 +383,23 @@
|
|
| 355 |
}
|
| 356 |
});
|
| 357 |
</script>
|
|
|
|
| 358 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 359 |
</body>
|
| 360 |
</html>
|
|
|
|
| 60 |
50% { color: #00FF41; }
|
| 61 |
}
|
| 62 |
</style>
|
| 63 |
+
<style>
|
| 64 |
+
/* CSS for Floating Button and Ledger Modal */
|
| 65 |
+
.fab {
|
| 66 |
+
position: fixed; bottom: 30px; right: 30px; width: 60px; height: 60px;
|
| 67 |
+
background-color: #007bff; color: white; border-radius: 50%; border: none;
|
| 68 |
+
box-shadow: 0 6px 15px rgba(0,0,0,0.2); font-size: 28px;
|
| 69 |
+
display: none; /* Hidden by default until user logs in */
|
| 70 |
+
align-items: center; justify-content: center; cursor: pointer;
|
| 71 |
+
z-index: 999;
|
| 72 |
+
}
|
| 73 |
+
.modal-overlay {
|
| 74 |
+
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
|
| 75 |
+
background: rgba(0, 0, 0, 0.6); display: none;
|
| 76 |
+
align-items: center; justify-content: center; z-index: 1000;
|
| 77 |
+
}
|
| 78 |
+
.modal-content {
|
| 79 |
+
background: white; padding: 30px; border-radius: 12px;
|
| 80 |
+
box-shadow: 0 8px 25px rgba(0,0,0,0.15); width: 90%; max-width: 450px;
|
| 81 |
+
}
|
| 82 |
+
.modal-content h3 { margin-top: 0; color: #333; text-align: center; }
|
| 83 |
+
.input-group { margin-bottom: 18px; }
|
| 84 |
+
.input-group label { display: block; margin-bottom: 6px; font-weight: 500; }
|
| 85 |
+
.input-group input { width: 100%; padding: 12px; border: 1px solid #ccc; border-radius: 6px; box-sizing: border-box; }
|
| 86 |
+
.form-actions { display: flex; justify-content: space-between; margin-top: 25px; }
|
| 87 |
+
.form-actions button { padding: 12px 20px; border-radius: 6px; border: none; font-size: 16px; cursor: pointer; }
|
| 88 |
+
.btn-submit { background-color: #28a745; color: white; }
|
| 89 |
+
.btn-cancel { background-color: #f1f1f1; color: #333; }
|
| 90 |
+
</style>
|
| 91 |
</head>
|
| 92 |
<body>
|
| 93 |
|
|
|
|
| 383 |
}
|
| 384 |
});
|
| 385 |
</script>
|
| 386 |
+
<button class="fab" id="addEntryBtn">+</button>
|
| 387 |
|
| 388 |
+
<div class="modal-overlay" id="entryModal">
|
| 389 |
+
<div class="modal-content">
|
| 390 |
+
<h3>New Capital Account Entry</h3>
|
| 391 |
+
<form id="ledgerForm">
|
| 392 |
+
<div class="input-group"><label for="date">Date</label><input type="date" id="date" required></div>
|
| 393 |
+
<div class="input-group"><label for="description">Description</label><input type="text" id="description" required></div>
|
| 394 |
+
<div class="input-group"><label for="ref">Reference</label><input type="text" id="ref"></div>
|
| 395 |
+
<div class="input-group"><label for="debit">Debit (-)</label><input type="number" id="debit" placeholder="0.00" step="0.01"></div>
|
| 396 |
+
<div class="input-group"><label for="credit">Credit (+)</label><input type="number" id="credit" placeholder="0.00" step="0.01"></div>
|
| 397 |
+
<div class="form-actions">
|
| 398 |
+
<button type="button" class="btn-cancel" id="cancelBtn">Cancel</button>
|
| 399 |
+
<button type="submit" class="btn-submit">Add Entry</button>
|
| 400 |
+
</div>
|
| 401 |
+
</form>
|
| 402 |
+
</div>
|
| 403 |
+
</div>
|
| 404 |
</body>
|
| 405 |
</html>
|