From e4c3d06a0869bb4c3f6a9d7099cbf11889f63174 Mon Sep 17 00:00:00 2001
From: Philipinho <16838612+Philipinho@users.noreply.github.com>
Date: Mon, 4 May 2026 20:55:13 +0100
Subject: [PATCH] fixes

---
 .../public/locales/en-US/translation.json     |  1 +
 .../layouts/global/global-sidebar.module.css  |  2 +-
 .../src/components/settings/app-version.tsx   |  2 +-
 .../components/page-verification-modal.tsx    | 21 +++++++++--
 .../page/components/page-import-modal.tsx     | 37 +++++++++++++++++--
 .../search/components/search-control.tsx      |  1 +
 .../src/pages/favorites/favorites-page.tsx    |  6 +--
 apps/client/src/theme.ts                      |  2 +-
 8 files changed, 59 insertions(+), 13 deletions(-)

diff --git a/apps/client/public/locales/en-US/translation.json b/apps/client/public/locales/en-US/translation.json
index 79c5d076..38fd5f2d 100644
--- a/apps/client/public/locales/en-US/translation.json
+++ b/apps/client/public/locales/en-US/translation.json
@@ -416,6 +416,7 @@
   "{{latestVersion}} is available": "{{latestVersion}} is available",
   "Default page edit mode": "Default page edit mode",
   "Choose your preferred page edit mode. Avoid accidental edits.": "Choose your preferred page edit mode. Avoid accidental edits.",
+  "Choose {{format}} file": "Choose {{format}} file",
   "Reading": "Reading",
   "Delete member": "Delete member",
   "Member deleted successfully": "Member deleted successfully",
