From d4284a1745c7b0deadb5327118ff4dc2b91e2743 Mon Sep 17 00:00:00 2001
From: Magnus Revheim Martinsen <mrmartinsen.96@gmail.com>
Date: Fri, 26 Jun 2026 12:37:10 +0200
Subject: [PATCH] Fix/wcag issues on singing list and signee list (#4305)

* fix overflow on apptable and download button in signingdocumentlist

* fix signeelist status-tag in 400% zoom

* re-apply word-break fix after merge conflicts
---
 src/app-components/Table/Table.module.css                    | 5 +++++
 src/layout/SigneeList/SigneeStateTag.tsx                     | 2 ++
 src/layout/SigneeList/SigningStateTag.module.css             | 3 +++
 .../SigningDocumentListComponent.module.css                  | 4 ++--
 4 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 src/layout/SigneeList/SigningStateTag.module.css

diff --git a/src/app-components/Table/Table.module.css b/src/app-components/Table/Table.module.css
index 255e6d458b..d754f4ddc6 100644
--- a/src/app-components/Table/Table.module.css
+++ b/src/app-components/Table/Table.module.css
@@ -2,6 +2,11 @@
   width: 100%;
 }
 
+.table tr td,
+.table tr th {
+  overflow-wrap: break-word;
+}
+
 .buttonContainer {
   display: flex;
   justify-content: end;
diff --git a/src/layout/SigneeList/SigneeStateTag.tsx b/src/layout/SigneeList/SigneeStateTag.tsx
index 4aa09e1e5b..e921eaa0d7 100644
--- a/src/layout/SigneeList/SigneeStateTag.tsx
+++ b/src/layout/SigneeList/SigneeStateTag.tsx
@@ -4,6 +4,7 @@ import { Tag } from '@digdir/designsystemet-react';
 import type { TagProps } from '@digdir/designsystemet-react';
 
 import { Lang } from 'src/features/language/Lang';
+import classes from 'src/layout/SigneeList/SigningStateTag.module.css';
 import type { SigneeState } from 'src/layout/SigneeList/api';
 
 export const SIGNEE_STATUS = {
@@ -53,6 +54,7 @@ export function SigneeStateTag({ state }: { state: SigneeState }) {
     <Tag
       data-color={color}
       data-size='sm'
+      className={classes.stateTag}
     >
       <Lang id={SIGNEE_STATUS[status]} />
     </Tag>
diff --git a/src/layout/SigneeList/SigningStateTag.module.css b/src/layout/SigneeList/SigningStateTag.module.css
new file mode 100644
index 0000000000..b3e5abe899
--- /dev/null
+++ b/src/layout/SigneeList/SigningStateTag.module.css
@@ -0,0 +1,3 @@
+.stateTag {
+  max-width: 100%;
+}
diff --git a/src/layout/SigningDocumentList/SigningDocumentListComponent.module.css b/src/layout/SigningDocumentList/SigningDocumentListComponent.module.css
index 261345ec07..8efbbf93e3 100644
--- a/src/layout/SigningDocumentList/SigningDocumentListComponent.module.css
+++ b/src/layout/SigningDocumentList/SigningDocumentListComponent.module.css
@@ -1,6 +1,6 @@
 .downloadLink {
   display: flex;
-  gap: 0.5rem;
-  white-space: nowrap;
+  gap: var(--ds-size-1);
+  align-items: center;
   text-decoration: none;
 }