emphasize filename

XanderStrike · Dec 12, 2024 · f9ed99a · f9ed99a
1 parent 741c0cf
commit f9ed99a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/script.js b/script.js
@@ -25,11 +25,17 @@ fetch("/filelist")
       const result = fuse.search(query.toLowerCase()).reverse()
       const elements = result.slice(0, 200).map(x => {
         const file = x.item
+        const pathParts = file.path.split('/')
+        const filename = pathParts.pop()
+        const path = pathParts.length ? pathParts.join('/') + '/' : ''
+
         return `<a href="${file.path}">
           <li>
             ${getFileIcon(file.path)}
             <span class="file-details">
-              <span class="filename">${file.path}</span>
+              <span class="filename">
+                <span class="filepath">${path}</span>${filename}
+              </span>
               <span class="filesize">${file.size}</span>
             </span>
           </li>

diff --git a/styles.css b/styles.css
@@ -71,10 +71,17 @@ li:hover {
 
 .filename {
   flex: 1;
+  color: #000;
+  font-weight: 500;
 }
 
 .filesize {
   font-size: 0.8em;
   color: #666;
   white-space: nowrap;
+}
+
+.filepath {
+  color: #666;
+  font-weight: normal;
 }