From 0eab4e79437e61d3f0a12cbd2bab415d5f856df0 Mon Sep 17 00:00:00 2001
From: Matteo Bossi <matteo@encodo.ch>
Date: Fri, 2 Jun 2023 15:46:43 +0200
Subject: [PATCH] Fix Mobile view

---
 src/widgets/radarr/component.jsx | 4 +++-
 src/widgets/sonarr/component.jsx | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/widgets/radarr/component.jsx b/src/widgets/radarr/component.jsx
index 4e53ef9af..2e58bf9d4 100644
--- a/src/widgets/radarr/component.jsx
+++ b/src/widgets/radarr/component.jsx
@@ -61,7 +61,9 @@ export default function Component({ service }) {
           {Array.isArray(queueDetailsData) ? queueDetailsData.map((queueEntry) => (
             <div className="my-0.5 w-full flex flex-col justify-between items-center" key={queueEntry.movieId}>
               <div className="h-6 w-full flex flex-row justify-between items-center">
-                <div className="overflow-ellipsis whitespace-nowrap overflow-hidden w-3/4 text-left">{moviesData.all.find((entry) => entry.id === queueEntry.movieId)?.title}</div>
+                <div className="w-full mr-5 overflow-hidden">
+                  <div className="whitespace-nowrap w-0 text-left">{moviesData.all.find((entry) => entry.id === queueEntry.movieId)?.title}</div>
+                </div>
                 <div>{formatDownloadState(queueEntry.trackedDownloadState)}</div>
               </div>
               <div className="h-6 w-full flex flex-row justify-between items-center">
diff --git a/src/widgets/sonarr/component.jsx b/src/widgets/sonarr/component.jsx
index 9a0f98ae4..ee548b582 100644
--- a/src/widgets/sonarr/component.jsx
+++ b/src/widgets/sonarr/component.jsx
@@ -60,7 +60,9 @@ export default function Component({ service }) {
           {Array.isArray(queueDetailsData) ? queueDetailsData.map((queueEntry) => (
             <div className="my-0.5 w-full flex flex-col justify-between items-center" key={queueEntry.episodeId}>
               <div className="h-6 w-full flex flex-row justify-between items-center">
-                <div className="overflow-ellipsis whitespace-nowrap overflow-hidden w-3/4 text-left">{seriesData.find((entry) => entry.id === queueEntry.seriesId).title} • {queueEntry.episodeTitle}</div>
+                <div className="w-full mr-5 overflow-hidden">
+                  <div className="whitespace-nowrap text-left w-0">{seriesData.find((entry) => entry.id === queueEntry.seriesId).title} • {queueEntry.episodeTitle}</div>
+                </div>
                 <div>{formatDownloadState(queueEntry.trackedDownloadState)}</div>
               </div>
               <div className="h-6 w-full flex flex-row justify-between items-center">