feat: Prevent global swipe gestures when interacting with horizontally scrollable elements.

index.html

@@ -161,7 +161,7 @@
         }
 
         .markdown-body p {
-            margin-bottom: 1.25rem;
+            /* margin-bottom: 1.25rem; */
             line-height: 1.7;
         }
 
@@ -249,7 +249,6 @@
         .markdown-body img {
             max-width: 100%;
             border-radius: 8px;
-            border: 1px solid var(--border-color);
             cursor: zoom-in;
             transition: transform 0.2s;
         }
@@ -598,7 +597,7 @@
         <div class="p-4 border-t border-hack-border bg-hack-bg/30 flex-none">
             <div class="text-center">
                 <strong class="text-gray-500 text-sm block mb-3 font-mono tracking-wide">:: JOIN US ::</strong>
-                <div class="flex flex-col gap-2.5">
+                <div class="flex flex-col">
 
                     <a href="https://discord.gg/B3ZH9taVfT" target="_blank"
                         class="hover:opacity-80 transition-opacity block">
@@ -714,8 +713,7 @@
         };
 
         marked.use({ renderer });
-        marked.setOptions({ breaks: true, gfm: true });
+        marked.setOptions({ breaks: false, gfm: true });
-
         const STATE = {
             wikiData: {},
             contentCache: {},
@@ -1393,8 +1391,8 @@
         const overlay = document.getElementById('overlay');
 
         function openMenu() {
-            closeTOC(); // Close TOC if open
             sidebar.classList.remove('-translate-x-full');
+            closeTOC(); // Close TOC if open
             overlay.classList.remove('hidden');
             setTimeout(() => overlay.classList.remove('opacity-0'), 10);
         }
@@ -1408,8 +1406,8 @@
             const list = document.getElementById('mobile-toc-list');
             if (!list.hasChildNodes() || list.innerHTML.includes('No sections')) return;
 
-            closeMenu(); // Close Menu if open
             tocSidebar.classList.remove('translate-x-full');
+            closeMenu(); // Close Menu if open
             overlay.classList.remove('hidden');
             setTimeout(() => overlay.classList.remove('opacity-0'), 10);
         }
@@ -1470,22 +1468,44 @@
                 scrollBtn.onclick = () => scrollContainer.scrollTo({ top: 0, behavior: 'smooth' });
             }
         }
-
         // --- MOBILE SWIPE GESTURES ---
         let touchStartX = 0;
         let touchStartY = 0;
         let touchEndX = 0;
         let touchEndY = 0;
+        let scrollableElement = null;
 
         const MIN_SWIPE_DISTANCE = 50;
         const MAX_VERTICAL_DRIFT = 80;
         const EDGE_ZONE_LEFT = 200; // Swipe from left triggers Menu
         const EDGE_ZONE_RIGHT = 100; // Distance from right edge to likely trigger TOC
 
+        // Helper function to check if element has horizontal scroll
+        function hasHorizontalScroll(el) {
+            if (!el) return false;
+            return el.scrollWidth > el.clientWidth;
+        }
+
+        // Find closest scrollable parent
+        function findScrollableParent(el) {
+            while (el && el !== document.body) {
+                if (hasHorizontalScroll(el)) {
+                    return el;
+                }
+                el = el.parentElement;
+            }
+            return null;
+        }
+
         document.addEventListener("touchstart", (e) => {
             const t = e.changedTouches[0];
             touchStartX = t.clientX;
             touchStartY = t.clientY;
+            touchEndX = t.clientX;
+            touchEndY = t.clientY;
+
+            // Check if touch started on a horizontally scrollable element
+            scrollableElement = findScrollableParent(e.target);
         });
 
         document.addEventListener("touchmove", (e) => {
@@ -1495,6 +1515,12 @@
         });
 
         document.addEventListener("touchend", () => {
+            // If we're in a scrollable element, don't trigger swipe gestures
+            if (scrollableElement) {
+                scrollableElement = null;
+                return;
+            }
+
             const dx = touchEndX - touchStartX;
             const dy = Math.abs(touchEndY - touchStartY);
             const screenW = window.innerWidth;

wiki/01_General/Introduction.md

@@ -1,11 +1,5 @@
 # <img src="https://github.com/user-attachments/assets/c5eb4cc1-0c3d-497d-9422-1614651a84ab" alt="thumbnail_IMG_0546" width="33"> Bjorn
-
+![Python](https://img.shields.io/badge/Python-3776AB?logo=python&logoColor=fff) ![Status](https://img.shields.io/badge/Status-Development-blue.svg) [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![Reddit](https://img.shields.io/badge/Reddit-Bjorn__CyberViking-orange?style=for-the-badge&logo=reddit)](https://www.reddit.com/r/Bjorn_CyberViking) [![Discord](https://img.shields.io/badge/Discord-Join%20Us-7289DA?style=for-the-badge&logo=discord)](https://discord.com/invite/B3ZH9taVfT)
-![Python](https://img.shields.io/badge/Python-3776AB?logo=python&logoColor=fff)
-![Status](https://img.shields.io/badge/Status-Development-blue.svg)
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-
-[![Reddit](https://img.shields.io/badge/Reddit-Bjorn__CyberViking-orange?style=for-the-badge&logo=reddit)](https://www.reddit.com/r/Bjorn_CyberViking)
-[![Discord](https://img.shields.io/badge/Discord-Join%20Us-7289DA?style=for-the-badge&logo=discord)](https://discord.com/invite/B3ZH9taVfT)
 
 <p align="center">
   <img src="https://github.com/user-attachments/assets/c5eb4cc1-0c3d-497d-9422-1614651a84ab" alt="thumbnail_IMG_0546" width="150">