mirror of
https://github.com/khoaliber/khoj.git
synced 2026-03-03 13:19:16 +00:00
Render file reference as link with file preview on hover/click in web app
Overview - Khoj references files it used in its response as markdown links. For example [1](file://path/to/file.txt#line=121) - Previously these file links were just shown as raw text - This change renders khoj's inline file references as a proper links and shows file content preview (around specified line if deeplink) on hover or click in the web app Details - Render inline file references as links in chat message on web app. Previously references like [1](file://path/to/file.txt#line=120) would be shown as plain text. Now they are rendered as links - Preview file content of referenced files on click or hover. If reference uses a deeplink with line number, the file content around that line is shown on hover, click. Click allows viewing file preview on mobile, unlike hover. Hover is easier with mouse.
This commit is contained in:
@@ -23,6 +23,22 @@ div.chatMessageWrapper a span {
|
||||
display: revert !important;
|
||||
}
|
||||
|
||||
/* File link styling */
|
||||
.chatMessageWrapper a.file-link {
|
||||
color: hsl(var(--primary));
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
transition: color 0.2s ease;
|
||||
}
|
||||
|
||||
.chatMessageWrapper a.file-link:hover {
|
||||
color: hsl(var(--primary-foreground));
|
||||
background-color: hsl(var(--primary));
|
||||
text-decoration: none;
|
||||
padding: 2px 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
div.khojfullHistory {
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user