From 0b853e0a54a97250cc44de5ec6fb72ab710ad3ea Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <fabio@manganiello.tech>
Date: Sun, 30 Apr 2023 01:17:54 +0200
Subject: [PATCH] Apply `word-break: break-all` to entities' names and values.

The entity name and value in the component header may be arbitrarily
long and rendered on small screens.

We therefore need to ensure that the text won't overflow the screen
width.
---
 .../http/webapp/src/components/panels/Entities/Entity.vue    | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue
index 954c1c2fc..4eb2dbbb2 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Entity.vue
@@ -221,6 +221,7 @@ export default {
   .head {
     .name {
       display: inline-flex;
+      word-break: break-all;
 
       &:hover {
         color: $hover-fg;
@@ -231,6 +232,10 @@ export default {
       margin-left: 0.5em;
     }
 
+    .value {
+      word-break: break-all;
+    }
+
     .icon:hover {
       color: $hover-fg;
     }