apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-05-23 19:05:16 +02:00
Code Issues Projects Releases Packages Wiki Activity

refactor: update UI components to enhance hover effects and color consistency

Browse source
This commit is contained in:
Anish Sarkar 2026-05-13 23:53:09 +05:30
parent a9252913cf
commit 75b7a9cc6c
90 changed files with 237 additions and 208 deletions
Download patch file Download diff file Expand all files Collapse all files

2
surfsense_web/components/documents/DocumentNode.tsx
View file

@ -144,7 +144,7 @@ export const DocumentNode = React.memo(function DocumentNode({
tabIndex={0}
ref={attachRef}
className={cn(
"group flex h-8 w-full items-center gap-2.5 rounded-md px-1 text-sm hover:bg-accent/50 cursor-pointer select-none text-left",
"group flex h-8 w-full items-center gap-2.5 rounded-md px-1 text-sm hover:bg-accent hover:text-accent-foreground cursor-pointer select-none text-left",
isMentioned && "bg-accent/30",
isDragging && "opacity-40"
)}

10
surfsense_web/components/documents/DocumentsFilters.tsx
View file

@ -84,7 +84,7 @@ export function DocumentsFilters({
<TooltipTrigger asChild>
<ToggleGroupItem
value="folder"
className="h-8 w-8 shrink-0 border-0 bg-muted text-muted-foreground transition-colors hover:bg-muted/80 hover:text-foreground"
className="h-8 w-8 shrink-0 border-0 bg-muted text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground"
onClick={(e) => {
e.preventDefault();
onCreateFolder();
@ -109,7 +109,7 @@ export function DocumentsFilters({
"disabled:pointer-events-none disabled:opacity-50",
aiSortEnabled
? "bg-accent text-accent-foreground hover:bg-accent"
: "text-muted-foreground hover:bg-muted/80 hover:text-foreground"
: "text-muted-foreground hover:bg-accent hover:text-accent-foreground"
)}
onClick={(e) => {
e.preventDefault();
@ -143,7 +143,7 @@ export function DocumentsFilters({
<PopoverTrigger asChild>
<ToggleGroupItem
value="filter"
className="relative h-8 w-8 shrink-0 overflow-visible border-0 bg-muted text-muted-foreground transition-colors before:absolute before:left-0 before:top-1/2 before:h-4 before:w-px before:-translate-y-1/2 before:bg-border/60 before:content-[''] hover:bg-muted/80 hover:text-foreground dark:before:bg-white/10"
className="relative h-8 w-8 shrink-0 overflow-visible border-0 bg-muted text-muted-foreground transition-colors before:absolute before:left-0 before:top-1/2 before:h-4 before:w-px before:-translate-y-1/2 before:bg-border/60 before:content-[''] hover:bg-accent hover:text-accent-foreground dark:before:bg-white/10"
>
<ListFilter size={13} />
{activeTypes.length > 0 && (
@ -189,7 +189,7 @@ export function DocumentsFilters({
aria-selected={activeTypes.includes(value)}
tabIndex={0}
key={value}
className="flex w-full items-center gap-2.5 py-2 px-3 rounded-md hover:bg-neutral-200 dark:hover:bg-neutral-700 transition-colors cursor-pointer text-left"
className="flex w-full items-center gap-2.5 py-2 px-3 rounded-md hover:bg-accent hover:text-accent-foreground transition-colors cursor-pointer text-left"
onClick={() => onToggleType(value, !activeTypes.includes(value))}
onKeyDown={(e) => {
if (e.key === "Enter" || e.key === " ") {
@ -261,7 +261,7 @@ export function DocumentsFilters({
onClick={handleUpload}
variant="outline"
size="sm"
className="h-8 shrink-0 gap-1.5 border-0 bg-white text-gray-700 shadow-none hover:bg-gray-50 dark:bg-white dark:text-gray-800 dark:hover:bg-gray-100"
className="h-8 shrink-0 gap-1.5 border-0 bg-white text-gray-700 shadow-none hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-gray-800"
>
<Upload size={13} />
<span>Upload</span>

2
surfsense_web/components/documents/FolderNode.tsx
View file

@ -260,7 +260,7 @@ export const FolderNode = React.memo(function FolderNode({
role="button"
tabIndex={0}
className={cn(
"group relative flex h-8 items-center gap-1 rounded-md px-1 text-sm hover:bg-accent/50 cursor-pointer select-none",
"group relative flex h-8 items-center gap-1 rounded-md px-1 text-sm hover:bg-accent hover:text-accent-foreground cursor-pointer select-none",
isExpanded && "font-medium",
isDragging && "opacity-40",
isOver && canDrop && dropZone === "middle" && "bg-accent ring-1 ring-primary/40",

4
surfsense_web/components/documents/FolderPickerDialog.tsx
View file

@ -92,7 +92,7 @@ export function FolderPickerDialog({
className={cn(
"flex w-full items-center gap-1.5 rounded-md px-2 py-1.5 text-sm transition-colors",
isSelected && "bg-accent text-accent-foreground",
!isSelected && !isDisabled && "hover:bg-accent/50",
!isSelected && !isDisabled && "hover:bg-accent hover:text-accent-foreground",
isDisabled && "cursor-not-allowed opacity-40"
)}
style={{ paddingLeft: `${depth * 16 + 8}px` }}
@ -148,7 +148,7 @@ export function FolderPickerDialog({
className={cn(
"flex w-full items-center gap-1.5 rounded-md px-2 py-1.5 text-sm transition-colors",
selectedId === null && "bg-accent text-accent-foreground",
selectedId !== null && "hover:bg-accent/50"
selectedId !== null && "hover:bg-accent hover:text-accent-foreground"
)}
onClick={() => setSelectedId(null)}
>

2
surfsense_web/components/documents/version-history.tsx
View file

@ -185,7 +185,7 @@ function VersionHistoryPanel({ documentId }: { documentId: number }) {
"flex items-center gap-2 rounded-lg px-3 py-2.5 text-left transition-colors focus:outline-none focus-visible:outline-none w-full",
selectedVersion === v.version_number
? "bg-accent text-accent-foreground"
: "text-muted-foreground hover:bg-accent/50 hover:text-foreground"
: "text-muted-foreground hover:bg-accent hover:text-accent-foreground"
)}
>
<div className="flex-1 min-w-0 space-y-0.5">