apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-05-21 18:55: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/app/dashboard/[search_space_id]/buy-more/page.tsx
View file

@ -34,7 +34,7 @@ export default function BuyMorePage() {
"flex-1 rounded-md px-3 py-1.5 text-sm font-medium transition-colors", "flex-1 rounded-md px-3 py-1.5 text-sm font-medium transition-colors",
activeTab === tab.id activeTab === tab.id
? "bg-background text-foreground shadow-sm" ? "bg-background text-foreground shadow-sm"
: "text-muted-foreground hover:text-foreground" : "text-muted-foreground hover:text-accent-foreground"
)} )}
> >
{tab.label} {tab.label}

4
surfsense_web/app/dashboard/[search_space_id]/logs/(manage)/page.tsx
View file

@ -739,7 +739,7 @@ function LogsFilters({
</div> </div>
{Boolean(filterInput) && ( {Boolean(filterInput) && (
<Button <Button
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 hover:text-foreground" className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 hover:text-accent-foreground"
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={() => { onClick={() => {
@ -1045,7 +1045,7 @@ function LogsTable({
}} }}
exit={{ opacity: 0, y: -10 }} exit={{ opacity: 0, y: -10 }}
className={cn( className={cn(
"border-b transition-colors hover:bg-muted/50", "border-b transition-colors hover:bg-accent hover:text-accent-foreground",
row.getIsSelected() ? "bg-muted/50" : "" row.getIsSelected() ? "bg-muted/50" : ""
)} )}
> >

2
surfsense_web/app/dashboard/[search_space_id]/logs/loading.tsx
View file

@ -53,7 +53,7 @@ export default function Loading() {
{/* Table Rows */} {/* Table Rows */}
{[...Array(6)].map((_, i) => ( {[...Array(6)].map((_, i) => (
<div key={i} className="border-b px-4 py-3 flex items-center gap-4 hover:bg-muted/50"> <div key={i} className="border-b px-4 py-3 flex items-center gap-4 hover:bg-accent hover:text-accent-foreground">
<Skeleton className="h-4 w-4" /> <Skeleton className="h-4 w-4" />
<Skeleton className="h-6 w-12 rounded-full" /> <Skeleton className="h-6 w-12 rounded-full" />
<Skeleton className="h-6 w-16 rounded-full" /> <Skeleton className="h-6 w-16 rounded-full" />

4
surfsense_web/app/dashboard/[search_space_id]/team/team-content.tsx
View file

@ -454,7 +454,7 @@ function MemberRow({
const showActions = !member.is_owner && (canManageRoles || canRemove); const showActions = !member.is_owner && (canManageRoles || canRemove);
return ( return (
<TableRow className="border-b border-border/40 transition-colors hover:bg-muted/30"> <TableRow className="border-b border-border/40 transition-colors hover:bg-accent hover:text-accent-foreground">
<TableCell className="w-[45%] py-2.5 px-4 md:px-6 max-w-0 border-r border-border/40"> <TableCell className="w-[45%] py-2.5 px-4 md:px-6 max-w-0 border-r border-border/40">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<Avatar className="size-10 shrink-0"> <Avatar className="size-10 shrink-0">
@ -484,7 +484,7 @@ function MemberRow({
<DropdownMenuTrigger asChild> <DropdownMenuTrigger asChild>
<button <button
type="button" type="button"
className="inline-flex items-center gap-1.5 text-sm text-muted-foreground hover:text-foreground transition-colors" className="inline-flex items-center gap-1.5 text-sm text-muted-foreground hover:text-accent-foreground transition-colors"
> >
{roleName} {roleName}
<ChevronDown className="h-4 w-4" /> <ChevronDown className="h-4 w-4" />

4
surfsense_web/app/dashboard/[search_space_id]/user-settings/components/ApiKeyContent.tsx
View file

@ -52,7 +52,7 @@ export function ApiKeyContent() {
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={copyToClipboard} onClick={copyToClipboard}
className="h-6 w-6 shrink-0 text-muted-foreground hover:text-foreground" className="h-6 w-6 shrink-0 text-muted-foreground hover:text-accent-foreground"
> >
{copied ? ( {copied ? (
<Check className="h-3 w-3 text-green-500" /> <Check className="h-3 w-3 text-green-500" />
@ -86,7 +86,7 @@ export function ApiKeyContent() {
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={copyUsageToClipboard} onClick={copyUsageToClipboard}
className="h-6 w-6 shrink-0 text-muted-foreground hover:text-foreground" className="h-6 w-6 shrink-0 text-muted-foreground hover:text-accent-foreground"
> >
{copiedUsage ? ( {copiedUsage ? (
<Check className="h-3 w-3 text-green-500" /> <Check className="h-3 w-3 text-green-500" />

4
surfsense_web/app/dashboard/[search_space_id]/user-settings/components/DesktopShortcutsContent.tsx
View file

@ -90,7 +90,7 @@ function HotkeyRow({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="size-7 text-muted-foreground hover:text-foreground" className="size-7 text-muted-foreground hover:text-accent-foreground"
onClick={onReset} onClick={onReset}
title="Reset to default" title="Reset to default"
> >
@ -111,7 +111,7 @@ function HotkeyRow({
} }
> >
{recording ? ( {recording ? (
<span className="px-2 text-[9px] text-primary whitespace-nowrap">Press hotkeys...</span> <span className="px-2 text-[9px] text-primary whitespace-nowrap">Press hotkeys</span>
) : ( ) : (
<ShortcutKbd keys={displayKeys} className="ml-0 px-1.5 text-foreground/85" /> <ShortcutKbd keys={displayKeys} className="ml-0 px-1.5 text-foreground/85" />
)} )}

2
surfsense_web/app/dashboard/[search_space_id]/user-settings/components/MemoryContent.tsx
View file

@ -222,7 +222,7 @@ export function MemoryContent() {
onClick={handleEdit} onClick={handleEdit}
disabled={editing || !editQuery.trim()} disabled={editing || !editQuery.trim()}
className={`h-11 w-11 shrink-0 rounded-full ${ className={`h-11 w-11 shrink-0 rounded-full ${
editing ? "" : "bg-muted-foreground/15 hover:bg-muted-foreground/20" editing ? "" : "bg-muted-foreground/15 hover:bg-accent hover:text-accent-foreground"
}`} }`}
> >
{editing ? ( {editing ? (

2
surfsense_web/app/dashboard/[search_space_id]/user-settings/components/ProfileContent.tsx
View file

@ -114,7 +114,7 @@ export function ProfileContent() {
type="submit" type="submit"
variant="outline" variant="outline"
disabled={isPending || !hasChanges} disabled={isPending || !hasChanges}
className="relative gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="relative gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
<span className={isPending ? "opacity-0" : ""}>{t("profile_save")}</span> <span className={isPending ? "opacity-0" : ""}>{t("profile_save")}</span>
{isPending && <Spinner size="sm" className="absolute" />} {isPending && <Spinner size="sm" className="absolute" />}

2
surfsense_web/app/dashboard/[search_space_id]/user-settings/components/PromptsContent.tsx
View file

@ -292,7 +292,7 @@ export function PromptsContent() {
title={prompt.is_public ? "Make private" : "Share with community"} title={prompt.is_public ? "Make private" : "Share with community"}
onClick={() => handleTogglePublic(prompt)} onClick={() => handleTogglePublic(prompt)}
disabled={togglingPublicIds.has(prompt.id)} disabled={togglingPublicIds.has(prompt.id)}
className="flex items-center justify-center size-7 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent transition-colors disabled:opacity-50 disabled:pointer-events-none" className="flex items-center justify-center size-7 rounded-md text-muted-foreground hover:text-accent-foreground hover:bg-accent transition-colors disabled:opacity-50 disabled:pointer-events-none"
> >
{togglingPublicIds.has(prompt.id) ? ( {togglingPublicIds.has(prompt.id) ? (
<Spinner className="size-3.5" /> <Spinner className="size-3.5" />

43
surfsense_web/app/desktop/login/page.tsx
View file

@ -1,6 +1,5 @@
"use client"; "use client";
import { IconBrandGoogleFilled } from "@tabler/icons-react";
import { useAtom } from "jotai"; import { useAtom } from "jotai";
import { Crop, Eye, EyeOff, Rocket, RotateCcw, Zap } from "lucide-react"; import { Crop, Eye, EyeOff, Rocket, RotateCcw, Zap } from "lucide-react";
import Image from "next/image"; import Image from "next/image";
@ -24,6 +23,34 @@ const isGoogleAuth = AUTH_TYPE === "GOOGLE";
type ShortcutKey = "generalAssist" | "quickAsk" | "screenshotAssist"; type ShortcutKey = "generalAssist" | "quickAsk" | "screenshotAssist";
type ShortcutMap = typeof DEFAULT_SHORTCUTS; type ShortcutMap = typeof DEFAULT_SHORTCUTS;
function GoogleGLogo({ className }: { className?: string }) {
return (
<svg
className={className}
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 48 48"
aria-hidden="true"
>
<path
fill="#EA4335"
d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"
/>
<path
fill="#4285F4"
d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"
/>
<path
fill="#FBBC05"
d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"
/>
<path
fill="#34A853"
d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"
/>
</svg>
);
}
const HOTKEY_ROWS: Array<{ const HOTKEY_ROWS: Array<{
key: ShortcutKey; key: ShortcutKey;
label: string; label: string;
@ -148,7 +175,7 @@ function HotkeyRow({
} }
> >
{recording ? ( {recording ? (
<span className="px-2 text-[9px] text-primary whitespace-nowrap">Press hotkeys...</span> <span className="px-2 text-[9px] text-primary whitespace-nowrap">Press hotkeys</span>
) : ( ) : (
<ShortcutKbd keys={displayKeys} className="ml-0 px-1.5 text-foreground/85" /> <ShortcutKbd keys={displayKeys} className="ml-0 px-1.5 text-foreground/85" />
)} )}
@ -255,8 +282,8 @@ export default function DesktopLoginPage() {
}; };
return ( return (
<div className="relative flex min-h-svh items-center justify-center bg-background p-4 sm:p-6 select-none"> <div className="relative flex min-h-svh items-center justify-center bg-main-panel p-4 sm:p-6 select-none">
<div className="relative flex w-full max-w-md flex-col overflow-hidden bg-card shadow-lg"> <div className="relative flex w-full max-w-md flex-col overflow-hidden bg-main-panel">
{/* Header */} {/* Header */}
<div className="flex flex-col items-center px-6 pt-6 pb-2 text-center"> <div className="flex flex-col items-center px-6 pt-6 pb-2 text-center">
<Image <Image
@ -313,8 +340,12 @@ export default function DesktopLoginPage() {
</p> */} </p> */}
{isGoogleAuth ? ( {isGoogleAuth ? (
<Button variant="outline" className="w-full gap-2 h-10" onClick={handleGoogleLogin}> <Button
<IconBrandGoogleFilled className="size-4" /> variant="outline"
className="w-full gap-2 h-10 bg-white text-[#1f1f1f] border-white hover:bg-zinc-100 hover:text-[#1f1f1f] dark:border-white shadow-sm font-medium"
onClick={handleGoogleLogin}
>
<GoogleGLogo className="size-4" />
Continue with Google Continue with Google
</Button> </Button>
) : ( ) : (

4
surfsense_web/app/globals.css
View file

@ -18,7 +18,7 @@
--foreground: oklch(0.145 0 0); --foreground: oklch(0.145 0 0);
--card: oklch(1 0 0); --card: oklch(1 0 0);
--card-foreground: oklch(0.145 0 0); --card-foreground: oklch(0.145 0 0);
--popover: oklch(1 0 0); --popover: oklch(0.99 0 0);
--popover-foreground: oklch(0.145 0 0); --popover-foreground: oklch(0.145 0 0);
--primary: oklch(0.205 0 0); --primary: oklch(0.205 0 0);
--primary-foreground: oklch(0.985 0 0); --primary-foreground: oklch(0.985 0 0);
@ -62,7 +62,7 @@
--foreground: oklch(0.985 0 0); --foreground: oklch(0.985 0 0);
--card: oklch(0.145 0 0); --card: oklch(0.145 0 0);
--card-foreground: oklch(0.985 0 0); --card-foreground: oklch(0.985 0 0);
--popover: oklch(0.145 0 0); --popover: oklch(0.32 0 0);
--popover-foreground: oklch(0.985 0 0); --popover-foreground: oklch(0.985 0 0);
--primary: oklch(0.985 0 0); --primary: oklch(0.985 0 0);
--primary-foreground: oklch(0.205 0 0); --primary-foreground: oklch(0.205 0 0);

2
surfsense_web/components/agent-action-log/action-log-item.tsx
View file

@ -77,7 +77,7 @@ export function ActionLogItem({ action, threadId, onRevertSuccess }: ActionLogIt
<button <button
type="button" type="button"
onClick={() => setIsExpanded((v) => !v)} onClick={() => setIsExpanded((v) => !v)}
className="flex w-full items-start gap-3 p-3 text-left hover:bg-muted/40" className="flex w-full items-start gap-3 p-3 text-left hover:bg-accent hover:text-accent-foreground"
aria-expanded={isExpanded} aria-expanded={isExpanded}
> >
<div className="flex size-8 shrink-0 items-center justify-center rounded-md bg-muted"> <div className="flex size-8 shrink-0 items-center justify-center rounded-md bg-muted">

6
surfsense_web/components/assistant-ui/assistant-message.tsx
View file

@ -151,7 +151,7 @@ const MobileCitationDrawer: FC = () => {
"isolate inline-flex cursor-pointer items-center gap-2 rounded-lg px-3 py-2", "isolate inline-flex cursor-pointer items-center gap-2 rounded-lg px-3 py-2",
"bg-muted/40 outline-none", "bg-muted/40 outline-none",
"transition-colors duration-150", "transition-colors duration-150",
"hover:bg-muted/70", "hover:bg-accent hover:text-accent-foreground",
"focus-visible:ring-ring focus-visible:ring-2" "focus-visible:ring-ring focus-visible:ring-2"
)} )}
> >
@ -208,7 +208,7 @@ const MobileCitationDrawer: FC = () => {
key={citation.id} key={citation.id}
type="button" type="button"
onClick={() => handleNavigate(citation)} onClick={() => handleNavigate(citation)}
className="group flex w-full items-center gap-2.5 rounded-md px-3 py-2.5 text-left transition-colors hover:bg-muted focus-visible:bg-muted focus-visible:outline-none" className="group flex w-full items-center gap-2.5 rounded-md px-3 py-2.5 text-left transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-muted focus-visible:outline-none"
> >
{citation.favicon ? ( {citation.favicon ? (
// biome-ignore lint/performance/noImgElement: external favicon from arbitrary domain // biome-ignore lint/performance/noImgElement: external favicon from arbitrary domain
@ -526,7 +526,7 @@ export const AssistantMessage: FC = () => {
? "bg-primary/10 text-primary" ? "bg-primary/10 text-primary"
: hasComments : hasComments
? "text-primary hover:bg-primary/10" ? "text-primary hover:bg-primary/10"
: "text-muted-foreground hover:text-foreground hover:bg-muted" : "text-muted-foreground hover:text-accent-foreground hover:bg-accent hover:text-accent-foreground"
)} )}
> >
<MessageCircleReply className={cn("size-3.5", hasComments && "fill-current")} /> <MessageCircleReply className={cn("size-3.5", hasComments && "fill-current")} />

2
surfsense_web/components/assistant-ui/chat-viewport.tsx
View file

@ -9,7 +9,7 @@ const ChatScrollToBottom: FC = () => (
<ThreadPrimitive.ScrollToBottom asChild> <ThreadPrimitive.ScrollToBottom asChild>
<TooltipIconButton <TooltipIconButton
tooltip="Scroll to bottom" tooltip="Scroll to bottom"
className="aui-thread-scroll-to-bottom -top-12 absolute z-10 self-center rounded-full border-0 bg-muted p-4 text-foreground hover:bg-muted/80 disabled:invisible" className="aui-thread-scroll-to-bottom -top-12 absolute z-10 self-center rounded-full border-0 bg-muted p-4 text-foreground hover:bg-accent hover:text-accent-foreground disabled:invisible"
> >
<ArrowDownIcon /> <ArrowDownIcon />
</TooltipIconButton> </TooltipIconButton>

2
surfsense_web/components/assistant-ui/connector-popup.tsx
View file

@ -219,7 +219,7 @@ export const ConnectorIndicator = forwardRef<ConnectorIndicatorHandle, Connector
onPointerDownOutside={(e) => { onPointerDownOutside={(e) => {
if (pickerOpen) e.preventDefault(); if (pickerOpen) e.preventDefault();
}} }}
className="max-w-3xl w-[95vw] sm:w-full h-[75vh] sm:h-[85vh] flex flex-col p-0 gap-0 overflow-hidden ring-0 dark:ring-0 [&>button]:right-4 sm:[&>button]:right-12 [&>button]:top-6 sm:[&>button]:top-10 [&>button]:opacity-80 [&>button]:hover:opacity-100 [&>button]:hover:bg-foreground/10 [&>button>svg]:size-5 select-none" className="max-w-3xl w-[95vw] sm:w-full h-[75vh] sm:h-[85vh] flex flex-col p-0 gap-0 overflow-hidden ring-0 dark:ring-0 [&>button]:right-4 sm:[&>button]:right-12 [&>button]:top-6 sm:[&>button]:top-10 [&>button]:opacity-80 [&>button]:hover:opacity-100 [&>button]:hover:bg-accent [&>button]:hover:text-accent-foreground [&>button>svg]:size-5 select-none"
> >
<DialogTitle className="sr-only">Manage Connectors</DialogTitle> <DialogTitle className="sr-only">Manage Connectors</DialogTitle>
{/* YouTube Crawler View - shown when adding YouTube videos */} {/* YouTube Crawler View - shown when adding YouTube videos */}

6
surfsense_web/components/assistant-ui/connector-popup/components/connector-card.tsx
View file

@ -81,8 +81,8 @@ export const ConnectorCard: FC<ConnectorCardProps> = ({
className={cn( className={cn(
"group relative flex items-center gap-4 p-4 rounded-xl text-left transition-all duration-200 w-full border", "group relative flex items-center gap-4 p-4 rounded-xl text-left transition-all duration-200 w-full border",
status.status === "warning" status.status === "warning"
? "border-yellow-500/30 bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10" ? "border-yellow-500/30 bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground"
: "border-border bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10" : "border-border bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground"
)} )}
> >
<div <div
@ -147,7 +147,7 @@ export const ConnectorCard: FC<ConnectorCardProps> = ({
className={cn( className={cn(
"relative h-8 text-[11px] px-3 rounded-lg shrink-0 font-medium items-center justify-center", "relative h-8 text-[11px] px-3 rounded-lg shrink-0 font-medium items-center justify-center",
isConnected && isConnected &&
"bg-white text-slate-700 hover:bg-slate-50 border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground dark:hover:bg-secondary/80", "bg-white text-slate-700 hover:bg-accent hover:text-accent-foreground border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground",
!isConnected && "shadow-xs" !isConnected && "shadow-xs"
)} )}
onClick={isConnected ? onManage : onConnect} onClick={isConnected ? onManage : onConnect}

2
surfsense_web/components/assistant-ui/connector-popup/components/connector-dialog-header.tsx
View file

@ -69,7 +69,7 @@ export const ConnectorDialogHeader: FC<ConnectorDialogHeaderProps> = ({
autoComplete="off" autoComplete="off"
placeholder="Search" placeholder="Search"
className={cn( className={cn(
"w-full bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10 focus:bg-slate-400/10 dark:focus:bg-white/10 border border-border rounded-xl pl-9 py-2 text-sm transition-all outline-none placeholder:text-muted-foreground/50", "w-full bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground focus:bg-slate-400/10 dark:focus:bg-white/10 border border-border rounded-xl pl-9 py-2 text-sm transition-all outline-none placeholder:text-muted-foreground/50",
searchQuery ? "pr-9" : "pr-4" searchQuery ? "pr-9" : "pr-4"
)} )}
value={searchQuery} value={searchQuery}

8
surfsense_web/components/assistant-ui/connector-popup/components/date-range-selector.tsx
View file

@ -136,7 +136,7 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
variant="outline" variant="outline"
size="sm" size="sm"
onClick={handleClearDates} onClick={handleClearDates}
className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-slate-400/10 dark:hover:bg-slate-400/10" className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-accent hover:text-accent-foreground"
> >
Clear Dates Clear Dates
</Button> </Button>
@ -145,7 +145,7 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
variant="outline" variant="outline"
size="sm" size="sm"
onClick={handleLast30Days} onClick={handleLast30Days}
className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-slate-400/10 dark:hover:bg-slate-400/10" className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-accent hover:text-accent-foreground"
> >
Last 30 Days Last 30 Days
</Button> </Button>
@ -155,7 +155,7 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
variant="outline" variant="outline"
size="sm" size="sm"
onClick={handleNext30Days} onClick={handleNext30Days}
className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-slate-400/10 dark:hover:bg-slate-400/10" className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-accent hover:text-accent-foreground"
> >
Next 30 Days Next 30 Days
</Button> </Button>
@ -165,7 +165,7 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
variant="outline" variant="outline"
size="sm" size="sm"
onClick={handleLastYear} onClick={handleLastYear}
className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-slate-400/10 dark:hover:bg-slate-400/10" className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-accent hover:text-accent-foreground"
> >
Last Year Last Year
</Button> </Button>

6
surfsense_web/components/assistant-ui/connector-popup/connect-forms/components/mcp-connect-form.tsx
View file

@ -155,7 +155,7 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
type="button" type="button"
variant="ghost" variant="ghost"
size="sm" size="sm"
className="h-6 px-2 text-xs text-muted-foreground hover:text-foreground" className="h-6 px-2 text-xs text-muted-foreground hover:text-accent-foreground"
onClick={() => handleConfigChange(DEFAULT_STDIO_CONFIG)} onClick={() => handleConfigChange(DEFAULT_STDIO_CONFIG)}
> >
Local Example Local Example
@ -164,7 +164,7 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
type="button" type="button"
variant="ghost" variant="ghost"
size="sm" size="sm"
className="h-6 px-2 text-xs text-muted-foreground hover:text-foreground" className="h-6 px-2 text-xs text-muted-foreground hover:text-accent-foreground"
onClick={() => handleConfigChange(DEFAULT_HTTP_CONFIG)} onClick={() => handleConfigChange(DEFAULT_HTTP_CONFIG)}
> >
Remote Example Remote Example
@ -210,7 +210,7 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
onClick={handleTestConnection} onClick={handleTestConnection}
disabled={isTesting} disabled={isTesting}
variant="secondary" variant="secondary"
className="w-full h-8 text-[13px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-slate-50 border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground dark:hover:bg-secondary/80" className="w-full h-8 text-[13px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-accent hover:text-accent-foreground border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground"
> >
{isTesting ? ( {isTesting ? (
<> <>

2
surfsense_web/components/assistant-ui/connector-popup/connect-forms/components/obsidian-connect-form.tsx
View file

@ -123,7 +123,7 @@ export const ObsidianConnectForm: FC<ConnectFormProps> = ({ onBack }) => {
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={copyToClipboard} onClick={copyToClipboard}
className="size-7 shrink-0 text-muted-foreground hover:text-foreground" className="size-7 shrink-0 text-muted-foreground hover:text-accent-foreground"
aria-label={copied ? "Copied" : "Copy API key"} aria-label={copied ? "Copied" : "Copy API key"}
> >
{copied ? ( {copied ? (

6
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/composio-drive-config.tsx
View file

@ -199,7 +199,7 @@ export const ComposioDriveConfig: FC<ConnectorConfigProps> = ({ connector, onCon
<button <button
type="button" type="button"
onClick={() => handleRemoveFolder(folder.id)} onClick={() => handleRemoveFolder(folder.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${folder.name}`} aria-label={`Remove ${folder.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -217,7 +217,7 @@ export const ComposioDriveConfig: FC<ConnectorConfigProps> = ({ connector, onCon
<button <button
type="button" type="button"
onClick={() => handleRemoveFile(file.id)} onClick={() => handleRemoveFile(file.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${file.name}`} aria-label={`Remove ${file.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -240,7 +240,7 @@ export const ComposioDriveConfig: FC<ConnectorConfigProps> = ({ connector, onCon
<button <button
type="button" type="button"
onClick={() => setIsFolderTreeOpen((prev) => !prev)} onClick={() => setIsFolderTreeOpen((prev) => !prev)}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground transition-colors w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground transition-colors w-fit"
> >
Change Selection Change Selection
{isFolderTreeOpen ? ( {isFolderTreeOpen ? (

4
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/discord-config.tsx
View file

@ -100,7 +100,7 @@ export const DiscordConfig: FC<DiscordConfigProps> = ({ connector }) => {
size="sm" size="sm"
onClick={fetchChannels} onClick={fetchChannels}
disabled={isLoading} disabled={isLoading}
className="h-7 px-2.5 text-[11px] bg-slate-400/10 dark:bg-white/10 hover:bg-slate-400/20 dark:hover:bg-white/20 border-slate-400/20 dark:border-white/20" className="h-7 px-2.5 text-[11px] bg-slate-400/10 dark:bg-white/10 hover:bg-accent hover:text-accent-foreground border-slate-400/20 dark:border-white/20"
> >
<RefreshCw className={cn("mr-1.5 size-3", isLoading && "animate-spin")} /> <RefreshCw className={cn("mr-1.5 size-3", isLoading && "animate-spin")} />
Refresh Refresh
@ -175,7 +175,7 @@ interface ChannelPillProps {
const ChannelPill: FC<ChannelPillProps> = ({ channel }) => { const ChannelPill: FC<ChannelPillProps> = ({ channel }) => {
return ( return (
<div className="inline-flex items-center gap-1 px-2 py-1 rounded-md text-[11px] font-medium bg-slate-400/10 dark:bg-white/10 hover:bg-slate-400/20 dark:hover:bg-white/20 transition-colors"> <div className="inline-flex items-center gap-1 px-2 py-1 rounded-md text-[11px] font-medium bg-slate-400/10 dark:bg-white/10 hover:bg-accent hover:text-accent-foreground transition-colors">
{channel.type === "announcement" ? ( {channel.type === "announcement" ? (
<Megaphone className="size-2.5 text-muted-foreground" /> <Megaphone className="size-2.5 text-muted-foreground" />
) : ( ) : (

6
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/dropbox-config.tsx
View file

@ -180,7 +180,7 @@ export const DropboxConfig: FC<ConnectorConfigProps> = ({ connector, onConfigCha
<button <button
type="button" type="button"
onClick={() => handleRemoveFolder(folder.id)} onClick={() => handleRemoveFolder(folder.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${folder.name}`} aria-label={`Remove ${folder.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -198,7 +198,7 @@ export const DropboxConfig: FC<ConnectorConfigProps> = ({ connector, onConfigCha
<button <button
type="button" type="button"
onClick={() => handleRemoveFile(file.id)} onClick={() => handleRemoveFile(file.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${file.name}`} aria-label={`Remove ${file.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -220,7 +220,7 @@ export const DropboxConfig: FC<ConnectorConfigProps> = ({ connector, onConfigCha
<button <button
type="button" type="button"
onClick={() => setIsFolderTreeOpen(!isFolderTreeOpen)} onClick={() => setIsFolderTreeOpen(!isFolderTreeOpen)}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground transition-colors w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground transition-colors w-fit"
> >
Change Selection Change Selection
{isFolderTreeOpen ? ( {isFolderTreeOpen ? (

6
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/google-drive-config.tsx
View file

@ -191,7 +191,7 @@ export const GoogleDriveConfig: FC<ConnectorConfigProps> = ({ connector, onConfi
<button <button
type="button" type="button"
onClick={() => handleRemoveFolder(folder.id)} onClick={() => handleRemoveFolder(folder.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${folder.name}`} aria-label={`Remove ${folder.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -209,7 +209,7 @@ export const GoogleDriveConfig: FC<ConnectorConfigProps> = ({ connector, onConfi
<button <button
type="button" type="button"
onClick={() => handleRemoveFile(file.id)} onClick={() => handleRemoveFile(file.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${file.name}`} aria-label={`Remove ${file.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -225,7 +225,7 @@ export const GoogleDriveConfig: FC<ConnectorConfigProps> = ({ connector, onConfi
variant="outline" variant="outline"
onClick={openPicker} onClick={openPicker}
disabled={pickerLoading || isAuthExpired} disabled={pickerLoading || isAuthExpired}
className="bg-slate-400/5 dark:bg-white/5 border-slate-400/20 hover:bg-slate-400/10 dark:hover:bg-white/10 text-xs sm:text-sm h-8 sm:h-9" className="bg-slate-400/5 dark:bg-white/5 border-slate-400/20 hover:bg-accent hover:text-accent-foreground text-xs sm:text-sm h-8 sm:h-9"
> >
{pickerLoading && <Spinner size="xs" className="mr-1.5" />} {pickerLoading && <Spinner size="xs" className="mr-1.5" />}
{totalSelected > 0 ? "Change Selection" : "Select from Google Drive"} {totalSelected > 0 ? "Change Selection" : "Select from Google Drive"}

2
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/mcp-config.tsx
View file

@ -215,7 +215,7 @@ export const MCPConfig: FC<MCPConfigProps> = ({ connector, onConfigChange, onNam
onClick={handleTestConnection} onClick={handleTestConnection}
disabled={isTesting} disabled={isTesting}
variant="secondary" variant="secondary"
className="w-full h-8 text-[13px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-slate-50 border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground dark:hover:bg-secondary/80" className="w-full h-8 text-[13px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-accent hover:text-accent-foreground border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground"
> >
{isTesting ? ( {isTesting ? (
<> <>

6
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/onedrive-config.tsx
View file

@ -181,7 +181,7 @@ export const OneDriveConfig: FC<ConnectorConfigProps> = ({ connector, onConfigCh
<button <button
type="button" type="button"
onClick={() => handleRemoveFolder(folder.id)} onClick={() => handleRemoveFolder(folder.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${folder.name}`} aria-label={`Remove ${folder.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -199,7 +199,7 @@ export const OneDriveConfig: FC<ConnectorConfigProps> = ({ connector, onConfigCh
<button <button
type="button" type="button"
onClick={() => handleRemoveFile(file.id)} onClick={() => handleRemoveFile(file.id)}
className="shrink-0 p-0.5 hover:bg-muted-foreground/20 rounded transition-colors" className="shrink-0 p-0.5 hover:bg-accent hover:text-accent-foreground rounded transition-colors"
aria-label={`Remove ${file.name}`} aria-label={`Remove ${file.name}`}
> >
<X className="size-3.5" /> <X className="size-3.5" />
@ -221,7 +221,7 @@ export const OneDriveConfig: FC<ConnectorConfigProps> = ({ connector, onConfigCh
<button <button
type="button" type="button"
onClick={() => setIsFolderTreeOpen((prev) => !prev)} onClick={() => setIsFolderTreeOpen((prev) => !prev)}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground transition-colors w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground transition-colors w-fit"
> >
Change Selection Change Selection
{isFolderTreeOpen ? ( {isFolderTreeOpen ? (

4
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/slack-config.tsx
View file

@ -104,7 +104,7 @@ export const SlackConfig: FC<SlackConfigProps> = ({ connector }) => {
size="sm" size="sm"
onClick={fetchChannels} onClick={fetchChannels}
disabled={isLoading} disabled={isLoading}
className="h-7 px-2.5 text-[11px] bg-slate-400/10 dark:bg-white/10 hover:bg-slate-400/20 dark:hover:bg-white/20 border-slate-400/20 dark:border-white/20" className="h-7 px-2.5 text-[11px] bg-slate-400/10 dark:bg-white/10 hover:bg-accent hover:text-accent-foreground border-slate-400/20 dark:border-white/20"
> >
<RefreshCw className={cn("mr-1.5 size-3", isLoading && "animate-spin")} /> <RefreshCw className={cn("mr-1.5 size-3", isLoading && "animate-spin")} />
Refresh Refresh
@ -178,7 +178,7 @@ interface ChannelPillProps {
const ChannelPill: FC<ChannelPillProps> = ({ channel }) => { const ChannelPill: FC<ChannelPillProps> = ({ channel }) => {
return ( return (
<div className="inline-flex items-center gap-1 px-2 py-1 rounded-md text-[11px] font-medium bg-slate-400/10 dark:bg-white/10 hover:bg-slate-400/20 dark:hover:bg-white/20 transition-colors"> <div className="inline-flex items-center gap-1 px-2 py-1 rounded-md text-[11px] font-medium bg-slate-400/10 dark:bg-white/10 hover:bg-accent hover:text-accent-foreground transition-colors">
{channel.is_private ? ( {channel.is_private ? (
<Lock className="size-2.5 text-muted-foreground" /> <Lock className="size-2.5 text-muted-foreground" />
) : ( ) : (

2
surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/webcrawler-config.tsx
View file

@ -79,7 +79,7 @@ export const WebcrawlerConfig: FC<ConnectorConfigProps> = ({ connector, onConfig
variant="ghost" variant="ghost"
size="sm" size="sm"
onClick={() => setShowApiKey((prev) => !prev)} onClick={() => setShowApiKey((prev) => !prev)}
className="absolute right-1 top-1/2 -translate-y-1/2 h-7 px-2 text-xs text-muted-foreground hover:text-foreground" className="absolute right-1 top-1/2 -translate-y-1/2 h-7 px-2 text-xs text-muted-foreground hover:text-accent-foreground"
> >
{showApiKey ? "Hide" : "Show"} {showApiKey ? "Hide" : "Show"}
</Button> </Button>

2
surfsense_web/components/assistant-ui/connector-popup/connector-configs/views/connector-connect-view.tsx
View file

@ -93,7 +93,7 @@ export const ConnectorConnectView: FC<ConnectorConnectViewProps> = ({
<button <button
type="button" type="button"
onClick={onBack} onClick={onBack}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground mb-6 w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground mb-6 w-fit"
> >
<ArrowLeft className="size-4" /> <ArrowLeft className="size-4" />
Back to connectors Back to connectors

4
surfsense_web/components/assistant-ui/connector-popup/connector-configs/views/connector-edit-view.tsx
View file

@ -209,7 +209,7 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
<button <button
type="button" type="button"
onClick={onBack} onClick={onBack}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground mb-6 w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground mb-6 w-fit"
> >
<ArrowLeft className="size-4" /> <ArrowLeft className="size-4" />
Back to connectors Back to connectors
@ -239,7 +239,7 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
size="sm" size="sm"
onClick={handleQuickIndex} onClick={handleQuickIndex}
disabled={isQuickIndexing || isIndexing || isSaving || isDisconnecting} disabled={isQuickIndexing || isIndexing || isSaving || isDisconnecting}
className="text-xs sm:text-sm bg-slate-400/10 dark:bg-white/10 hover:bg-slate-400/20 dark:hover:bg-white/20 border-slate-400/20 dark:border-white/20 w-full sm:w-auto" className="text-xs sm:text-sm bg-slate-400/10 dark:bg-white/10 hover:bg-accent hover:text-accent-foreground border-slate-400/20 dark:border-white/20 w-full sm:w-auto"
> >
{isQuickIndexing || isIndexing ? ( {isQuickIndexing || isIndexing ? (
<> <>

2
surfsense_web/components/assistant-ui/connector-popup/connector-configs/views/indexing-configuration-view.tsx
View file

@ -131,7 +131,7 @@ export const IndexingConfigurationView: FC<IndexingConfigurationViewProps> = ({
<button <button
type="button" type="button"
onClick={onSkip} onClick={onSkip}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground mb-6 w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground mb-6 w-fit"
> >
<ArrowLeft className="size-4" /> <ArrowLeft className="size-4" />
Back to connectors Back to connectors

10
surfsense_web/components/assistant-ui/connector-popup/tabs/active-connectors-tab.tsx
View file

@ -185,7 +185,7 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
"relative flex items-center gap-4 p-4 rounded-xl transition-all", "relative flex items-center gap-4 p-4 rounded-xl transition-all",
isAnyIndexing isAnyIndexing
? "bg-primary/5 border-0" ? "bg-primary/5 border-0"
: "bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10 border border-border" : "bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground border border-border"
)} )}
> >
<div <div
@ -222,7 +222,7 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
<Button <Button
variant="secondary" variant="secondary"
size="sm" size="sm"
className="h-8 text-[11px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-slate-50 border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground dark:hover:bg-secondary/80 shrink-0" className="h-8 text-[11px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-accent hover:text-accent-foreground border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground shrink-0"
onClick={handleManageClick} onClick={handleManageClick}
> >
Manage Manage
@ -247,7 +247,7 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
"flex items-center gap-4 p-4 rounded-xl transition-all", "flex items-center gap-4 p-4 rounded-xl transition-all",
isIndexing isIndexing
? "bg-primary/5 border-0" ? "bg-primary/5 border-0"
: "bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10 border border-border" : "bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground border border-border"
)} )}
> >
<div <div
@ -280,7 +280,7 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
<Button <Button
variant="secondary" variant="secondary"
size="sm" size="sm"
className="h-8 text-[11px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-slate-50 border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground dark:hover:bg-secondary/80 shrink-0" className="h-8 text-[11px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-accent hover:text-accent-foreground border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground shrink-0"
onClick={onManage ? () => onManage(connector) : undefined} onClick={onManage ? () => onManage(connector) : undefined}
> >
Manage Manage
@ -302,7 +302,7 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
{standaloneDocuments.map((doc) => ( {standaloneDocuments.map((doc) => (
<div <div
key={doc.type} key={doc.type}
className="inline-flex items-center gap-2 px-3 py-1.5 rounded-full border border-border bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10 transition-all" className="inline-flex items-center gap-2 px-3 py-1.5 rounded-full border border-border bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground transition-all"
> >
<div className="flex items-center justify-center"> <div className="flex items-center justify-center">
{getConnectorIcon(doc.type, "size-3.5")} {getConnectorIcon(doc.type, "size-3.5")}

8
surfsense_web/components/assistant-ui/connector-popup/views/connector-accounts-list-view.tsx
View file

@ -113,7 +113,7 @@ export const ConnectorAccountsListView: FC<ConnectorAccountsListViewProps> = ({
<button <button
type="button" type="button"
onClick={onBack} onClick={onBack}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground mb-6 w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground mb-6 w-fit"
> >
<ArrowLeft className="size-4" /> <ArrowLeft className="size-4" />
Back to connectors Back to connectors
@ -143,7 +143,7 @@ export const ConnectorAccountsListView: FC<ConnectorAccountsListViewProps> = ({
"flex items-center justify-center gap-1.5 h-8 px-3 rounded-md border-2 border-dashed text-xs sm:text-sm transition-all duration-200 shrink-0 w-full sm:w-auto", "flex items-center justify-center gap-1.5 h-8 px-3 rounded-md border-2 border-dashed text-xs sm:text-sm transition-all duration-200 shrink-0 w-full sm:w-auto",
!isEnabled !isEnabled
? "border-border/30 opacity-50 cursor-not-allowed" ? "border-border/30 opacity-50 cursor-not-allowed"
: "border-slate-400/20 dark:border-white/20 hover:bg-primary/5", : "border-slate-400/20 dark:border-white/20 hover:bg-accent hover:text-accent-foreground",
isConnecting && "opacity-50 cursor-not-allowed" isConnecting && "opacity-50 cursor-not-allowed"
)} )}
> >
@ -198,7 +198,7 @@ export const ConnectorAccountsListView: FC<ConnectorAccountsListViewProps> = ({
"flex items-center gap-4 p-4 rounded-xl transition-all", "flex items-center gap-4 p-4 rounded-xl transition-all",
isIndexing isIndexing
? "bg-primary/5 border-0" ? "bg-primary/5 border-0"
: "bg-slate-400/5 dark:bg-white/5 hover:bg-slate-400/10 dark:hover:bg-white/10 border border-border" : "bg-slate-400/5 dark:bg-white/5 hover:bg-accent hover:text-accent-foreground border border-border"
)} )}
> >
<div <div
@ -289,7 +289,7 @@ export const ConnectorAccountsListView: FC<ConnectorAccountsListViewProps> = ({
<Button <Button
variant="secondary" variant="secondary"
size="sm" size="sm"
className="h-8 text-[11px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-slate-50 border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground dark:hover:bg-secondary/80 shrink-0" className="h-8 text-[11px] px-3 rounded-lg font-medium bg-white text-slate-700 hover:bg-accent hover:text-accent-foreground border-0 shadow-xs dark:bg-secondary dark:text-secondary-foreground shrink-0"
onClick={() => onManage(connector)} onClick={() => onManage(connector)}
> >
Manage Manage

4
surfsense_web/components/assistant-ui/connector-popup/views/youtube-crawler-view.tsx
View file

@ -219,7 +219,7 @@ export const YouTubeCrawlerView: FC<YouTubeCrawlerViewProps> = ({ searchSpaceId,
<button <button
type="button" type="button"
onClick={onBack} onClick={onBack}
className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-foreground mb-6 w-fit" className="flex items-center gap-2 text-xs sm:text-sm text-muted-foreground hover:text-accent-foreground mb-6 w-fit"
> >
<ArrowLeft className="size-4" /> <ArrowLeft className="size-4" />
Back to connectors Back to connectors
@ -259,7 +259,7 @@ export const YouTubeCrawlerView: FC<YouTubeCrawlerViewProps> = ({ searchSpaceId,
tag: { tag: {
body: "h-7 relative bg-background border border-input hover:bg-background rounded-md font-medium text-xs ps-2 pe-7 flex", body: "h-7 relative bg-background border border-input hover:bg-background rounded-md font-medium text-xs ps-2 pe-7 flex",
closeButton: closeButton:
"absolute -inset-y-px -end-px p-0 rounded-e-lg flex size-7 transition-colors outline-0 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 text-muted-foreground/80 hover:text-foreground", "absolute -inset-y-px -end-px p-0 rounded-e-lg flex size-7 transition-colors outline-0 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 text-muted-foreground/80 hover:text-accent-foreground",
}, },
}} }}
activeTagIndex={activeTagIndex} activeTagIndex={activeTagIndex}

2
surfsense_web/components/assistant-ui/document-upload-popup.tsx
View file

@ -133,7 +133,7 @@ const DocumentUploadPopupContent: FC<{
onPointerDownOutside={(e) => e.preventDefault()} onPointerDownOutside={(e) => e.preventDefault()}
onInteractOutside={(e) => e.preventDefault()} onInteractOutside={(e) => e.preventDefault()}
onEscapeKeyDown={(e) => e.preventDefault()} onEscapeKeyDown={(e) => e.preventDefault()}
className="select-none max-w-2xl w-[95vw] sm:w-[640px] h-[min(440px,75dvh)] sm:h-[min(520px,80vh)] flex flex-col p-0 gap-0 overflow-hidden ring-0 [&>button]:right-3 sm:[&>button]:right-6 [&>button]:top-5 sm:[&>button]:top-8 [&>button]:opacity-80 [&>button]:hover:opacity-100 [&>button]:hover:bg-foreground/10 [&>button]:z-[100] [&>button>svg]:size-4 sm:[&>button>svg]:size-5" className="select-none max-w-2xl w-[95vw] sm:w-[640px] h-[min(440px,75dvh)] sm:h-[min(520px,80vh)] flex flex-col p-0 gap-0 overflow-hidden ring-0 [&>button]:right-3 sm:[&>button]:right-6 [&>button]:top-5 sm:[&>button]:top-8 [&>button]:opacity-80 [&>button]:hover:opacity-100 [&>button]:hover:bg-accent [&>button]:hover:text-accent-foreground [&>button]:z-[100] [&>button>svg]:size-4 sm:[&>button>svg]:size-5"
> >
<div className="flex-1 min-h-0 overflow-y-auto overscroll-contain"> <div className="flex-1 min-h-0 overflow-y-auto overscroll-contain">
<DialogHeader className="sticky top-0 z-20 bg-popover px-4 sm:px-6 pt-6 sm:pt-8 pb-10"> <DialogHeader className="sticky top-0 z-20 bg-popover px-4 sm:px-6 pt-6 sm:pt-8 pb-10">

2
surfsense_web/components/assistant-ui/inline-citation.tsx
View file

@ -79,7 +79,7 @@ const NumericChunkCitation: FC<{ chunkId: number }> = ({ chunkId }) => {
<button <button
type="button" type="button"
onClick={() => openCitationPanel({ chunkId })} onClick={() => openCitationPanel({ chunkId })}
className="ml-0.5 inline-flex h-5 min-w-5 cursor-pointer items-center justify-center rounded-md bg-muted/60 px-1.5 text-[11px] font-medium text-muted-foreground align-baseline shadow-sm transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none" className="ml-0.5 inline-flex h-5 min-w-5 cursor-pointer items-center justify-center rounded-md bg-muted/60 px-1.5 text-[11px] font-medium text-muted-foreground align-baseline shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none"
title={`View source chunk #${chunkId}`} title={`View source chunk #${chunkId}`}
aria-label={`View cited chunk ${chunkId}`} aria-label={`View cited chunk ${chunkId}`}
> >

2
surfsense_web/components/assistant-ui/reasoning-message-part.tsx
View file

@ -50,7 +50,7 @@ export const ReasoningMessagePart: ReasoningMessagePartComponent = ({ text, stat
onClick={() => setIsOpen((prev) => !prev)} onClick={() => setIsOpen((prev) => !prev)}
className={cn( className={cn(
"flex w-full items-center gap-1.5 text-left text-sm transition-colors", "flex w-full items-center gap-1.5 text-left text-sm transition-colors",
"text-muted-foreground hover:text-foreground" "text-muted-foreground hover:text-accent-foreground"
)} )}
> >
{isRunning ? ( {isRunning ? (

2
surfsense_web/components/assistant-ui/revert-turn-button.tsx
View file

@ -129,7 +129,7 @@ export function RevertTurnButton({ chatTurnId }: RevertTurnButtonProps) {
<Button <Button
size="sm" size="sm"
variant="ghost" variant="ghost"
className="text-muted-foreground hover:text-foreground gap-1.5" className="text-muted-foreground hover:text-accent-foreground gap-1.5"
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
setConfirmOpen(true); setConfirmOpen(true);

6
surfsense_web/components/assistant-ui/thread-list.tsx
View file

@ -150,7 +150,7 @@ export function ThreadList({ searchSpaceId, currentThreadId, className }: Thread
"flex-1 px-3 py-2 text-center text-xs font-medium transition-colors", "flex-1 px-3 py-2 text-center text-xs font-medium transition-colors",
!showArchived !showArchived
? "border-b-2 border-primary text-primary" ? "border-b-2 border-primary text-primary"
: "text-muted-foreground hover:text-foreground" : "text-muted-foreground hover:text-accent-foreground"
)} )}
> >
Active ({state.threads.length}) Active ({state.threads.length})
@ -162,7 +162,7 @@ export function ThreadList({ searchSpaceId, currentThreadId, className }: Thread
"flex-1 px-3 py-2 text-center text-xs font-medium transition-colors", "flex-1 px-3 py-2 text-center text-xs font-medium transition-colors",
showArchived showArchived
? "border-b-2 border-primary text-primary" ? "border-b-2 border-primary text-primary"
: "text-muted-foreground hover:text-foreground" : "text-muted-foreground hover:text-accent-foreground"
)} )}
> >
Archived ({state.archivedThreads.length}) Archived ({state.archivedThreads.length})
@ -234,7 +234,7 @@ const ThreadListItemComponent = memo(function ThreadListItemComponent({
type="button" type="button"
className={cn( className={cn(
"group flex w-full items-center gap-2 rounded-lg px-3 py-2 transition-colors cursor-pointer text-left", "group flex w-full items-center gap-2 rounded-lg px-3 py-2 transition-colors cursor-pointer text-left",
isActive ? "bg-accent text-accent-foreground" : "hover:bg-muted/50" isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
)} )}
onClick={onClick} onClick={onClick}
> >

26
surfsense_web/components/assistant-ui/thread.tsx
View file

@ -163,7 +163,7 @@ const PremiumQuotaPinnedAlert: FC = () => {
</div> </div>
<button <button
type="button" type="button"
className="inline-flex size-6 items-center justify-center text-muted-foreground transition-colors hover:text-foreground" className="inline-flex size-6 items-center justify-center text-muted-foreground transition-colors hover:text-accent-foreground"
aria-label="Dismiss premium quota alert" aria-label="Dismiss premium quota alert"
onClick={() => clearPremiumAlertForThread(currentThreadId)} onClick={() => clearPremiumAlertForThread(currentThreadId)}
> >
@ -304,10 +304,10 @@ const ConnectToolsBanner: FC<{ isThreadEmpty: boolean }> = ({ isThreadEmpty }) =
<button <button
type="button" type="button"
onClick={handleDismiss} onClick={handleDismiss}
className="shrink-0 ml-0.5 p-1.5 -mr-1 text-muted-foreground/40 hover:text-foreground transition-colors cursor-pointer" className="shrink-0 ml-0.5 p-1.5 -mr-1 text-muted-foreground/40 hover:text-accent-foreground transition-colors cursor-pointer"
aria-label="Dismiss" aria-label="Dismiss"
> >
<X className="size-3.5 text-muted-foreground" /> <X className="size-3.5" />
</button> </button>
</div> </div>
</div> </div>
@ -329,7 +329,7 @@ const PendingScreenImageStrip: FC = () => {
<button <button
type="button" type="button"
onClick={() => setUrls((prev) => prev.filter((_, i) => i !== index))} onClick={() => setUrls((prev) => prev.filter((_, i) => i !== index))}
className="absolute right-0.5 top-0.5 flex size-5 items-center justify-center rounded-full bg-background/90 text-muted-foreground shadow-sm transition-opacity hover:text-foreground sm:opacity-0 sm:group-hover:opacity-100" className="absolute right-0.5 top-0.5 flex size-5 items-center justify-center rounded-full bg-background/90 text-muted-foreground shadow-sm transition-opacity hover:text-accent-foreground sm:opacity-0 sm:group-hover:opacity-100"
aria-label="Remove screenshot" aria-label="Remove screenshot"
> >
<X className="size-3" /> <X className="size-3" />
@ -355,7 +355,7 @@ const ClipboardChip: FC<{ text: string; onDismiss: () => void }> = ({ text, onDi
<button <button
type="button" type="button"
onClick={() => setExpanded((v) => !v)} onClick={() => setExpanded((v) => !v)}
className="flex items-center text-muted-foreground hover:text-foreground transition-colors" className="flex items-center text-muted-foreground hover:text-accent-foreground transition-colors"
> >
{expanded ? <ChevronUp className="size-3.5" /> : <ChevronDown className="size-3.5" />} {expanded ? <ChevronUp className="size-3.5" /> : <ChevronDown className="size-3.5" />}
</button> </button>
@ -363,7 +363,7 @@ const ClipboardChip: FC<{ text: string; onDismiss: () => void }> = ({ text, onDi
<button <button
type="button" type="button"
onClick={onDismiss} onClick={onDismiss}
className="flex items-center text-muted-foreground hover:text-foreground transition-colors" className="flex items-center text-muted-foreground hover:text-accent-foreground transition-colors"
> >
<X className="size-3.5" /> <X className="size-3.5" />
</button> </button>
@ -890,7 +890,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="size-[34px] rounded-full p-1 font-semibold text-xs hover:bg-muted-foreground/15 dark:border-muted-foreground/15 dark:hover:bg-muted-foreground/30" className="size-[34px] rounded-full p-1 font-semibold text-xs dark:border-muted-foreground/15 hover:bg-accent hover:text-accent-foreground"
aria-label="More actions" aria-label="More actions"
data-joyride="connector-icon" data-joyride="connector-icon"
> >
@ -941,7 +941,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
return ( return (
<div <div
key={tool.name} key={tool.name}
className="flex w-full items-center gap-3 px-4 py-2 hover:bg-muted-foreground/10 transition-colors" className="flex w-full items-center gap-3 px-4 py-2 hover:bg-accent hover:text-accent-foreground transition-colors"
> >
<ToolIcon className="size-4 shrink-0 text-muted-foreground" /> <ToolIcon className="size-4 shrink-0 text-muted-foreground" />
<span className="flex-1 min-w-0 text-sm font-medium truncate"> <span className="flex-1 min-w-0 text-sm font-medium truncate">
@ -972,7 +972,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
return ( return (
<div <div
key={group.label} key={group.label}
className="flex w-full items-center gap-3 px-4 py-2 hover:bg-muted-foreground/10 transition-colors" className="flex w-full items-center gap-3 px-4 py-2 hover:bg-accent hover:text-accent-foreground transition-colors"
> >
{iconInfo ? ( {iconInfo ? (
<Image <Image
@ -1032,7 +1032,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
disableTooltip={toolsPopoverOpen} disableTooltip={toolsPopoverOpen}
variant="ghost" variant="ghost"
size="icon" size="icon"
className="size-[34px] rounded-full p-1 font-semibold text-xs hover:bg-muted-foreground/15 dark:border-muted-foreground/15 dark:hover:bg-muted-foreground/30" className="size-[34px] rounded-full p-1 font-semibold text-xs dark:border-muted-foreground/15 hover:bg-accent hover:text-accent-foreground"
aria-label="Manage tools" aria-label="Manage tools"
data-joyride="connector-icon" data-joyride="connector-icon"
> >
@ -1066,7 +1066,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
const isDisabled = disabledToolsSet.has(tool.name); const isDisabled = disabledToolsSet.has(tool.name);
const ToolIcon = getToolIcon(tool.name); const ToolIcon = getToolIcon(tool.name);
const row = ( const row = (
<div className="flex w-full items-center gap-1.5 sm:gap-2 px-2 sm:px-2.5 py-0.5 sm:py-1 hover:bg-muted-foreground/10 transition-colors"> <div className="flex w-full items-center gap-1.5 sm:gap-2 px-2 sm:px-2.5 py-0.5 sm:py-1 hover:bg-accent hover:text-accent-foreground transition-colors">
<ToolIcon className="size-3 sm:size-3.5 shrink-0 text-muted-foreground" /> <ToolIcon className="size-3 sm:size-3.5 shrink-0 text-muted-foreground" />
<span className="flex-1 min-w-0 text-[11px] sm:text-xs font-medium truncate"> <span className="flex-1 min-w-0 text-[11px] sm:text-xs font-medium truncate">
{formatToolName(tool.name)} {formatToolName(tool.name)}
@ -1103,7 +1103,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
const allDisabled = toolNames.every((n) => disabledToolsSet.has(n)); const allDisabled = toolNames.every((n) => disabledToolsSet.has(n));
const groupDef = TOOL_GROUPS.find((g) => g.label === group.label); const groupDef = TOOL_GROUPS.find((g) => g.label === group.label);
const row = ( const row = (
<div className="flex w-full items-center gap-1.5 sm:gap-2 px-2 sm:px-2.5 py-0.5 sm:py-1 hover:bg-muted-foreground/10 transition-colors"> <div className="flex w-full items-center gap-1.5 sm:gap-2 px-2 sm:px-2.5 py-0.5 sm:py-1 hover:bg-accent hover:text-accent-foreground transition-colors">
{iconInfo ? ( {iconInfo ? (
<Image <Image
src={iconInfo.src} src={iconInfo.src}
@ -1182,7 +1182,7 @@ const ComposerAction: FC<ComposerActionProps> = ({ isBlockedByOtherUser = false
"rounded-full transition-[background-color,border-color,color] flex items-center gap-1 px-2 py-1 border h-8 select-none", "rounded-full transition-[background-color,border-color,color] flex items-center gap-1 px-2 py-1 border h-8 select-none",
isWebSearchEnabled isWebSearchEnabled
? "bg-sky-500/15 border-sky-500/60 text-sky-500" ? "bg-sky-500/15 border-sky-500/60 text-sky-500"
: "bg-transparent border-transparent text-muted-foreground hover:text-foreground" : "bg-transparent border-transparent text-muted-foreground hover:text-accent-foreground"
)} )}
> >
<motion.div <motion.div

2
surfsense_web/components/chat-comments/comment-item/comment-item.tsx
View file

@ -213,7 +213,7 @@ export function CommentItem({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className="mt-1 h-7 w-fit px-2 text-xs text-muted-foreground hover:text-foreground" className="mt-1 h-7 w-fit px-2 text-xs text-muted-foreground hover:text-accent-foreground"
onClick={() => onReply(comment.id)} onClick={() => onReply(comment.id)}
> >
<MessageCircleReply className="mr-1 size-3" /> <MessageCircleReply className="mr-1 size-3" />

2
surfsense_web/components/chat-comments/comment-thread/comment-thread.tsx
View file

@ -92,7 +92,7 @@ export function CommentThread({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className="h-6 px-2 text-xs text-muted-foreground hover:text-foreground" className="h-6 px-2 text-xs text-muted-foreground hover:text-accent-foreground"
onClick={() => setIsRepliesExpanded((prev) => !prev)} onClick={() => setIsRepliesExpanded((prev) => !prev)}
> >
{isRepliesExpanded ? ( {isRepliesExpanded ? (

2
surfsense_web/components/chat-comments/member-mention-picker/member-mention-item.tsx
View file

@ -29,7 +29,7 @@ export function MemberMentionItem({
type="button" type="button"
className={cn( className={cn(
"flex w-full items-center gap-3 px-3 py-2 text-left transition-colors", "flex w-full items-center gap-3 px-3 py-2 text-left transition-colors",
isHighlighted ? "bg-primary/15 text-accent-foreground" : "hover:bg-accent/50" isHighlighted ? "bg-primary/15 text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
)} )}
onClick={() => onSelect(member)} onClick={() => onSelect(member)}
onMouseEnter={onMouseEnter} onMouseEnter={onMouseEnter}

4
surfsense_web/components/citation-panel/citation-panel.tsx
View file

@ -103,9 +103,9 @@ export const CitationPanelContent: FC<CitationPanelContentProps> = ({ chunkId, o
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={onClose} onClick={onClose}
className="h-8 w-8 rounded-full shrink-0" className="h-8 w-8 rounded-full shrink-0 text-muted-foreground hover:text-accent-foreground"
> >
<XIcon className="h-4 w-4 text-muted-foreground" /> <XIcon className="h-4 w-4" />
<span className="sr-only">Close citation panel</span> <span className="sr-only">Close citation panel</span>
</Button> </Button>
)} )}

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

@ -144,7 +144,7 @@ export const DocumentNode = React.memo(function DocumentNode({
tabIndex={0} tabIndex={0}
ref={attachRef} ref={attachRef}
className={cn( 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", isMentioned && "bg-accent/30",
isDragging && "opacity-40" isDragging && "opacity-40"
)} )}

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

@ -84,7 +84,7 @@ export function DocumentsFilters({
<TooltipTrigger asChild> <TooltipTrigger asChild>
<ToggleGroupItem <ToggleGroupItem
value="folder" 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) => { onClick={(e) => {
e.preventDefault(); e.preventDefault();
onCreateFolder(); onCreateFolder();
@ -109,7 +109,7 @@ export function DocumentsFilters({
"disabled:pointer-events-none disabled:opacity-50", "disabled:pointer-events-none disabled:opacity-50",
aiSortEnabled aiSortEnabled
? "bg-accent text-accent-foreground hover:bg-accent" ? "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) => { onClick={(e) => {
e.preventDefault(); e.preventDefault();
@ -143,7 +143,7 @@ export function DocumentsFilters({
<PopoverTrigger asChild> <PopoverTrigger asChild>
<ToggleGroupItem <ToggleGroupItem
value="filter" 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} /> <ListFilter size={13} />
{activeTypes.length > 0 && ( {activeTypes.length > 0 && (
@ -189,7 +189,7 @@ export function DocumentsFilters({
aria-selected={activeTypes.includes(value)} aria-selected={activeTypes.includes(value)}
tabIndex={0} tabIndex={0}
key={value} 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))} onClick={() => onToggleType(value, !activeTypes.includes(value))}
onKeyDown={(e) => { onKeyDown={(e) => {
if (e.key === "Enter" || e.key === " ") { if (e.key === "Enter" || e.key === " ") {
@ -261,7 +261,7 @@ export function DocumentsFilters({
onClick={handleUpload} onClick={handleUpload}
variant="outline" variant="outline"
size="sm" 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} /> <Upload size={13} />
<span>Upload</span> <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" role="button"
tabIndex={0} tabIndex={0}
className={cn( 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", isExpanded && "font-medium",
isDragging && "opacity-40", isDragging && "opacity-40",
isOver && canDrop && dropZone === "middle" && "bg-accent ring-1 ring-primary/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( className={cn(
"flex w-full items-center gap-1.5 rounded-md px-2 py-1.5 text-sm transition-colors", "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 && "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" isDisabled && "cursor-not-allowed opacity-40"
)} )}
style={{ paddingLeft: `${depth * 16 + 8}px` }} style={{ paddingLeft: `${depth * 16 + 8}px` }}
@ -148,7 +148,7 @@ export function FolderPickerDialog({
className={cn( className={cn(
"flex w-full items-center gap-1.5 rounded-md px-2 py-1.5 text-sm transition-colors", "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 && "bg-accent text-accent-foreground",
selectedId !== null && "hover:bg-accent/50" selectedId !== null && "hover:bg-accent hover:text-accent-foreground"
)} )}
onClick={() => setSelectedId(null)} 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", "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 selectedVersion === v.version_number
? "bg-accent text-accent-foreground" ? "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"> <div className="flex-1 min-w-0 space-y-0.5">

4
surfsense_web/components/editor-panel/editor-panel.tsx
View file

@ -456,9 +456,9 @@ export function EditorPanelContent({
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={onClose} onClick={onClose}
className="h-8 w-8 rounded-full shrink-0" className="h-8 w-8 rounded-full shrink-0 text-muted-foreground hover:text-accent-foreground"
> >
<XIcon className="h-4 w-4 text-muted-foreground" /> <XIcon className="h-4 w-4" />
<span className="sr-only">Close editor panel</span> <span className="sr-only">Close editor panel</span>
</Button> </Button>
</div> </div>

2
surfsense_web/components/inference-params-editor.tsx
View file

@ -128,7 +128,7 @@ export default function InferenceParamsEditor({ params, setParams }: InferencePa
</thead> </thead>
<tbody className="divide-y divide-gray-200 bg-black dark:bg-black"> <tbody className="divide-y divide-gray-200 bg-black dark:bg-black">
{Object.entries(params).map(([key, val]) => ( {Object.entries(params).map(([key, val]) => (
<tr key={key} className="hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"> <tr key={key} className="hover:bg-accent hover:text-accent-foreground transition-colors">
<td className="px-4 py-3 font-medium text-gray-900 dark:text-white">{key}</td> <td className="px-4 py-3 font-medium text-gray-900 dark:text-white">{key}</td>
<td className="px-4 py-3 text-gray-700 dark:text-gray-300">{val.toString()}</td> <td className="px-4 py-3 text-gray-700 dark:text-gray-300">{val.toString()}</td>
<td className="px-4 py-3"> <td className="px-4 py-3">

4
surfsense_web/components/layout/ui/right-panel/RightPanel.tsx
View file

@ -69,7 +69,7 @@ function CollapseButton({ onClick }: { onClick: () => void }) {
if (isKeyboardClick(event)) return; if (isKeyboardClick(event)) return;
onClick(); onClick();
}} }}
className="h-8 w-8 shrink-0 text-muted-foreground hover:text-muted-foreground hover:bg-accent" className="h-8 w-8 shrink-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground"
> >
<PanelRight className="h-4 w-4" /> <PanelRight className="h-4 w-4" />
<span className="sr-only">Collapse panel</span> <span className="sr-only">Collapse panel</span>
@ -114,7 +114,7 @@ export function RightPanelExpandButton() {
if (isKeyboardClick(event)) return; if (isKeyboardClick(event)) return;
startTransition(() => setCollapsed(false)); startTransition(() => setCollapsed(false));
}} }}
className="h-8 w-8 shrink-0 -m-0.5 text-muted-foreground hover:text-muted-foreground hover:bg-accent" className="h-8 w-8 shrink-0 -m-0.5 text-muted-foreground hover:bg-accent hover:text-accent-foreground"
> >
<PanelRight className="h-4 w-4" /> <PanelRight className="h-4 w-4" />
<span className="sr-only">Expand panel</span> <span className="sr-only">Expand panel</span>

4
surfsense_web/components/layout/ui/sidebar/AllPrivateChatsSidebar.tsx
View file

@ -258,10 +258,10 @@ export function AllPrivateChatsSidebarContent({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => onOpenChange(false)} onClick={() => onOpenChange(false)}
> >
<ChevronLeft className="h-4 w-4 text-muted-foreground" /> <ChevronLeft className="h-4 w-4" />
<span className="sr-only">{t("close") || "Close"}</span> <span className="sr-only">{t("close") || "Close"}</span>
</Button> </Button>
)} )}

4
surfsense_web/components/layout/ui/sidebar/AllSharedChatsSidebar.tsx
View file

@ -257,10 +257,10 @@ export function AllSharedChatsSidebarContent({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => onOpenChange(false)} onClick={() => onOpenChange(false)}
> >
<ChevronLeft className="h-4 w-4 text-muted-foreground" /> <ChevronLeft className="h-4 w-4" />
<span className="sr-only">{t("close") || "Close"}</span> <span className="sr-only">{t("close") || "Close"}</span>
</Button> </Button>
)} )}

12
surfsense_web/components/layout/ui/sidebar/DesktopLocalTabContent.tsx
View file

@ -65,13 +65,13 @@ export function DesktopLocalTabContent({
return ( return (
<div className="flex min-h-0 flex-1 flex-col select-none"> <div className="flex min-h-0 flex-1 flex-col select-none">
<div className="mx-4 mt-4 mb-3"> <div className="mx-4 mt-4 mb-3">
<div className="flex h-7 w-full items-stretch rounded-lg border-0 bg-muted text-[11px] text-muted-foreground hover:bg-muted/80"> <div className="flex h-7 w-full items-stretch rounded-lg border-0 bg-muted text-[11px] text-muted-foreground hover:bg-accent hover:text-accent-foreground">
{localRootPaths.length > 0 ? ( {localRootPaths.length > 0 ? (
<DropdownMenu> <DropdownMenu>
<DropdownMenuTrigger asChild> <DropdownMenuTrigger asChild>
<button <button
type="button" type="button"
className="min-w-0 flex-1 flex items-center gap-1 rounded-l-lg px-2 text-left transition-colors hover:bg-muted/80 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0" className="min-w-0 flex-1 flex items-center gap-1 rounded-l-lg px-2 text-left transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0"
title={localRootPaths.join("\n")} title={localRootPaths.join("\n")}
aria-label="Manage selected folders" aria-label="Manage selected folders"
> >
@ -100,7 +100,7 @@ export function DesktopLocalTabContent({
</span> </span>
<button <button
type="button" type="button"
className="inline-flex size-5 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground" className="inline-flex size-5 items-center justify-center rounded text-muted-foreground transition-colors hover:text-accent-foreground"
onClick={(event) => { onClick={(event) => {
event.stopPropagation(); event.stopPropagation();
void onRemoveFilesystemRoot(rootPath); void onRemoveFilesystemRoot(rootPath);
@ -142,7 +142,7 @@ export function DesktopLocalTabContent({
<span className="inline-flex"> <span className="inline-flex">
<button <button
type="button" type="button"
className="flex w-8 items-center justify-center rounded-r-lg text-muted-foreground transition-colors hover:bg-muted/80 hover:text-foreground focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 disabled:opacity-50" className="flex w-8 items-center justify-center rounded-r-lg text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 disabled:opacity-50"
onClick={() => { onClick={() => {
void onPickFilesystemRoot(); void onPickFilesystemRoot();
}} }}
@ -169,7 +169,7 @@ export function DesktopLocalTabContent({
</div> </div>
<Input <Input
ref={localSearchInputRef} ref={localSearchInputRef}
className="peer h-8 w-full pl-8 pr-8 text-sm bg-sidebar border-border/60 select-none focus:select-text" className="peer h-8 w-full border-0 bg-muted pl-8 pr-8 text-sm shadow-none select-none focus:select-text"
value={localSearch} value={localSearch}
onChange={(e) => setLocalSearch(e.target.value)} onChange={(e) => setLocalSearch(e.target.value)}
placeholder="Search local files" placeholder="Search local files"
@ -179,7 +179,7 @@ export function DesktopLocalTabContent({
{Boolean(localSearch) && ( {Boolean(localSearch) && (
<button <button
type="button" type="button"
className="absolute inset-y-0 right-0 flex h-full w-8 items-center justify-center rounded-r-md text-muted-foreground hover:text-foreground transition-colors" className="absolute inset-y-0 right-0 flex h-full w-8 items-center justify-center rounded-r-md text-muted-foreground hover:text-accent-foreground transition-colors"
aria-label="Clear local search" aria-label="Clear local search"
onClick={() => { onClick={() => {
setLocalSearch(""); setLocalSearch("");

26
surfsense_web/components/layout/ui/sidebar/DocumentsSidebar.tsx
View file

@ -1043,7 +1043,7 @@ function AuthenticatedDocumentsSidebarBase({
const cloudContent = ( const cloudContent = (
<> <>
{/* Connected tools strip */} {/* Connected tools strip */}
<div className="shrink-0 mx-4 mt-6 mb-2.5 flex select-none items-center gap-2 rounded-lg border-0 bg-muted transition-colors hover:bg-muted/80"> <div className="shrink-0 mx-4 mt-6 mb-2.5 flex select-none items-center gap-2 rounded-lg border-0 bg-muted transition-colors hover:bg-accent hover:text-accent-foreground">
<button <button
type="button" type="button"
onClick={() => setConnectorDialogOpen(true)} onClick={() => setConnectorDialogOpen(true)}
@ -1114,7 +1114,7 @@ function AuthenticatedDocumentsSidebarBase({
<button <button
type="button" type="button"
onClick={handleWatchLocalFolder} onClick={handleWatchLocalFolder}
className="shrink-0 mx-4 mb-2.5 flex select-none items-center gap-2 rounded-lg border-0 bg-muted px-3 py-1.5 transition-colors hover:bg-muted/80" className="shrink-0 mx-4 mb-2.5 flex select-none items-center gap-2 rounded-lg border-0 bg-muted px-3 py-1.5 transition-colors hover:bg-accent hover:text-accent-foreground"
> >
<FolderClock className="size-4 shrink-0 text-muted-foreground" /> <FolderClock className="size-4 shrink-0 text-muted-foreground" />
<span className="truncate text-xs text-muted-foreground">Watch local folder</span> <span className="truncate text-xs text-muted-foreground">Watch local folder</span>
@ -1229,10 +1229,10 @@ function AuthenticatedDocumentsSidebarBase({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => onOpenChange(false)} onClick={() => onOpenChange(false)}
> >
<ChevronLeft className="h-4 w-4 text-muted-foreground" /> <ChevronLeft className="h-4 w-4" />
<span className="sr-only">{tSidebar("close") || "Close"}</span> <span className="sr-only">{tSidebar("close") || "Close"}</span>
</Button> </Button>
)} )}
@ -1272,7 +1272,7 @@ function AuthenticatedDocumentsSidebarBase({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => { onClick={() => {
if (isDocked) { if (isDocked) {
onDockedChange(false); onDockedChange(false);
@ -1283,9 +1283,9 @@ function AuthenticatedDocumentsSidebarBase({
}} }}
> >
{isDocked ? ( {isDocked ? (
<ChevronLeft className="h-4 w-4 text-muted-foreground" /> <ChevronLeft className="h-4 w-4" />
) : ( ) : (
<ChevronRight className="h-4 w-4 text-muted-foreground" /> <ChevronRight className="h-4 w-4" />
)} )}
<span className="sr-only">{isDocked ? "Collapse panel" : "Expand panel"}</span> <span className="sr-only">{isDocked ? "Collapse panel" : "Expand panel"}</span>
</Button> </Button>
@ -1720,10 +1720,10 @@ function AnonymousDocumentsSidebar({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => onOpenChange(false)} onClick={() => onOpenChange(false)}
> >
<X className="h-4 w-4 text-muted-foreground" /> <X className="h-4 w-4" />
<span className="sr-only">{tSidebar("close") || "Close"}</span> <span className="sr-only">{tSidebar("close") || "Close"}</span>
</Button> </Button>
)} )}
@ -1733,7 +1733,7 @@ function AnonymousDocumentsSidebar({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => { onClick={() => {
if (isDocked) { if (isDocked) {
onDockedChange(false); onDockedChange(false);
@ -1744,9 +1744,9 @@ function AnonymousDocumentsSidebar({
}} }}
> >
{isDocked ? ( {isDocked ? (
<ChevronLeft className="h-4 w-4 text-muted-foreground" /> <ChevronLeft className="h-4 w-4" />
) : ( ) : (
<ChevronRight className="h-4 w-4 text-muted-foreground" /> <ChevronRight className="h-4 w-4" />
)} )}
<span className="sr-only">{isDocked ? "Collapse panel" : "Expand panel"}</span> <span className="sr-only">{isDocked ? "Collapse panel" : "Expand panel"}</span>
</Button> </Button>
@ -1762,7 +1762,7 @@ function AnonymousDocumentsSidebar({
</div> </div>
{/* Connectors strip (gated) */} {/* Connectors strip (gated) */}
<div className="shrink-0 mx-4 mt-6 mb-2.5 flex select-none items-center gap-2 rounded-lg border bg-muted/50 transition-colors hover:bg-muted/80"> <div className="shrink-0 mx-4 mt-6 mb-2.5 flex select-none items-center gap-2 rounded-lg border bg-muted/50 transition-colors hover:bg-accent hover:text-accent-foreground">
<button <button
type="button" type="button"
onClick={() => gate("connect your data sources")} onClick={() => gate("connect your data sources")}

4
surfsense_web/components/layout/ui/sidebar/InboxSidebar.tsx
View file

@ -535,10 +535,10 @@ export function InboxSidebarContent({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="h-8 w-8 rounded-full" className="h-8 w-8 rounded-full text-muted-foreground hover:text-accent-foreground"
onClick={() => onOpenChange(false)} onClick={() => onOpenChange(false)}
> >
<ChevronLeft className="h-4 w-4 text-muted-foreground" /> <ChevronLeft className="h-4 w-4" />
<span className="sr-only">{t("close") || "Close"}</span> <span className="sr-only">{t("close") || "Close"}</span>
</Button> </Button>
)} )}

4
surfsense_web/components/layout/ui/sidebar/LocalFilesystemBrowser.tsx
View file

@ -412,7 +412,7 @@ export function LocalFilesystemBrowser({
<button <button
type="button" type="button"
onClick={() => toggleFolder(folder.key)} onClick={() => toggleFolder(folder.key)}
className="flex h-8 w-full items-center gap-1.5 rounded-md px-2 text-left text-sm transition-colors hover:bg-muted/60" className="flex h-8 w-full items-center gap-1.5 rounded-md px-2 text-left text-sm transition-colors hover:bg-accent hover:text-accent-foreground"
style={{ paddingInlineStart: `${depth * 12 + 8}px` }} style={{ paddingInlineStart: `${depth * 12 + 8}px` }}
draggable={false} draggable={false}
> >
@ -440,7 +440,7 @@ export function LocalFilesystemBrowser({
: undefined : undefined
} }
className={`flex h-8 w-full items-center gap-1.5 rounded-md px-2 text-left text-sm transition-colors ${ className={`flex h-8 w-full items-center gap-1.5 rounded-md px-2 text-left text-sm transition-colors ${
isOpenable ? "hover:bg-muted/60" : "cursor-not-allowed opacity-60" isOpenable ? "hover:bg-accent hover:text-accent-foreground" : "cursor-not-allowed opacity-60"
}`} }`}
style={{ paddingInlineStart: `${(depth + 1) * 12 + 22}px` }} style={{ paddingInlineStart: `${(depth + 1) * 12 + 22}px` }}
title={ title={

2
surfsense_web/components/layout/ui/sidebar/SidebarCollapseButton.tsx
View file

@ -26,7 +26,7 @@ export function SidebarCollapseButton({
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={onToggle} onClick={onToggle}
className="h-8 w-8 shrink-0 text-muted-foreground hover:text-muted-foreground hover:bg-accent" className="h-8 w-8 shrink-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground"
> >
<PanelLeft className="h-4 w-4" /> <PanelLeft className="h-4 w-4" />
<span className="sr-only">{isCollapsed ? t("expand_sidebar") : t("collapse_sidebar")}</span> <span className="sr-only">{isCollapsed ? t("expand_sidebar") : t("collapse_sidebar")}</span>

2
surfsense_web/components/layout/ui/sidebar/SidebarSection.tsx
View file

@ -40,7 +40,7 @@ export function SidebarSection({
)} )}
> >
<div className="flex items-center group/section shrink-0 px-2 py-1"> <div className="flex items-center group/section shrink-0 px-2 py-1">
<CollapsibleTrigger className="flex items-center gap-1 text-xs font-medium text-muted-foreground hover:text-foreground transition-colors min-w-0"> <CollapsibleTrigger className="flex items-center gap-1 text-xs font-medium text-muted-foreground hover:text-accent-foreground transition-colors min-w-0">
<span className="truncate">{title}</span> <span className="truncate">{title}</span>
<ChevronRight <ChevronRight
className={cn( className={cn(

8
surfsense_web/components/layout/ui/sidebar/SidebarUserProfile.tsx
View file

@ -270,7 +270,7 @@ export function SidebarUserProfile({
onClick={() => handleThemeChange(themeOption.value)} onClick={() => handleThemeChange(themeOption.value)}
className={cn( className={cn(
"mb-1 last:mb-0 transition-all", "mb-1 last:mb-0 transition-all",
"hover:bg-accent/50", "hover:bg-accent hover:text-accent-foreground",
isSelected && "text-primary" isSelected && "text-primary"
)} )}
> >
@ -300,7 +300,7 @@ export function SidebarUserProfile({
onClick={() => handleLanguageChange(language.code)} onClick={() => handleLanguageChange(language.code)}
className={cn( className={cn(
"mb-1 last:mb-0 transition-all", "mb-1 last:mb-0 transition-all",
"hover:bg-accent/50", "hover:bg-accent hover:text-accent-foreground",
isSelected && "text-primary" isSelected && "text-primary"
)} )}
> >
@ -436,7 +436,7 @@ export function SidebarUserProfile({
onClick={() => handleThemeChange(themeOption.value)} onClick={() => handleThemeChange(themeOption.value)}
className={cn( className={cn(
"mb-1 last:mb-0 transition-all", "mb-1 last:mb-0 transition-all",
"hover:bg-accent/50", "hover:bg-accent hover:text-accent-foreground",
isSelected && "text-primary" isSelected && "text-primary"
)} )}
> >
@ -466,7 +466,7 @@ export function SidebarUserProfile({
onClick={() => handleLanguageChange(language.code)} onClick={() => handleLanguageChange(language.code)}
className={cn( className={cn(
"mb-1 last:mb-0 transition-all", "mb-1 last:mb-0 transition-all",
"hover:bg-accent/50", "hover:bg-accent hover:text-accent-foreground",
isSelected && "text-primary" isSelected && "text-primary"
)} )}
> >

4
surfsense_web/components/new-chat/chat-share-button.tsx
View file

@ -151,7 +151,7 @@ export function ChatShareButton({ thread, onVisibilityChange, className }: ChatS
initialTab: "public-links", initialTab: "public-links",
}) })
} }
className="flex items-center justify-center h-8 w-8 rounded-md bg-muted/50 hover:bg-muted transition-colors" className="flex items-center justify-center h-8 w-8 rounded-md bg-muted/50 hover:bg-accent hover:text-accent-foreground transition-colors"
> >
<Earth className="h-4 w-4 text-muted-foreground" /> <Earth className="h-4 w-4 text-muted-foreground" />
</button> </button>
@ -165,7 +165,7 @@ export function ChatShareButton({ thread, onVisibilityChange, className }: ChatS
<Button <Button
variant="outline" variant="outline"
size="icon" size="icon"
className="h-8 w-8 md:w-auto md:px-3 md:gap-2 relative bg-muted hover:bg-muted/80 border-0 select-none" className="h-8 w-8 md:w-auto md:px-3 md:gap-2 relative bg-muted hover:bg-accent hover:text-accent-foreground border-0 select-none"
> >
<CurrentIcon className="h-4 w-4" /> <CurrentIcon className="h-4 w-4" />
<span className="hidden md:inline text-sm">{buttonLabel}</span> <span className="hidden md:inline text-sm">{buttonLabel}</span>

14
surfsense_web/components/new-chat/model-selector.tsx
View file

@ -857,7 +857,7 @@ export function ModelSelector({
type="button" type="button"
aria-label="Scroll providers up" aria-label="Scroll providers up"
onClick={() => scrollProviderSidebar("backward")} onClick={() => scrollProviderSidebar("backward")}
className="flex h-4 w-4 items-center justify-center rounded-sm text-muted-foreground/90 hover:text-foreground hover:bg-accent/60 transition-colors" className="flex h-4 w-4 items-center justify-center rounded-sm text-muted-foreground/90 hover:text-accent-foreground hover:bg-accent transition-colors"
> >
<ChevronUp className="size-3" /> <ChevronUp className="size-3" />
</button> </button>
@ -923,7 +923,7 @@ export function ModelSelector({
isActive isActive
? "bg-primary/10 text-primary" ? "bg-primary/10 text-primary"
: isConfigured : isConfigured
? "hover:bg-accent/60 text-muted-foreground hover:text-foreground" ? "hover:bg-accent text-muted-foreground hover:text-accent-foreground"
: "opacity-50 hover:opacity-80 hover:bg-accent/40 text-muted-foreground" : "opacity-50 hover:opacity-80 hover:bg-accent/40 text-muted-foreground"
)} )}
> >
@ -958,7 +958,7 @@ export function ModelSelector({
type="button" type="button"
aria-label="Scroll providers down" aria-label="Scroll providers down"
onClick={() => scrollProviderSidebar("forward")} onClick={() => scrollProviderSidebar("forward")}
className="flex h-4 w-4 items-center justify-center rounded-sm text-muted-foreground/90 hover:text-foreground hover:bg-accent/60 transition-colors" className="flex h-4 w-4 items-center justify-center rounded-sm text-muted-foreground/90 hover:text-accent-foreground hover:bg-accent transition-colors"
> >
<ChevronDown className="size-3" /> <ChevronDown className="size-3" />
</button> </button>
@ -1118,7 +1118,7 @@ export function ModelSelector({
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
className="size-7 rounded-md hover:bg-muted opacity-0 group-hover:opacity-100 transition-opacity" className="size-7 rounded-md hover:bg-accent hover:text-accent-foreground opacity-0 group-hover:opacity-100 transition-opacity"
onClick={(e) => handleEditItem(e, item)} onClick={(e) => handleEditItem(e, item)}
> >
<Pencil className="size-3.5 text-muted-foreground" /> <Pencil className="size-3.5 text-muted-foreground" />
@ -1179,7 +1179,7 @@ export function ModelSelector({
"flex items-center justify-center gap-1.5 text-sm font-medium transition-all duration-200 border-b-[1.5px]", "flex items-center justify-center gap-1.5 text-sm font-medium transition-all duration-200 border-b-[1.5px]",
activeTab === value activeTab === value
? "border-foreground dark:border-white text-foreground" ? "border-foreground dark:border-white text-foreground"
: "border-transparent text-muted-foreground hover:text-foreground/70" : "border-transparent text-muted-foreground hover:text-accent-foreground"
)} )}
> >
<Icon className="size-3.5" /> <Icon className="size-3.5" />
@ -1322,7 +1322,7 @@ export function ModelSelector({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className="w-full justify-start gap-2 h-9 rounded-lg hover:bg-accent/50 dark:hover:bg-white/[0.06]" className="w-full justify-start gap-2 h-9 rounded-lg hover:bg-accent hover:text-accent-foreground "
onClick={() => { onClick={() => {
setOpen(false); setOpen(false);
addHandler(selectedProvider !== "all" ? selectedProvider : undefined); addHandler(selectedProvider !== "all" ? selectedProvider : undefined);
@ -1347,7 +1347,7 @@ export function ModelSelector({
role="combobox" role="combobox"
aria-expanded={open} aria-expanded={open}
className={cn( className={cn(
"h-8 gap-2 px-3 text-sm bg-muted hover:bg-muted/80 border-0 select-none", "h-8 gap-2 px-3 text-sm bg-muted hover:bg-accent hover:text-accent-foreground border-0 select-none",
className className
)} )}
> >

2
surfsense_web/components/new-chat/prompt-picker.tsx
View file

@ -184,7 +184,7 @@ export const PromptPicker = forwardRef<PromptPickerRef, PromptPickerProps>(funct
"w-full flex items-center gap-2 px-3 py-2 text-left text-sm transition-colors rounded-md cursor-pointer text-muted-foreground", "w-full flex items-center gap-2 px-3 py-2 text-left text-sm transition-colors rounded-md cursor-pointer text-muted-foreground",
highlightedIndex === createPromptIndex highlightedIndex === createPromptIndex
? "bg-accent text-foreground" ? "bg-accent text-foreground"
: "hover:text-foreground hover:bg-accent/50" : "hover:text-accent-foreground hover:bg-accent"
)} )}
> >
<span className="shrink-0"> <span className="shrink-0">

2
surfsense_web/components/prompt-kit/chain-of-thought.tsx
View file

@ -203,7 +203,7 @@ export const ChainOfThoughtTrigger: React.FC<ChainOfThoughtTriggerProps> = ({
}) => ( }) => (
<CollapsibleTrigger <CollapsibleTrigger
className={cn( className={cn(
"group text-muted-foreground hover:text-foreground flex cursor-pointer items-center justify-start gap-1 text-left text-sm transition-colors", "group text-muted-foreground hover:text-accent-foreground flex cursor-pointer items-center justify-start gap-1 text-left text-sm transition-colors",
className className
)} )}
{...props} {...props}

10
surfsense_web/components/report-panel/report-panel.tsx
View file

@ -318,8 +318,7 @@ export function ReportPanelContent({
}, []); }, []);
const exportButton = !isEditing && ( const exportButton = !isEditing && (
<> isResume ? (
{isResume ? (
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
@ -354,8 +353,7 @@ export function ReportPanelContent({
/> />
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>
)} )
</>
); );
const versionSwitcher = !isEditing && versions.length > 1 && ( const versionSwitcher = !isEditing && versions.length > 1 && (
@ -456,9 +454,9 @@ export function ReportPanelContent({
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={onClose} onClick={onClose}
className="h-8 w-8 rounded-full shrink-0" className="h-8 w-8 rounded-full shrink-0 text-muted-foreground hover:text-accent-foreground"
> >
<XIcon className="h-4 w-4 text-muted-foreground" /> <XIcon className="h-4 w-4" />
<span className="sr-only">Close report panel</span> <span className="sr-only">Close report panel</span>
</Button> </Button>
)} )}

2
surfsense_web/components/search-space-form.tsx
View file

@ -131,7 +131,7 @@ export function SearchSpaceForm({
> >
<MoveLeftIcon <MoveLeftIcon
size={18} size={18}
className="text-muted-foreground group-hover:text-foreground transition-colors duration-200" className="text-muted-foreground group-hover:text-accent-foreground transition-colors duration-200"
/> />
<div className="absolute inset-0 rounded-full bg-gradient-to-r from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-300" /> <div className="absolute inset-0 rounded-full bg-gradient-to-r from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
</Button> </Button>

4
surfsense_web/components/settings/agent-model-manager.tsx
View file

@ -130,7 +130,7 @@ export function AgentModelManager({ searchSpaceId }: AgentModelManagerProps) {
<Button <Button
variant="outline" variant="outline"
onClick={openNewDialog} onClick={openNewDialog}
className="gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
Add Model Add Model
</Button> </Button>
@ -277,7 +277,7 @@ export function AgentModelManager({ searchSpaceId }: AgentModelManagerProps) {
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={() => openEditDialog(config)} onClick={() => openEditDialog(config)}
className="h-7 w-7 rounded-lg text-muted-foreground hover:text-foreground" className="h-7 w-7 rounded-lg text-muted-foreground hover:text-accent-foreground"
> >
<Pencil className="h-3 w-3" /> <Pencil className="h-3 w-3" />
</Button> </Button>

2
surfsense_web/components/settings/general-settings-manager.tsx
View file

@ -176,7 +176,7 @@ export function GeneralSettingsManager({ searchSpaceId }: GeneralSettingsManager
type="submit" type="submit"
variant="outline" variant="outline"
disabled={!hasChanges || saving || !name.trim()} disabled={!hasChanges || saving || !name.trim()}
className="relative gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="relative gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
<span className={saving ? "opacity-0" : ""}>{t("general_save")}</span> <span className={saving ? "opacity-0" : ""}>{t("general_save")}</span>
{saving && <Spinner size="sm" className="absolute" />} {saving && <Spinner size="sm" className="absolute" />}

4
surfsense_web/components/settings/image-model-manager.tsx
View file

@ -133,7 +133,7 @@ export function ImageModelManager({ searchSpaceId }: ImageModelManagerProps) {
<Button <Button
variant="outline" variant="outline"
onClick={openNewDialog} onClick={openNewDialog}
className="gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
Add Image Model Add Image Model
</Button> </Button>
@ -369,7 +369,7 @@ export function ImageModelManager({ searchSpaceId }: ImageModelManagerProps) {
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={() => openEditDialog(config)} onClick={() => openEditDialog(config)}
className="h-7 w-7 rounded-lg text-muted-foreground hover:text-foreground" className="h-7 w-7 rounded-lg text-muted-foreground hover:text-accent-foreground"
> >
<Pencil className="h-3 w-3" /> <Pencil className="h-3 w-3" />
</Button> </Button>

2
surfsense_web/components/settings/more-pages-content.tsx
View file

@ -119,7 +119,7 @@ export function MorePagesContent() {
disabled={task.completed || completeMutation.isPending} disabled={task.completed || completeMutation.isPending}
onClick={() => handleTaskClick(task)} onClick={() => handleTaskClick(task)}
asChild={!task.completed} asChild={!task.completed}
className="text-muted-foreground hover:text-foreground" className="text-muted-foreground hover:text-accent-foreground"
> >
{task.completed ? ( {task.completed ? (
<span>Done</span> <span>Done</span>

2
surfsense_web/components/settings/prompt-config-manager.tsx
View file

@ -183,7 +183,7 @@ export function PromptConfigManager({ searchSpaceId }: PromptConfigManagerProps)
type="submit" type="submit"
variant="outline" variant="outline"
disabled={!hasChanges || saving} disabled={!hasChanges || saving}
className="gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
{saving ? <Spinner size="sm" /> : null} {saving ? <Spinner size="sm" /> : null}
{saving ? "Saving" : "Save Instructions"} {saving ? "Saving" : "Save Instructions"}

10
surfsense_web/components/settings/roles-manager.tsx
View file

@ -415,7 +415,7 @@ function RolesContent({
<Button <Button
variant="outline" variant="outline"
onClick={() => setShowCreateRole(true)} onClick={() => setShowCreateRole(true)}
className="gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
Create Custom Role Create Custom Role
</Button> </Button>
@ -467,7 +467,7 @@ function RolesContent({
role="button" role="button"
tabIndex={0} tabIndex={0}
aria-expanded={isExpanded} aria-expanded={isExpanded}
className="flex items-center gap-4 p-4 transition-colors hover:bg-muted/30 cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" className="flex items-center gap-4 p-4 transition-colors hover:bg-accent hover:text-accent-foreground cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
onClick={() => setExpandedRoleId(isExpanded ? null : role.id)} onClick={() => setExpandedRoleId(isExpanded ? null : role.id)}
onKeyDown={(e) => { onKeyDown={(e) => {
if (e.key === "Enter" || e.key === " ") { if (e.key === "Enter" || e.key === " ") {
@ -697,7 +697,7 @@ function PermissionsEditor({
role="button" role="button"
tabIndex={0} tabIndex={0}
aria-expanded={isExpanded} aria-expanded={isExpanded}
className="flex items-center justify-between px-3 py-2.5 hover:bg-muted/40 transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" className="flex items-center justify-between px-3 py-2.5 hover:bg-accent hover:text-accent-foreground transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
onClick={() => toggleCategoryExpanded(category)} onClick={() => toggleCategoryExpanded(category)}
onKeyDown={(e) => { onKeyDown={(e) => {
if (e.key === "Enter" || e.key === " ") { if (e.key === "Enter" || e.key === " ") {
@ -742,7 +742,7 @@ function PermissionsEditor({
key={perm.value} key={perm.value}
className={cn( className={cn(
"flex items-center justify-between gap-3 px-2.5 py-2 rounded-md transition-colors", "flex items-center justify-between gap-3 px-2.5 py-2 rounded-md transition-colors",
isSelected ? "bg-muted/60 hover:bg-muted/80" : "hover:bg-muted/40" isSelected ? "bg-muted/60 hover:bg-accent hover:text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
)} )}
> >
<button <button
@ -876,7 +876,7 @@ function CreateRoleDialog({
type="button" type="button"
onClick={() => applyPreset(key as keyof typeof ROLE_PRESETS)} onClick={() => applyPreset(key as keyof typeof ROLE_PRESETS)}
className={cn( className={cn(
"p-3 rounded-lg border transition-colors hover:bg-muted/40", "p-3 rounded-lg border transition-colors hover:bg-accent hover:text-accent-foreground",
"flex items-center justify-center text-center sm:block sm:text-left", "flex items-center justify-center text-center sm:block sm:text-left",
selectedPermissions.length > 0 && selectedPermissions.length > 0 &&
preset.permissions.every((p) => selectedPermissions.includes(p)) preset.permissions.every((p) => selectedPermissions.includes(p))

4
surfsense_web/components/settings/settings-dialog.tsx
View file

@ -63,7 +63,7 @@ export function SettingsDialog({
"flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors text-left focus:outline-none focus-visible:outline-none", "flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors text-left focus:outline-none focus-visible:outline-none",
activeItem === item.value activeItem === item.value
? "bg-accent text-accent-foreground" ? "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"
)} )}
> >
{item.icon} {item.icon}
@ -97,7 +97,7 @@ export function SettingsDialog({
"flex items-center gap-2 whitespace-nowrap rounded-full px-3 py-1.5 text-xs font-medium transition-colors shrink-0 focus:outline-none focus-visible:outline-none", "flex items-center gap-2 whitespace-nowrap rounded-full px-3 py-1.5 text-xs font-medium transition-colors shrink-0 focus:outline-none focus-visible:outline-none",
activeItem === item.value activeItem === item.value
? "bg-accent text-accent-foreground" ? "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"
)} )}
> >
{item.icon} {item.icon}

2
surfsense_web/components/settings/team-memory-manager.tsx
View file

@ -228,7 +228,7 @@ export function TeamMemoryManager({ searchSpaceId }: TeamMemoryManagerProps) {
onClick={handleEdit} onClick={handleEdit}
disabled={editing || !editQuery.trim()} disabled={editing || !editQuery.trim()}
className={`h-11 w-11 shrink-0 rounded-full ${ className={`h-11 w-11 shrink-0 rounded-full ${
editing ? "" : "bg-muted-foreground/15 hover:bg-muted-foreground/20" editing ? "" : "bg-muted-foreground/15 hover:bg-accent hover:text-accent-foreground"
}`} }`}
> >
{editing ? ( {editing ? (

4
surfsense_web/components/settings/vision-model-manager.tsx
View file

@ -137,7 +137,7 @@ export function VisionModelManager({ searchSpaceId }: VisionModelManagerProps) {
<Button <Button
variant="outline" variant="outline"
onClick={openNewDialog} onClick={openNewDialog}
className="gap-2 bg-white text-black hover:bg-neutral-100 dark:bg-white dark:text-black dark:hover:bg-neutral-200" className="gap-2 bg-white text-black hover:bg-accent hover:text-accent-foreground dark:bg-white dark:text-black"
> >
Add Vision Model Add Vision Model
</Button> </Button>
@ -367,7 +367,7 @@ export function VisionModelManager({ searchSpaceId }: VisionModelManagerProps) {
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={() => openEditDialog(config)} onClick={() => openEditDialog(config)}
className="h-6 w-6 text-muted-foreground hover:text-foreground" className="h-6 w-6 text-muted-foreground hover:text-accent-foreground"
> >
<Pencil className="h-3 w-3" /> <Pencil className="h-3 w-3" />
</Button> </Button>

6
surfsense_web/components/shared/llm-config-form.tsx
View file

@ -409,7 +409,7 @@ export function LLMConfigForm({
<CollapsibleTrigger asChild> <CollapsibleTrigger asChild>
<button <button
type="button" type="button"
className="flex w-full items-center justify-between py-2 text-xs sm:text-sm font-medium text-muted-foreground hover:text-foreground transition-colors" className="flex w-full items-center justify-between py-2 text-xs sm:text-sm font-medium text-muted-foreground hover:text-accent-foreground transition-colors"
> >
<span>Advanced Parameters</span> <span>Advanced Parameters</span>
<ChevronDown <ChevronDown
@ -447,7 +447,7 @@ export function LLMConfigForm({
<CollapsibleTrigger asChild> <CollapsibleTrigger asChild>
<button <button
type="button" type="button"
className="flex w-full items-center justify-between py-2 text-xs sm:text-sm font-medium text-muted-foreground hover:text-foreground transition-colors" className="flex w-full items-center justify-between py-2 text-xs sm:text-sm font-medium text-muted-foreground hover:text-accent-foreground transition-colors"
> >
<span>System Instructions</span> <span>System Instructions</span>
<ChevronDown <ChevronDown
@ -475,7 +475,7 @@ export function LLMConfigForm({
onClick={() => onClick={() =>
field.onChange(defaultInstructions.default_system_instructions) field.onChange(defaultInstructions.default_system_instructions)
} }
className="h-7 text-[10px] sm:text-xs text-muted-foreground hover:text-foreground" className="h-7 text-[10px] sm:text-xs text-muted-foreground hover:text-accent-foreground"
> >
Reset to Default Reset to Default
</Button> </Button>

10
surfsense_web/components/sources/DocumentUploadTab.tsx
View file

@ -457,7 +457,7 @@ export function DocumentUploadTab({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className={`text-xs gap-1 bg-neutral-700/50 hover:bg-neutral-600/50 ${sizeClass} ${widthClass}`} className={`text-xs gap-1 bg-neutral-700/50 hover:bg-accent hover:text-accent-foreground ${sizeClass} ${widthClass}`}
> >
Browse Browse
<ChevronDown className="h-3 w-3 opacity-60" /> <ChevronDown className="h-3 w-3 opacity-60" />
@ -487,7 +487,7 @@ export function DocumentUploadTab({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className={`text-xs gap-1 bg-neutral-700/50 hover:bg-neutral-600/50 ${sizeClass} ${widthClass}`} className={`text-xs gap-1 bg-neutral-700/50 hover:bg-accent hover:text-accent-foreground ${sizeClass} ${widthClass}`}
> >
Browse Browse
<ChevronDown className="h-3 w-3 opacity-60" /> <ChevronDown className="h-3 w-3 opacity-60" />
@ -539,7 +539,7 @@ export function DocumentUploadTab({
) : ( ) : (
<button <button
type="button" type="button"
className="w-full text-xs h-8 flex items-center justify-center gap-1.5 rounded-md border border-dashed border-muted-foreground/30 text-muted-foreground hover:text-foreground hover:border-foreground/50 transition-colors" className="w-full text-xs h-8 flex items-center justify-center gap-1.5 rounded-md border border-dashed border-muted-foreground/30 text-muted-foreground hover:text-accent-foreground hover:border-foreground/50 transition-colors"
onClick={() => fileInputRef.current?.click()} onClick={() => fileInputRef.current?.click()}
> >
Add more files Add more files
@ -636,7 +636,7 @@ export function DocumentUploadTab({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className="h-7 text-xs text-muted-foreground hover:text-foreground" className="h-7 text-xs text-muted-foreground hover:text-accent-foreground"
onClick={() => { onClick={() => {
setFiles([]); setFiles([]);
setFolderUpload(null); setFolderUpload(null);
@ -671,7 +671,7 @@ export function DocumentUploadTab({
: files.map((entry) => ( : files.map((entry) => (
<div <div
key={entry.id} key={entry.id}
className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-slate-400/5 dark:hover:bg-white/5 group" className="flex items-center gap-2 py-1.5 px-2 rounded-md hover:bg-accent hover:text-accent-foreground group"
> >
<span className="text-[10px] font-medium uppercase leading-none bg-muted px-1.5 py-0.5 rounded text-muted-foreground shrink-0"> <span className="text-[10px] font-medium uppercase leading-none bg-muted px-1.5 py-0.5 rounded text-muted-foreground shrink-0">
{entry.file.name.split(".").pop() || "?"} {entry.file.name.split(".").pop() || "?"}

4
surfsense_web/components/sources/FolderWatchDialog.tsx
View file

@ -164,7 +164,7 @@ export function FolderWatchDialog({
return ( return (
<Dialog open={open} onOpenChange={handleOpenChange}> <Dialog open={open} onOpenChange={handleOpenChange}>
<DialogContent className="sm:max-w-md select-none p-0 gap-0 overflow-hidden [&>button]:opacity-80 [&>button]:hover:opacity-100 [&>button]:hover:bg-foreground/10"> <DialogContent className="sm:max-w-md select-none p-0 gap-0 overflow-hidden [&>button]:opacity-80 [&>button]:hover:opacity-100 [&>button]:hover:bg-accent [&>button]:hover:text-accent-foreground">
<DialogHeader className="px-4 sm:px-6 pt-5 sm:pt-6 pb-3"> <DialogHeader className="px-4 sm:px-6 pt-5 sm:pt-6 pb-3">
<DialogTitle className="text-lg sm:text-xl font-semibold tracking-tight"> <DialogTitle className="text-lg sm:text-xl font-semibold tracking-tight">
Watch Local Folder Watch Local Folder
@ -197,7 +197,7 @@ export function FolderWatchDialog({
<button <button
type="button" type="button"
onClick={handleSelectFolder} onClick={handleSelectFolder}
className="flex flex-1 w-full items-center justify-center gap-2 rounded-lg border-2 border-dashed border-muted-foreground/30 text-sm text-muted-foreground transition-colors hover:border-foreground/50 hover:text-foreground" className="flex flex-1 w-full items-center justify-center gap-2 rounded-lg border-2 border-dashed border-muted-foreground/30 text-sm text-muted-foreground transition-colors hover:border-foreground/50 hover:text-accent-foreground"
> >
Browse for a folder Browse for a folder
</button> </button>

8
surfsense_web/components/tool-ui/citation/citation-list.tsx
View file

@ -176,7 +176,7 @@ function OverflowIndicator({ citations, count, variant, onNavigate }: OverflowIn
"inline-flex items-center gap-1 rounded-md px-2 py-1", "inline-flex items-center gap-1 rounded-md px-2 py-1",
"bg-muted/60 text-sm tabular-nums", "bg-muted/60 text-sm tabular-nums",
"transition-colors duration-150", "transition-colors duration-150",
"hover:bg-muted", "hover:bg-accent hover:text-accent-foreground",
"focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none" "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none"
)} )}
> >
@ -209,7 +209,7 @@ function OverflowIndicator({ citations, count, variant, onNavigate }: OverflowIn
"flex items-center justify-center rounded-xl px-4 py-3", "flex items-center justify-center rounded-xl px-4 py-3",
"border-border bg-card border border-dashed", "border-border bg-card border border-dashed",
"transition-colors duration-150", "transition-colors duration-150",
"hover:border-foreground/25 hover:bg-muted/50", "hover:border-foreground/25 hover:bg-accent hover:text-accent-foreground",
"focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none" "focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none"
)} )}
> >
@ -242,7 +242,7 @@ function OverflowItem({ citation, onClick }: OverflowItemProps) {
<button <button
type="button" type="button"
onClick={onClick} onClick={onClick}
className="group hover:bg-muted focus-visible:bg-muted flex w-full cursor-pointer items-center gap-2.5 rounded-md px-2 py-2 text-left transition-colors focus-visible:outline-none" className="group hover:bg-accent hover:text-accent-foreground focus-visible:bg-muted flex w-full cursor-pointer items-center gap-2.5 rounded-md px-2 py-2 text-left transition-colors focus-visible:outline-none"
> >
{citation.favicon ? ( {citation.favicon ? (
<NextImage <NextImage
@ -313,7 +313,7 @@ function StackedCitations({ id, citations, className, onNavigate }: StackedCitat
"isolate inline-flex cursor-pointer items-center gap-2 rounded-lg px-3 py-2", "isolate inline-flex cursor-pointer items-center gap-2 rounded-lg px-3 py-2",
"bg-muted/40 outline-none", "bg-muted/40 outline-none",
"transition-colors duration-150", "transition-colors duration-150",
"hover:bg-muted/70", "hover:bg-accent hover:text-accent-foreground",
"focus-visible:ring-ring focus-visible:ring-2", "focus-visible:ring-ring focus-visible:ring-2",
className className
)} )}

4
surfsense_web/components/tool-ui/citation/citation.tsx
View file

@ -138,7 +138,7 @@ export function Citation(props: CitationProps) {
"inline-flex cursor-pointer items-center gap-1.5 rounded-md px-2 py-1", "inline-flex cursor-pointer items-center gap-1.5 rounded-md px-2 py-1",
"bg-muted/60 text-sm outline-none", "bg-muted/60 text-sm outline-none",
"transition-colors duration-150", "transition-colors duration-150",
"hover:bg-muted", "hover:bg-accent hover:text-accent-foreground",
"focus-visible:ring-ring focus-visible:ring-2", "focus-visible:ring-ring focus-visible:ring-2",
className className
)} )}
@ -157,7 +157,7 @@ export function Citation(props: CitationProps) {
onCloseAutoFocus={(e) => e.preventDefault()} onCloseAutoFocus={(e) => e.preventDefault()}
onClick={handleClick} onClick={handleClick}
> >
<div className="hover:bg-muted/50 flex flex-col gap-2 p-3 transition-colors"> <div className="hover:bg-accent hover:text-accent-foreground flex flex-col gap-2 p-3 transition-colors">
<div className="flex items-start gap-2"> <div className="flex items-start gap-2">
{iconElement} {iconElement}
<span className="text-muted-foreground text-xs">{domain}</span> <span className="text-muted-foreground text-xs">{domain}</span>

2
surfsense_web/components/tool-ui/generate-podcast.tsx
View file

@ -264,7 +264,7 @@ function PodcastPlayer({
<div className="mx-5 h-px bg-border/50" /> <div className="mx-5 h-px bg-border/50" />
<Accordion type="single" collapsible className="px-5"> <Accordion type="single" collapsible className="px-5">
<AccordionItem value="transcript" className="border-b-0"> <AccordionItem value="transcript" className="border-b-0">
<AccordionTrigger className="py-3 text-xs sm:text-sm font-medium text-muted-foreground hover:text-foreground hover:no-underline"> <AccordionTrigger className="py-3 text-xs sm:text-sm font-medium text-muted-foreground hover:text-accent-foreground hover:no-underline">
View transcript View transcript
</AccordionTrigger> </AccordionTrigger>
<AccordionContent className="pb-0"> <AccordionContent className="pb-0">

2
surfsense_web/components/tool-ui/generate-report.tsx
View file

@ -218,7 +218,7 @@ function ReportCard({
<button <button
type="button" type="button"
onClick={handleOpen} onClick={handleOpen}
className="w-full text-left transition-colors hover:bg-muted/50 focus:outline-none focus-visible:outline-none cursor-pointer" className="w-full text-left transition-colors hover:bg-accent hover:text-accent-foreground focus:outline-none focus-visible:outline-none cursor-pointer"
> >
<div className="px-5 pt-5 pb-4 select-none"> <div className="px-5 pt-5 pb-4 select-none">
<p className="text-sm font-semibold text-foreground line-clamp-2"> <p className="text-sm font-semibold text-foreground line-clamp-2">

2
surfsense_web/components/tool-ui/generate-resume.tsx
View file

@ -284,7 +284,7 @@ function ResumeCard({
<button <button
type="button" type="button"
onClick={handleOpen} onClick={handleOpen}
className="w-full text-left transition-colors hover:bg-muted/50 focus:outline-none focus-visible:outline-none cursor-pointer select-none" className="w-full text-left transition-colors hover:bg-accent hover:text-accent-foreground focus:outline-none focus-visible:outline-none cursor-pointer select-none"
> >
<div className="px-5 pt-5 pb-4"> <div className="px-5 pt-5 pb-4">
<p className="text-sm font-semibold text-foreground line-clamp-2">{title}</p> <p className="text-sm font-semibold text-foreground line-clamp-2">{title}</p>

2
surfsense_web/components/tool-ui/plan/plan.tsx
View file

@ -195,7 +195,7 @@ export const Plan: FC<PlanProps> = ({
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
className="w-full mt-2 text-xs text-muted-foreground hover:text-foreground" className="w-full mt-2 text-xs text-muted-foreground hover:text-accent-foreground"
> >
{isExpanded {isExpanded
? "Show less" ? "Show less"

2
surfsense_web/components/tool-ui/sandbox-execute.tsx
View file

@ -295,7 +295,7 @@ function ExecuteCompleted({
<Collapsible open={open} onOpenChange={setOpen}> <Collapsible open={open} onOpenChange={setOpen}>
<CollapsibleTrigger <CollapsibleTrigger
className={cn( className={cn(
"flex w-full items-center gap-2 rounded-xl border bg-card px-4 py-2.5 text-left transition-colors hover:bg-accent/50", "flex w-full items-center gap-2 rounded-xl border bg-card px-4 py-2.5 text-left transition-colors hover:bg-accent hover:text-accent-foreground",
open && "rounded-b-none border-b-0", open && "rounded-b-none border-b-0",
parsed.isError && "border-destructive/20" parsed.isError && "border-destructive/20"
)} )}

2
surfsense_web/components/ui/dialog.tsx
View file

@ -44,7 +44,7 @@ const DialogContent = React.forwardRef<
{...props} {...props}
> >
{children} {children}
<DialogPrimitive.Close className="absolute right-4 top-4 z-50 h-8 w-8 rounded-full inline-flex items-center justify-center text-muted-foreground transition-colors hover:text-foreground hover:bg-accent focus:outline-none disabled:pointer-events-none"> <DialogPrimitive.Close className="absolute right-4 top-4 z-50 h-8 w-8 rounded-full inline-flex items-center justify-center text-muted-foreground transition-colors hover:text-accent-foreground hover:bg-accent focus:outline-none disabled:pointer-events-none">
<X className="h-4 w-4" /> <X className="h-4 w-4" />
<span className="sr-only">Close</span> <span className="sr-only">Close</span>
</DialogPrimitive.Close> </DialogPrimitive.Close>

2
surfsense_web/components/ui/sheet.tsx
View file

@ -68,7 +68,7 @@ function SheetContent({
{...props} {...props}
> >
{children} {children}
<SheetPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none"> <SheetPrimitive.Close className="ring-offset-background focus:ring-ring absolute top-4 right-4 inline-flex h-8 w-8 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
<XIcon className="size-4" /> <XIcon className="size-4" />
<span className="sr-only">Close</span> <span className="sr-only">Close</span>
</SheetPrimitive.Close> </SheetPrimitive.Close>

2
surfsense_web/features/chat-messages/timeline/timeline.tsx
View file

@ -103,7 +103,7 @@ export const Timeline: FC<{
onClick={() => setIsOpen((prev) => !prev)} onClick={() => setIsOpen((prev) => !prev)}
className={cn( className={cn(
"flex w-full items-center gap-1.5 text-left text-sm transition-colors", "flex w-full items-center gap-1.5 text-left text-sm transition-colors",
"text-muted-foreground hover:text-foreground" "text-muted-foreground hover:text-accent-foreground"
)} )}
> >
{isProcessing ? ( {isProcessing ? (

2
surfsense_web/features/chat-messages/timeline/tool-registry/fallback/default-fallback-card.tsx
View file

@ -95,7 +95,7 @@ export const DefaultFallbackCard: TimelineToolComponent = ({
setIsExpanded(next); setIsExpanded(next);
}} }}
> >
<div className="flex items-stretch transition-colors hover:bg-muted/50"> <div className="flex items-stretch transition-colors hover:bg-accent hover:text-accent-foreground">
<CollapsibleTrigger asChild> <CollapsibleTrigger asChild>
<button <button
type="button" type="button"