diff --git a/public/css/style.css b/public/css/style.css
index 28fe969..65fffa0 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -702,6 +702,16 @@ input, textarea, select {
opacity: 0;
}
+#scroll-progress {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 0%;
+ height: 4px;
+ background: #a855f7;
+ z-index: 9999;
+ transition: width 0.1s ease;
+}
/* Navbar Container */
.navbar {
display: flex;
diff --git a/public/index.html b/public/index.html
index eb860eb..9601442 100644
--- a/public/index.html
+++ b/public/index.html
@@ -38,6 +38,10 @@
+
+
+
+
diff --git a/public/js/app.js b/public/js/app.js
index 425eea5..b6bdc5b 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -373,6 +373,26 @@
return div.innerHTML;
}
+ // --- Scroll Progress Indicator ---
+ window.addEventListener("scroll", () => {
+ const scrollTop = document.documentElement.scrollTop;
+
+ const scrollHeight =
+ document.documentElement.scrollHeight -
+ document.documentElement.clientHeight;
+
+ const scrollPercent =
+ (scrollTop / scrollHeight) * 100;
+
+ const progressBar =
+ document.getElementById("scroll-progress");
+
+ if (progressBar) {
+ progressBar.style.width = scrollPercent + "%";
+ }
+ });
+ // --- End Scroll Progress Indicator ---
+
// ─── Init ───
document.addEventListener('DOMContentLoaded', async () => {
await loadSettings();