From d4d1adccbae1abc7a736f5bb7961bc3959026fd1 Mon Sep 17 00:00:00 2001
From: Hridaya Sharma <sharma.hridaya14@gmail.com>
Date: Tue, 26 Nov 2024 20:17:32 +0530
Subject: [PATCH] feat(VDataTable): prevent overflow in mobile data tables

Add a new class to the mobile data table to prevent overflow on small screens.

closes #19781
---
 .../vuetify/src/components/VDataTable/VDataTable.sass     | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/packages/vuetify/src/components/VDataTable/VDataTable.sass b/packages/vuetify/src/components/VDataTable/VDataTable.sass
index 8789632346d..c7eb7297c72 100644
--- a/packages/vuetify/src/components/VDataTable/VDataTable.sass
+++ b/packages/vuetify/src/components/VDataTable/VDataTable.sass
@@ -133,6 +133,14 @@
     text-align: center
 
   .v-data-table__tr--mobile
+
+    .v-data-table__td-value 
+      white-space: nowrap
+      overflow: hidden
+      text-overflow: ellipsis
+      max-width: 100%
+      width: 100%
+    
     > .v-data-table__td--expanded-row
       grid-template-columns: 0
       justify-content: center