From 2b195652a5fecc83fdb2d752350c3f630c82ca5c Mon Sep 17 00:00:00 2001
From: Bobby <bobby@fiery.me>
Date: Tue, 28 Jun 2022 08:57:49 +0700
Subject: [PATCH] fix: long file names in dashboard preview dialogs

---
 src/css/style.scss  | 4 ++++
 src/js/dashboard.js | 4 ++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/css/style.scss b/src/css/style.scss
index 3aeb8cd..cc4808a 100644
--- a/src/css/style.scss
+++ b/src/css/style.scss
@@ -245,6 +245,10 @@ fieldset[disabled] .select select:hover {
   }
 }
 
+.has-word-break-all {
+  word-break: break-all
+}
+
 /** Fontello overrides **/
 
 .icon-gauge::before {
diff --git a/src/js/dashboard.js b/src/js/dashboard.js
index 22b2deb..908b39d 100644
--- a/src/js/dashboard.js
+++ b/src/js/dashboard.js
@@ -952,8 +952,8 @@ page.displayPreview = id => {
   div.innerHTML = `
     <div class="content has-text-centered">
       <p>
-        <div class="has-text-weight-bold">${file.name}</div>
-        <div>${file.original}</div>
+        <div class="has-text-weight-bold has-word-break-all">${file.name}</div>
+        <div class="has-word-break-all">${file.original}</div>
       </p>
       ${file.thumb
         ? `<p class="swal-display-thumb-container">