From f9feef876357728292ffd05e5afbde83dd4bc072 Mon Sep 17 00:00:00 2001
From: AhmadJeddi <jeddi.dev@gmail.com>
Date: Wed, 5 Aug 2026 21:11:41 +0330
Subject: [PATCH] Add custom scrollbar styling for attack path list

---
 src/App.jsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/App.jsx b/src/App.jsx
index 11c0eec..d5e20de 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -151,6 +151,10 @@ export default function App() {
         .pathRow:hover { border-color: ${COLORS.borderStrong} !important; }
         .toolbarBtn { display: flex; align-items: center; gap: 6px; font-size: 11.5px; padding: 7px 11px; border-radius: 6px; cursor: pointer; font-family: 'IBM Plex Mono', monospace; border: 1px solid ${COLORS.border}; background: ${COLORS.panel2}; color: ${COLORS.textMuted}; }
         .toolbarBtn:hover { border-color: ${COLORS.borderStrong}; color: ${COLORS.textPrimary}; }
+        .attackPathList::-webkit-scrollbar { width: 6px; }
+        .attackPathList::-webkit-scrollbar-track { background: transparent; }
+        .attackPathList::-webkit-scrollbar-thumb { background: #33475A; border-radius: 10px; }
+        .attackPathList::-webkit-scrollbar-thumb:hover { background: #3DDBD9; }
       `}</style>
 
       <div style={{ display: "flex", justifyContent: "space-between", alignItems: "flex-end", marginBottom: "14px", flexWrap: "wrap", gap: "16px" }}>
@@ -338,7 +342,7 @@ export default function App() {
 
           <div style={{ background: COLORS.panel, border: `1px solid ${COLORS.border}`, borderRadius: "8px", padding: "14px" }}>
             <SectionLabel>Predicted attack paths ({paths.length})</SectionLabel>
-            <div style={{ display: "flex", flexDirection: "column", gap: "8px", marginTop: "10px", maxHeight: "300px", overflowY: "auto" }}>
+            <div className="attackPathList" style={{ display: "flex", flexDirection: "column", gap: "8px", marginTop: "10px", maxHeight: "300px", overflowY: "auto" }}>
               {paths.length === 0 && (
                 <div style={{ fontSize: "12px", color: COLORS.textMuted, lineHeight: 1.5 }}>
                   No entry-to-target paths found in this dataset.