fix name overflow if long name has no space

LoV432 · Jan 12, 2024 · ab5c802 · ab5c802
1 parent 6733cb4
commit ab5c802
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/app/components/ConfirmationModals.tsx b/app/components/ConfirmationModals.tsx
@@ -20,7 +20,7 @@ export function ConfirmationModal({
 				<h3 className="pb-5 text-lg font-bold capitalize">
 					{modalName} Player
 				</h3>
-				<p>
+				<p className='break-all'>
 					Are you sure you want to {modalName} "{playerName}"?
 				</p>
 				<button onClick={modalAction} className="btn btn-error mt-5 w-full">
@@ -67,7 +67,7 @@ export function ConfirmationModalWithInput({
 				<h3 className="pb-5 text-lg font-bold capitalize">
 					{modalName} Player
 				</h3>
-				<p>
+				<p className='break-all'>
 					Are you sure you want to {modalName} "{playerName}"?
 				</p>
 				<input

diff --git a/app/components/ServerPlayers.tsx b/app/components/ServerPlayers.tsx
@@ -99,7 +99,7 @@ function PlayerRow({
 			<td>{player.ping}</td>
 			<td className="hidden sm:table-cell">{player.loss}</td>
 			<td>
-				<p className="line-clamp-1">{player.name}</p>
+				<p className="line-clamp-1 break-all">{player.name}</p>
 			</td>
 			<td className="hidden sm:table-cell">{player.adr.split(':')[0]}</td>
 			{maxMindIsEnabled && (
@@ -163,7 +163,7 @@ function AllUserDataPopUp({
 	}
 	return (
 		<dialog ref={userDataModal} className="modal">
-			<div className="modal-box w-fit bg-zinc-900">
+			<div className="modal-box bg-zinc-900">
 				<div className="overflow-x-auto">
 					<table className="table">
 						<tbody>
@@ -175,7 +175,7 @@ function AllUserDataPopUp({
 								<th>Loss</th>
 								<td>{selectedPlayer.loss}</td>
 							</tr>
-							<tr className="table-row sm:hidden">
+							<tr className="table-row sm:hidden break-all">
 								<th>Name</th>
 								<td>{selectedPlayer.name}</td>
 							</tr>