From 3191f3d89e1f6b5c30fe2eaf726ffca9621ddb3c Mon Sep 17 00:00:00 2001
From: Harsh Mahajan <127186841+HarshMN2345@users.noreply.github.com>
Date: Sun, 4 Jan 2026 14:15:37 +0530
Subject: [PATCH] fix: improve mobile table display for domain verification

---
 src/lib/components/domains/cnameTable.svelte  | 20 +++++++++-----
 src/lib/components/domains/recordTable.svelte | 26 ++++++++++++-------
 2 files changed, 29 insertions(+), 17 deletions(-)

diff --git a/src/lib/components/domains/cnameTable.svelte b/src/lib/components/domains/cnameTable.svelte
index b198524da..9569ce89f 100644
--- a/src/lib/components/domains/cnameTable.svelte
+++ b/src/lib/components/domains/cnameTable.svelte
@@ -35,16 +35,22 @@
         </Typography.Text>
     </Layout.Stack>
 
-    <Table.Root columns={3} let:root>
+    <Table.Root
+        columns={[
+            { id: 'type', width: { min: 150 } },
+            { id: 'name', width: { min: 80 } },
+            { id: 'value', width: { min: 100 } }
+        ]}
+        let:root>
         <svelte:fragment slot="header" let:root>
-            <Table.Header.Cell {root}>Type</Table.Header.Cell>
-            <Table.Header.Cell {root}>Name</Table.Header.Cell>
-            <Table.Header.Cell {root}>Value</Table.Header.Cell>
+            <Table.Header.Cell column="type" {root}>Type</Table.Header.Cell>
+            <Table.Header.Cell column="name" {root}>Name</Table.Header.Cell>
+            <Table.Header.Cell column="value" {root}>Value</Table.Header.Cell>
         </svelte:fragment>
         <Table.Row.Base {root}>
-            <Table.Cell {root}>CNAME</Table.Cell>
-            <Table.Cell {root}>{subdomain}</Table.Cell>
-            <Table.Cell {root}>
+            <Table.Cell column="type" {root}>CNAME</Table.Cell>
+            <Table.Cell column="name" {root}>{subdomain}</Table.Cell>
+            <Table.Cell column="value" {root}>
                 <InteractiveText
                     variant="copy"
                     isVisible
diff --git a/src/lib/components/domains/recordTable.svelte b/src/lib/components/domains/recordTable.svelte
index 29a131368..6dc145e35 100644
--- a/src/lib/components/domains/recordTable.svelte
+++ b/src/lib/components/domains/recordTable.svelte
@@ -101,29 +101,35 @@
         </Typography.Text>
     </Layout.Stack>
 
-    <Table.Root columns={3} let:root>
+    <Table.Root
+        columns={[
+            { id: 'type', width: { min: 150 } },
+            { id: 'name', width: { min: 80 } },
+            { id: 'value', width: { min: 100 } }
+        ]}
+        let:root>
         <svelte:fragment slot="header" let:root>
-            <Table.Header.Cell {root}>Type</Table.Header.Cell>
-            <Table.Header.Cell {root}>Name</Table.Header.Cell>
-            <Table.Header.Cell {root}>Value</Table.Header.Cell>
+            <Table.Header.Cell column="type" {root}>Type</Table.Header.Cell>
+            <Table.Header.Cell column="name" {root}>Name</Table.Header.Cell>
+            <Table.Header.Cell column="value" {root}>Value</Table.Header.Cell>
         </svelte:fragment>
         <Table.Row.Base {root}>
-            <Table.Cell {root}>{variant.toUpperCase()}</Table.Cell>
-            <Table.Cell {root}>{subdomain || '@'}</Table.Cell>
-            <Table.Cell {root}>
+            <Table.Cell column="type" {root}>{variant.toUpperCase()}</Table.Cell>
+            <Table.Cell column="name" {root}>{subdomain || '@'}</Table.Cell>
+            <Table.Cell column="value" {root}>
                 <InteractiveText variant="copy" isVisible text={setTarget()} />
             </Table.Cell>
         </Table.Row.Base>
         {#if $regionalConsoleVariables._APP_DOMAIN_TARGET_CAA}
             <Table.Row.Base {root}>
-                <Table.Cell {root}>
+                <Table.Cell column="type" {root}>
                     <Layout.Stack gap="s" direction="row" alignItems="center">
                         <span>CAA</span>
                         <Badge variant="secondary" size="xs" content="Recommended" />
                     </Layout.Stack>
                 </Table.Cell>
-                <Table.Cell {root}>@</Table.Cell>
-                <Table.Cell {root}>
+                <Table.Cell column="name" {root}>@</Table.Cell>
+                <Table.Cell column="value" {root}>
                     <InteractiveText variant="copy" isVisible text={caaText} />
                 </Table.Cell>
             </Table.Row.Base>