client: add word break for query log domains

AdguardTeam · Aug 1, 2022 · 753bd44 · 753bd44
1 parent 41f081d
commit 753bd44
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/client/src/components/Logs/Cells/DomainCell.js b/client/src/components/Logs/Cells/DomainCell.js
@@ -147,11 +147,11 @@ const DomainCell = ({
             />
             <div className={valueClass}>
                 {unicodeName ? (
-                    <div className="text-truncate" title={unicodeName}>
+                    <div className="text-truncate overflow-break-mobile" title={unicodeName}>
                         {unicodeName}
                     </div>
                 ) : (
-                    <div className="text-truncate" title={domain}>
+                    <div className="text-truncate overflow-break-mobile" title={domain}>
                         {domain}
                     </div>
                 )}

diff --git a/client/src/components/Logs/Cells/IconTooltip.css b/client/src/components/Logs/Cells/IconTooltip.css
@@ -19,6 +19,13 @@
     overflow-wrap: break-word;
 }
 
+@media (max-width: 991.98px) {
+    .overflow-break-mobile {
+        white-space: normal !important;
+        overflow-wrap: break-word;
+    }
+}
+
 .grid {
     display: grid;
     grid-template-columns: repeat(2, min-content);