diff --git a/apps/client/src/components/layouts/global/global-sidebar.module.css b/apps/client/src/components/layouts/global/global-sidebar.module.css
index 37cb60b6..9a7bc1b6 100644
--- a/apps/client/src/components/layouts/global/global-sidebar.module.css
+++ b/apps/client/src/components/layouts/global/global-sidebar.module.css
@@ -50,7 +50,7 @@
 .sectionHeader {
     padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
     font-size: var(--mantine-font-size-xs);
-    color: light-dark(var(--mantine-color-gray-6), var(--mantine-color-dark-3));
+    color: var(--mantine-color-dimmed);
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 0.5px;
diff --git a/apps/client/src/components/settings/app-version.tsx b/apps/client/src/components/settings/app-version.tsx
index 5ba9ce2a..44e0b8c4 100644
--- a/apps/client/src/components/settings/app-version.tsx
+++ b/apps/client/src/components/settings/app-version.tsx
@@ -29,7 +29,7 @@ export default function AppVersion() {
       >
         <Indicator
           label={t("New update")}
-          color="gray"
+          color="dark"
           inline
           size={16}
           position="middle-end"
diff --git a/apps/client/src/ee/page-verification/components/page-verification-modal.tsx b/apps/client/src/ee/page-verification/components/page-verification-modal.tsx
index 2a6253fa..2a59e566 100644
--- a/apps/client/src/ee/page-verification/components/page-verification-modal.tsx
+++ b/apps/client/src/ee/page-verification/components/page-verification-modal.tsx
@@ -1,4 +1,12 @@
-import { ActionIcon, Group, Menu, Modal, Text, Tooltip } from "@mantine/core";
+import {
+  ActionIcon,
+  Group,
+  Menu,
+  Modal,
+  Text,
+  ThemeIcon,
+  Tooltip,
+} from "@mantine/core";
 import { useDisclosure } from "@mantine/hooks";
 import {
   IconRosetteDiscountCheckFilled,
@@ -98,9 +106,9 @@ export function PageVerificationBadge({
         withArrow
         openDelay={250}
       >
-        <ActionIcon variant="subtle" color="gray">
+        <ThemeIcon variant="subtle" color="gray">
           <IconShieldCheck size={20} stroke={1.5} />
-        </ActionIcon>
+        </ThemeIcon>
       </Tooltip>
     );
   }
@@ -131,7 +139,12 @@ export function PageVerificationBadge({
         </Tooltip>
       ) : !readOnly ? (
         <Tooltip label={t("Set up verification")} withArrow openDelay={250}>
-          <ActionIcon variant="subtle" color="gray" onClick={open}>
+          <ActionIcon
+            variant="subtle"
+            color="gray"
+            aria-label={t("Set up verification")}
+            onClick={open}
+          >
             <IconShieldCheck size={20} stroke={1.5} />
           </ActionIcon>
         </Tooltip>
diff --git a/apps/client/src/features/page/components/page-import-modal.tsx b/apps/client/src/features/page/components/page-import-modal.tsx
index c1c12dc4..3283ff79 100644
--- a/apps/client/src/features/page/components/page-import-modal.tsx
+++ b/apps/client/src/features/page/components/page-import-modal.tsx
@@ -67,7 +67,7 @@ export default function PageImportModal({
         <Modal.Content style={{ overflow: "hidden" }}>
           <Modal.Header py={0}>
             <Modal.Title fw={500}>{t("Import pages")}</Modal.Title>
-            <Modal.CloseButton />
+            <Modal.CloseButton aria-label={t("Close")} />
           </Modal.Header>
           <Modal.Body>
             <ImportFormatSelection spaceId={spaceId} onClose={onClose} />
@@ -332,7 +332,15 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
   return (
     <>
       <SimpleGrid cols={2}>
-        <FileButton onChange={handleFileUpload} accept=".md" multiple resetRef={markdownFileRef}>
+        <FileButton
+          onChange={handleFileUpload}
+          accept=".md"
+          multiple
+          resetRef={markdownFileRef}
+          inputProps={{
+            "aria-label": t("Choose {{format}} file", { format: "Markdown" }),
+          }}
+        >
           {(props) => (
             <Button
               justify="start"
@@ -345,7 +353,15 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
           )}
         </FileButton>
 
-        <FileButton onChange={handleFileUpload} accept="text/html" multiple resetRef={htmlFileRef}>
+        <FileButton
+          onChange={handleFileUpload}
+          accept="text/html"
+          multiple
+          resetRef={htmlFileRef}
+          inputProps={{
+            "aria-label": t("Choose {{format}} file", { format: "HTML" }),
+          }}
+        >
           {(props) => (
             <Button
               justify="start"
@@ -363,6 +379,9 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
           accept=".docx"
           multiple
           resetRef={docxFileRef}
+          inputProps={{
+            "aria-label": t("Choose {{format}} file", { format: "Word (DOCX)" }),
+          }}
         >
           {(props) => (
             <Tooltip
@@ -387,6 +406,9 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
           accept=".pdf"
           multiple
           resetRef={pdfFileRef}
+          inputProps={{
+            "aria-label": t("Choose {{format}} file", { format: "PDF" }),
+          }}
         >
           {(props) => (
             <Tooltip
@@ -410,6 +432,9 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
           onChange={(file) => handleZipUpload(file, "notion")}
           accept="application/zip"
           resetRef={notionFileRef}
+          inputProps={{
+            "aria-label": t("Choose {{format}} file", { format: "Notion" }),
+          }}
         >
           {(props) => (
             <Button
@@ -426,6 +451,9 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
           onChange={(file) => handleZipUpload(file, "confluence")}
           accept="application/zip"
           resetRef={confluenceFileRef}
+          inputProps={{
+            "aria-label": t("Choose {{format}} file", { format: "Confluence" }),
+          }}
         >
           {(props) => (
             <Tooltip
@@ -463,6 +491,9 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
             onChange={(file) => handleZipUpload(file, "generic")}
             accept="application/zip"
             resetRef={zipFileRef}
+            inputProps={{
+              "aria-label": t("Choose {{format}} file", { format: "ZIP" }),
+            }}
           >
             {(props) => (
               <Group justify="center">
diff --git a/apps/client/src/features/search/components/search-control.tsx b/apps/client/src/features/search/components/search-control.tsx
index 3a689e28..518128d4 100644
--- a/apps/client/src/features/search/components/search-control.tsx
+++ b/apps/client/src/features/search/components/search-control.tsx
@@ -47,6 +47,7 @@ export function SearchMobileControl({ onSearch }: SearchMobileControlProps) {
       <ActionIcon
         variant="subtle"
         color="dark"
+        aria-label={t("Search")}
         onClick={onSearch}
         size="sm"
       >
diff --git a/apps/client/src/pages/favorites/favorites-page.tsx b/apps/client/src/pages/favorites/favorites-page.tsx
index 7e9aa626..5d99531d 100644
--- a/apps/client/src/pages/favorites/favorites-page.tsx
+++ b/apps/client/src/pages/favorites/favorites-page.tsx
@@ -6,7 +6,7 @@ import {
   Table,
   Container,
   Title,
-  ActionIcon,
+  ThemeIcon,
   Button,
 } from "@mantine/core";
 import { Link } from "react-router-dom";
@@ -71,13 +71,13 @@ export default function FavoritesPage() {
                         >
                           <Group wrap="nowrap">
                             {fav.page.icon || (
-                              <ActionIcon
+                              <ThemeIcon
                                 variant="transparent"
                                 color="gray"
                                 size={18}
                               >
                                 <IconFileDescription size={18} />
-                              </ActionIcon>
+                              </ThemeIcon>
                             )}
                             <Text fw={500} size="md" lineClamp={1}>
                               {fav.page.title || t("Untitled")}
diff --git a/apps/client/src/theme.ts b/apps/client/src/theme.ts
index 4c592dc4..ad88337e 100644
--- a/apps/client/src/theme.ts
+++ b/apps/client/src/theme.ts
@@ -71,7 +71,7 @@ export const mantineCssResolver: CSSVariablesResolver = (theme) => ({
     "--input-error-size": theme.fontSizes.sm,
   },
   light: {
-    "--mantine-color-dimmed": "#6b7280",
+    "--mantine-color-dimmed": "#4b5563",
     "--mantine-color-dark-light-color": "#4e5359",
     "--mantine-color-dark-light-hover": "var(--mantine-color-gray-light-hover)",
   },