fix(ui) : improve back-to-top button visibility on scroll

.github/workflows/main.yaml

@@ -62,7 +62,7 @@ jobs:
       - name: Linter
         if: ${{ github.event_name == 'pull_request' }}
         env:
-          PRE_COMMIT_SKIP: mkdocs-build
+          PRE_COMMIT_SKIP: mkdocs-build,linkcheckmd
         run: |
           pre-commit install
           pre-commit run --all-files --verbose

theme/css/content.css

@@ -37,11 +37,11 @@ blockquote{
 .anchor-link:hover { opacity: 1; }
 
 /* ensure the back-to-top is perfectly round */
-.to_top {
+/* .to_top {
   width: 48px; height: 48px; border-radius: 50%;
   display: grid; place-items: center;
 }
-.to_top .icon { width: 24px; height: 24px; }
+.to_top .icon { width: 24px; height: 24px; } */
 
 /* ───────── Polished non-home page system ───────── */
 .osl-page{

theme/css/home.css

@@ -425,13 +425,13 @@
 }
 
 /* Back-to-top only: keep functional, not part of page layout language. */
-.to_top{
+/* .to_top{
   width: 48px;
   height: 48px;
   display: grid;
   place-items: center;
 }
-.to_top .icon{ width: 22px; height: 22px; }
+.to_top .icon{ width: 22px; height: 22px; } */
 
 html[data-mode="dim"] .home-editorial,
 [data-bs-theme="dark"] .home-editorial{

theme/css/nav.css

@@ -160,7 +160,20 @@
 }
 
 /* Back to top */
-.to_top{ position: fixed; right: 1rem; bottom: 1rem; z-index: 10; opacity: .9; }
+.to_top{ position: fixed;
+  right: 1rem;
+  bottom: 1rem;
+  z-index: 10;
+  opacity: 0;
+  width: 34px;
+  height: 34px;
+  border-radius: 50%;
+  display: grid;
+  place-items: center;
+  pointer-events: none;
+  transition: opacity 0.3s ease;
+ }
+.to_top.visible{ opacity: 0.9;pointer-events: auto;}
 .to_top .icon{ width: 34px; height: 34px; }
 
 

theme/js/theme.js

@@ -92,6 +92,19 @@
     });
   });
 
+  /*8) Back to top button visibility */
+  const toTopBtn = document.querySelector(".to_top");
+
+  if(toTopBtn){
+    window.addEventListener("scroll", function(){
+      if(window.scrollY > 150){
+        toTopBtn.classList.add("visible");
+      }else{
+        toTopBtn.classList.remove("visible");
+      }
+    })
+  };
+
   // Optional public API
   window.OSLTheme = {
     getMode: () => docEl.getAttribute('data-mode'),