diff --git a/package-lock.json b/package-lock.json index 8c64a2de..1eaa54ff 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39,6 +39,7 @@ "@types/qrcode": "^1.5.5", "@types/speakeasy": "^2.0.10", "@uiw/codemirror-extensions-langs": "^4.24.1", + "@uiw/codemirror-theme-github": "^4.25.4", "@uiw/react-codemirror": "^4.24.1", "@xterm/addon-clipboard": "^0.1.0", "@xterm/addon-fit": "^0.10.0", @@ -5794,6 +5795,37 @@ "@codemirror/language-data": ">=6.0.0" } }, + "node_modules/@uiw/codemirror-theme-github": { + "version": "4.25.4", + "resolved": "https://registry.npmjs.org/@uiw/codemirror-theme-github/-/codemirror-theme-github-4.25.4.tgz", + "integrity": "sha512-M5zRT2vIpNsuKN0Lz+DwLnmhHW8Eddp1M9zC0hm3V+bvffmaSn/pUDey1eqGIv5xNNmjhqvDAz0a90xLYCzvSw==", + "license": "MIT", + "dependencies": { + "@uiw/codemirror-themes": "4.25.4" + }, + "funding": { + "url": "https://jaywcjlove.github.io/#/sponsor" + } + }, + "node_modules/@uiw/codemirror-themes": { + "version": "4.25.4", + "resolved": "https://registry.npmjs.org/@uiw/codemirror-themes/-/codemirror-themes-4.25.4.tgz", + "integrity": "sha512-2SLktItgcZC4p0+PfFusEbAHwbuAWe3bOOntCevVgHtrWGtGZX3IPv2k8IKZMgOXtAHyGKpJvT9/nspPn/uCQg==", + "license": "MIT", + "dependencies": { + "@codemirror/language": "^6.0.0", + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.0.0" + }, + "funding": { + "url": "https://jaywcjlove.github.io/#/sponsor" + }, + "peerDependencies": { + "@codemirror/language": ">=6.0.0", + "@codemirror/state": ">=6.0.0", + "@codemirror/view": ">=6.0.0" + } + }, "node_modules/@uiw/react-codemirror": { "version": "4.25.2", "resolved": "https://registry.npmjs.org/@uiw/react-codemirror/-/react-codemirror-4.25.2.tgz", diff --git a/package.json b/package.json index d39360eb..b34f9e5d 100644 --- a/package.json +++ b/package.json @@ -58,6 +58,7 @@ "@types/qrcode": "^1.5.5", "@types/speakeasy": "^2.0.10", "@uiw/codemirror-extensions-langs": "^4.24.1", + "@uiw/codemirror-theme-github": "^4.25.4", "@uiw/react-codemirror": "^4.24.1", "@xterm/addon-clipboard": "^0.1.0", "@xterm/addon-fit": "^0.10.0", diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx index b99be47d..dbc4719e 100644 --- a/src/components/ui/badge.tsx +++ b/src/components/ui/badge.tsx @@ -15,7 +15,7 @@ const badgeVariants = cva( secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90", destructive: - "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", + "border-transparent bg-destructive text-foreground [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground", }, diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx index fbdf6b8d..849574a3 100644 --- a/src/components/ui/button.tsx +++ b/src/components/ui/button.tsx @@ -13,7 +13,7 @@ const buttonVariants = cva( default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90", destructive: - "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", + "bg-destructive text-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50", secondary: diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx index ba0f8921..f7fb44e5 100644 --- a/src/components/ui/input.tsx +++ b/src/components/ui/input.tsx @@ -8,7 +8,7 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) { type={type} data-slot="input" className={cn( - "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] duration-200 outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", + "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground bg-elevated dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] duration-200 outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", className, diff --git a/src/components/ui/resizable.tsx b/src/components/ui/resizable.tsx index 7909c556..2835db13 100644 --- a/src/components/ui/resizable.tsx +++ b/src/components/ui/resizable.tsx @@ -37,13 +37,13 @@ function ResizableHandle({ div]:rotate-90 bg-dark-border-hover hover:bg-dark-active active:bg-dark-pressed transition-colors duration-150", + "relative flex w-1 items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-1 data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90 bg-edge-hover hover:bg-interact active:bg-pressed transition-colors duration-150", className, )} {...props} > {withHandle && ( -
+
)} diff --git a/src/constants/terminal-themes.ts b/src/constants/terminal-themes.ts index 393188f8..6aec2e4a 100644 --- a/src/constants/terminal-themes.ts +++ b/src/constants/terminal-themes.ts @@ -28,6 +28,7 @@ export interface TerminalTheme { } export const TERMINAL_THEMES: Record = { + // Legacy "termix" theme - auto-switches between termixDark and termixLight based on app theme termix: { name: "Termix Default", category: "dark", @@ -56,6 +57,62 @@ export const TERMINAL_THEMES: Record = { }, }, + termixDark: { + name: "Termix Dark", + category: "dark", + colors: { + background: "#18181b", + foreground: "#f7f7f7", + cursor: "#f7f7f7", + cursorAccent: "#18181b", + selectionBackground: "#3a3a3d", + black: "#2e3436", + red: "#cc0000", + green: "#4e9a06", + yellow: "#c4a000", + blue: "#3465a4", + magenta: "#75507b", + cyan: "#06989a", + white: "#d3d7cf", + brightBlack: "#555753", + brightRed: "#ef2929", + brightGreen: "#8ae234", + brightYellow: "#fce94f", + brightBlue: "#729fcf", + brightMagenta: "#ad7fa8", + brightCyan: "#34e2e2", + brightWhite: "#eeeeec", + }, + }, + + termixLight: { + name: "Termix Light", + category: "light", + colors: { + background: "#ffffff", + foreground: "#18181b", + cursor: "#18181b", + cursorAccent: "#ffffff", + selectionBackground: "#d1d5db", + black: "#18181b", + red: "#dc2626", + green: "#16a34a", + yellow: "#ca8a04", + blue: "#2563eb", + magenta: "#9333ea", + cyan: "#0891b2", + white: "#f4f4f5", + brightBlack: "#71717a", + brightRed: "#ef4444", + brightGreen: "#22c55e", + brightYellow: "#eab308", + brightBlue: "#3b82f6", + brightMagenta: "#a855f7", + brightCyan: "#06b6d4", + brightWhite: "#ffffff", + }, + }, + dracula: { name: "Dracula", category: "dark", diff --git a/src/index.css b/src/index.css index c833a548..92f06125 100644 --- a/src/index.css +++ b/src/index.css @@ -8,45 +8,77 @@ font-weight: 400; color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); - background-color: #09090b; + color: var(--foreground); + background-color: var(--bg-base); font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; --radius: 0.625rem; - --background: oklch(1 0 0); - --foreground: oklch(0.141 0.005 285.823); - --card: oklch(1 0 0); - --card-foreground: oklch(0.141 0.005 285.823); - --popover: oklch(1 0 0); - --popover-foreground: oklch(0.141 0.005 285.823); - --primary: oklch(0.21 0.006 285.885); - --primary-foreground: oklch(0.985 0 0); - --secondary: oklch(0.967 0.001 286.375); - --secondary-foreground: oklch(0.21 0.006 285.885); - --muted: oklch(0.967 0.001 286.375); - --muted-foreground: oklch(0.552 0.016 285.938); - --accent: oklch(0.967 0.001 286.375); - --accent-foreground: oklch(0.21 0.006 285.885); - --destructive: oklch(0.577 0.245 27.325); - --border: oklch(0.92 0.004 286.32); - --input: oklch(0.92 0.004 286.32); - --ring: oklch(0.705 0.015 286.067); - --chart-1: oklch(0.646 0.222 41.116); - --chart-2: oklch(0.6 0.118 184.704); - --chart-3: oklch(0.398 0.07 227.392); - --chart-4: oklch(0.828 0.189 84.429); - --chart-5: oklch(0.769 0.188 70.08); - --sidebar: oklch(0.985 0 0); - --sidebar-foreground: oklch(0.141 0.005 285.823); - --sidebar-primary: oklch(0.21 0.006 285.885); - --sidebar-primary-foreground: oklch(0.985 0 0); - --sidebar-accent: oklch(0.967 0.001 286.375); - --sidebar-accent-foreground: oklch(0.21 0.006 285.885); - --sidebar-border: oklch(0.92 0.004 286.32); - --sidebar-ring: oklch(0.705 0.015 286.067); + --background: #ffffff; + --foreground: #18181b; + --card: #ffffff; + --card-foreground: #18181b; + --popover: #ffffff; + --popover-foreground: #18181b; + --primary: #27272a; + --primary-foreground: #fafafa; + --secondary: #f4f4f5; + --secondary-foreground: #27272a; + --muted: #f4f4f5; + --muted-foreground: #71717a; + --accent: #f4f4f5; + --accent-foreground: #27272a; + --destructive: #dc2626; + --border: #e4e4e7; + --input: #e4e4e7; + --ring: #a1a1aa; + --chart-1: #e76e50; + --chart-2: #2a9d8f; + --chart-3: #264653; + --chart-4: #e9c46a; + --chart-5: #f4a261; + --sidebar: #f9f9f9; + --sidebar-foreground: #18181b; + --sidebar-primary: #27272a; + --sidebar-primary-foreground: #fafafa; + --sidebar-accent: #f4f4f5; + --sidebar-accent-foreground: #27272a; + --sidebar-border: #e4e4e7; + --sidebar-ring: #a1a1aa; + + /* NEW SEMANTIC VARIABLES - Light Mode Backgrounds */ + --bg-base: #fcfcfc; + --bg-elevated: #ffffff; + --bg-surface: #f3f4f6; + --bg-surface-hover: #e5e7eb; /* Panel hover - replaces dark-bg-panel-hover */ + --bg-input: #ffffff; + --bg-deepest: #e5e7eb; + --bg-header: #eeeeef; + --bg-button: #f3f4f6; + --bg-active: #e5e7eb; + --bg-light: #fafafa; /* Light background - replaces dark-bg-light */ + --bg-subtle: #f5f5f5; /* Very light background - replaces dark-bg-very-light */ + --bg-interact: #d1d5db; /* Interactive/active state - replaces dark-active */ + --border-base: #e5e7eb; + --border-panel: #d1d5db; + --border-subtle: #f3f4f6; + --border-medium: #d1d5db; + --bg-hover: #f3f4f6; + --bg-hover-alt: #e5e7eb; + --bg-pressed: #d1d5db; + --border-hover: #d1d5db; + --border-active: #9ca3af; + + /* NEW SEMANTIC VARIABLES - Light Mode Text Colors */ + --foreground-secondary: #334155; + --foreground-subtle: #94a3b8; + + /* Scrollbar Colors - Light Mode */ + --scrollbar-thumb: #c1c1c3; + --scrollbar-thumb-hover: #a1a1a3; + --scrollbar-track: #f3f4f6; } @theme inline { @@ -107,40 +139,101 @@ --color-dark-bg-panel: #1b1b1e; --color-dark-border-panel: #222224; --color-dark-bg-panel-hover: #232327; + + /* NEW SEMANTIC COLOR MAPPINGS - Creates Tailwind classes */ + /* Backgrounds: bg-canvas, bg-elevated, bg-surface, etc. */ + --color-canvas: var(--bg-base); + --color-elevated: var(--bg-elevated); + --color-surface: var(--bg-surface); + --color-surface-hover: var(--bg-surface-hover); + --color-field: var(--bg-input); + --color-deepest: var(--bg-deepest); + --color-header: var(--bg-header); + --color-button: var(--bg-button); + --color-active: var(--bg-active); + --color-light: var(--bg-light); + --color-subtle: var(--bg-subtle); + --color-interact: var(--bg-interact); + --color-hover: var(--bg-hover); + --color-hover-alt: var(--bg-hover-alt); + --color-pressed: var(--bg-pressed); + /* Borders: border-edge, border-edge-panel, etc. */ + --color-edge: var(--border-base); + --color-edge-panel: var(--border-panel); + --color-edge-subtle: var(--border-subtle); + --color-edge-medium: var(--border-medium); + --color-edge-hover: var(--border-hover); + --color-edge-active: var(--border-active); + + /* NEW SEMANTIC TEXT COLOR MAPPINGS - Creates Tailwind text classes */ + --color-foreground-secondary: var(--foreground-secondary); + --color-foreground-subtle: var(--foreground-subtle); } .dark { - --background: oklch(0.141 0.005 285.823); - --foreground: oklch(0.985 0 0); - --card: oklch(0.21 0.006 285.885); - --card-foreground: oklch(0.985 0 0); - --popover: oklch(0.21 0.006 285.885); - --popover-foreground: oklch(0.985 0 0); - --primary: oklch(0.92 0.004 286.32); - --primary-foreground: oklch(0.21 0.006 285.885); - --secondary: oklch(0.274 0.006 286.033); - --secondary-foreground: oklch(0.985 0 0); - --muted: oklch(0.274 0.006 286.033); - --muted-foreground: oklch(0.705 0.015 286.067); - --accent: oklch(0.274 0.006 286.033); - --accent-foreground: oklch(0.985 0 0); - --destructive: oklch(0.704 0.191 22.216); - --border: oklch(1 0 0 / 10%); - --input: oklch(1 0 0 / 15%); - --ring: oklch(0.552 0.016 285.938); - --chart-1: oklch(0.488 0.243 264.376); - --chart-2: oklch(0.696 0.17 162.48); - --chart-3: oklch(0.769 0.188 70.08); - --chart-4: oklch(0.627 0.265 303.9); - --chart-5: oklch(0.645 0.246 16.439); - --sidebar: oklch(0.21 0.006 285.885); - --sidebar-foreground: oklch(0.985 0 0); - --sidebar-primary: oklch(0.488 0.243 264.376); - --sidebar-primary-foreground: oklch(0.985 0 0); - --sidebar-accent: oklch(0.274 0.006 286.033); - --sidebar-accent-foreground: oklch(0.985 0 0); - --sidebar-border: oklch(1 0 0 / 10%); - --sidebar-ring: oklch(0.552 0.016 285.938); + --background: #09090b; + --foreground: #fafafa; + --card: #18181b; + --card-foreground: #fafafa; + --popover: #27272a; + --popover-foreground: #fafafa; + --primary: #e4e4e7; + --primary-foreground: #27272a; + --secondary: #3f3f46; + --secondary-foreground: #fafafa; + --muted: #27272a; + --muted-foreground: #9ca3af; + --accent: #3f3f46; + --accent-foreground: #fafafa; + --destructive: #f87171; + --border: #ffffff1a; + --input: #ffffff26; + --ring: #71717a; + --chart-1: #3b82f6; + --chart-2: #34d399; + --chart-3: #f4a261; + --chart-4: #a855f7; + --chart-5: #f43f5e; + --sidebar: #18181b; + --sidebar-foreground: #fafafa; + --sidebar-primary: #3b82f6; + --sidebar-primary-foreground: #fafafa; + --sidebar-accent: #3f3f46; + --sidebar-accent-foreground: #fafafa; + --sidebar-border: #ffffff1a; + --sidebar-ring: #71717a; + + /* NEW SEMANTIC VARIABLES - Dark Mode Background Overrides */ + --bg-base: #18181b; + --bg-elevated: #0e0e10; + --bg-surface: #1b1b1e; + --bg-surface-hover: #232327; /* Panel hover */ + --bg-input: #222225; + --bg-deepest: #09090b; + --bg-header: #131316; + --bg-button: #23232a; + --bg-active: #1d1d1f; + --bg-light: #141416; /* Light background */ + --bg-subtle: #101014; /* Very light background */ + --bg-interact: #2a2a2c; /* Interactive/active state */ + --border-base: #303032; + --border-panel: #222224; + --border-subtle: #5a5a5d; + --border-medium: #373739; + --bg-hover: #2d2d30; + --bg-hover-alt: #2a2a2d; + --bg-pressed: #1a1a1c; + --border-hover: #434345; + --border-active: #2d2d30; + + /* NEW SEMANTIC VARIABLES - Dark Mode Text Color Overrides */ + --foreground-secondary: #d1d5db; /* Matches text-gray-300 */ + --foreground-subtle: #6b7280; /* Matches text-gray-500 */ + + /* Scrollbar Colors - Dark Mode */ + --scrollbar-thumb: #434345; + --scrollbar-thumb-hover: #5a5a5d; + --scrollbar-track: #18181b; } @layer base { @@ -158,25 +251,10 @@ } } +/* Thin Scrollbar - Theme Aware */ .thin-scrollbar { scrollbar-width: thin; - scrollbar-color: #303032 transparent; -} - -.thin-scrollbar::-webkit-scrollbar { - height: 6px; - width: 6px; -} - -.thin-scrollbar::-webkit-scrollbar-track { - background: transparent; -} - -.thin-scrollbar::-webkit-scrollbar-thumb { - background-color: #303032; - border-radius: 9999px; - border: 2px solid transparent; - background-clip: content-box; + scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track); } .thin-scrollbar::-webkit-scrollbar { @@ -185,19 +263,14 @@ } .thin-scrollbar::-webkit-scrollbar-track { - background: #18181b; + background: var(--scrollbar-track); } .thin-scrollbar::-webkit-scrollbar-thumb { - background: #434345; + background: var(--scrollbar-thumb); border-radius: 3px; } .thin-scrollbar::-webkit-scrollbar-thumb:hover { - background: #5a5a5d; -} - -.thin-scrollbar { - scrollbar-width: thin; - scrollbar-color: #434345 #18181b; + background: var(--scrollbar-thumb-hover); } diff --git a/src/main.tsx b/src/main.tsx index 53ff210e..0202bb43 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -79,13 +79,13 @@ function RootApp() {
("idle"); const { currentTab, tabs } = useTabs(); const [isCommandPaletteOpen, setIsCommandPaletteOpen] = useState(false); + const { theme, setTheme } = useTheme(); const [rightSidebarOpen, setRightSidebarOpen] = useState(false); const [rightSidebarWidth, setRightSidebarWidth] = useState(400); const lastShiftPressTime = useRef(0); + // DEBUG: Theme toggle - double-tap left Alt/Option to toggle light/dark mode + // Comment out the next line and the AltLeft handler below to disable + const lastAltPressTime = useRef(0); + useEffect(() => { const handleKeyDown = (event: KeyboardEvent) => { if (event.code === "ShiftLeft") { @@ -49,6 +55,26 @@ function AppContent() { lastShiftPressTime.current = now; } } + + // DEBUG: Double-tap left Alt/Option to toggle light/dark theme + // Remove or comment out this block for production + /* DEBUG_THEME_TOGGLE_START */ + if (event.code === "AltLeft" && !event.repeat) { + const now = Date.now(); + if (now - lastAltPressTime.current < 300) { + // Use setTheme to properly update React state (not just DOM class) + const currentIsDark = theme === "dark" || + (theme === "system" && window.matchMedia("(prefers-color-scheme: dark)").matches); + const newTheme = currentIsDark ? "light" : "dark"; + setTheme(newTheme); + console.log("[DEBUG] Theme toggled:", newTheme); + lastAltPressTime.current = 0; + } else { + lastAltPressTime.current = now; + } + } + /* DEBUG_THEME_TOGGLE_END */ + if (event.key === "Escape") { setIsCommandPaletteOpen(false); } @@ -58,7 +84,7 @@ function AppContent() { return () => { window.removeEventListener("keydown", handleKeyDown); }; - }, []); + }, [theme, setTheme]); useEffect(() => { const checkAuth = () => { @@ -166,7 +192,7 @@ function AppContent() { if (authLoading) { return (
@@ -824,71 +824,71 @@ export function AdminSettings({
- + {t("admin.general")} - + OIDC - + {t("admin.users")} - + Sessions - + {t("admin.adminManagement")} - + {t("rbac.roles.label")} - + {t("admin.databaseSecurity")} -
+

{t("admin.userRegistration")}

- - + +
-
+

{t("admin.externalAuthentication")}

@@ -1143,7 +1143,7 @@ export function AdminSettings({ -
+

{t("admin.userManagement")} @@ -1253,7 +1253,7 @@ export function AdminSettings({ -
+

Session Management

-
+

@@ -635,7 +629,7 @@ export function Dashboard({

-
+

@@ -713,7 +707,7 @@ export function Dashboard({

-
+
{t("fileManager.itemCount", { count: files.length })} {selectedFiles.length > 0 && ( diff --git a/src/ui/desktop/apps/file-manager/FileManagerSidebar.tsx b/src/ui/desktop/apps/file-manager/FileManagerSidebar.tsx index fc63779d..77a75e37 100644 --- a/src/ui/desktop/apps/file-manager/FileManagerSidebar.tsx +++ b/src/ui/desktop/apps/file-manager/FileManagerSidebar.tsx @@ -375,9 +375,9 @@ export function FileManagerSidebar({
handleItemClick(item)} @@ -397,7 +397,7 @@ export function FileManagerSidebar({ e.stopPropagation(); toggleFolder(item.id, item.path); }} - className="p-0.5 hover:bg-dark-hover rounded" + className="p-0.5 hover:bg-hover rounded" > {isExpanded ? ( @@ -454,7 +454,7 @@ export function FileManagerSidebar({ return ( <> -
+
{renderSection( @@ -475,7 +475,7 @@ export function FileManagerSidebar({
@@ -495,7 +495,7 @@ export function FileManagerSidebar({
{recentItems.length > 1 && ( <> -
+
-
-

+

+

{t("fileManager.selectedFiles")}:

    @@ -134,7 +134,7 @@ export function CompressDialog({ ))} {fileNames.length > 5 && ( -
  • +
  • {t("fileManager.andMoreFiles", { count: fileNames.length - 5, })} diff --git a/src/ui/desktop/apps/file-manager/components/DiffViewer.tsx b/src/ui/desktop/apps/file-manager/components/DiffViewer.tsx index 70cf8d3a..ca74c3f5 100644 --- a/src/ui/desktop/apps/file-manager/components/DiffViewer.tsx +++ b/src/ui/desktop/apps/file-manager/components/DiffViewer.tsx @@ -210,7 +210,7 @@ export function DiffViewer({ if (isLoading) { return ( -
    +

    @@ -223,7 +223,7 @@ export function DiffViewer({ if (error) { return ( -

    +

    {error}

    @@ -237,8 +237,8 @@ export function DiffViewer({ } return ( -
    -
    +
    +
    diff --git a/src/ui/desktop/apps/file-manager/components/FileViewer.tsx b/src/ui/desktop/apps/file-manager/components/FileViewer.tsx index a9b837e8..f2f0e600 100644 --- a/src/ui/desktop/apps/file-manager/components/FileViewer.tsx +++ b/src/ui/desktop/apps/file-manager/components/FileViewer.tsx @@ -133,14 +133,14 @@ function getLanguageIcon(filename: string): React.ReactNode { yml: , toml: , sql: , - sh: , - bash: , - zsh: , + sh: , + bash: , + zsh: , vue: , svelte: , - md: , - conf: , - ini: , + md: , + conf: , + ini: , }; return iconMap[ext] || ; @@ -238,7 +238,7 @@ function getFileType(filename: string): { return { type: "unknown", icon: , - color: "text-gray-500", + color: "text-foreground-subtle", }; } } @@ -423,7 +423,7 @@ export function FileViewer({
    -

    Loading file...

    +

    Loading file...

    ); diff --git a/src/ui/desktop/apps/file-manager/components/PermissionsDialog.tsx b/src/ui/desktop/apps/file-manager/components/PermissionsDialog.tsx index 2d88a4f2..40364cef 100644 --- a/src/ui/desktop/apps/file-manager/components/PermissionsDialog.tsx +++ b/src/ui/desktop/apps/file-manager/components/PermissionsDialog.tsx @@ -140,7 +140,7 @@ export function PermissionsDialog({ return ( - + @@ -155,7 +155,7 @@ export function PermissionsDialog({
    -
    -