fix(ui): improve playlist details layout with word break and stats styling

Signed-off-by: Deluan <deluan@navidrome.org>

ui/src/playlist/PlaylistDetails.jsx

@@ -69,9 +69,14 @@ const useStyles = makeStyles(
       opacity: 0.5,
     },
     title: {
-      whiteSpace: 'nowrap',
       overflow: 'hidden',
       textOverflow: 'ellipsis',
+      wordBreak: 'break-word',
+    },
+    stats: {
+      marginTop: '1em',
+      marginBottom: '0.5em',
+      display: 'inline-block',
     },
   }),
   {
@@ -143,7 +148,7 @@ const PlaylistDetails = (props) => {
             >
               {record.name || translate('ra.page.loading')}
             </Typography>
-            <Typography component="p">
+            <Typography component="p" className={classes.stats}>
               {record.songCount ? (
                 <span>
                   {record.songCount}{' '}