From eb6b50e0ca150a34a6fd4769bfe740f0ff501799 Mon Sep 17 00:00:00 2001
From: Liam Fitzgerald <liam@urizen.co>
Date: Wed, 29 Apr 2020 13:29:09 +1000
Subject: [PATCH] chat-js: truncate nicknames in autocomplete

---
 pkg/interface/chat/src/js/components/lib/ship-search.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/pkg/interface/chat/src/js/components/lib/ship-search.js b/pkg/interface/chat/src/js/components/lib/ship-search.js
index e820e462ec..250fc0dcbf 100644
--- a/pkg/interface/chat/src/js/components/lib/ship-search.js
+++ b/pkg/interface/chat/src/js/components/lib/ship-search.js
@@ -20,6 +20,7 @@ function ShipSearchItem({ ship, contacts, selected, onSelect }) {
     nameStyle.color = hexToRgba(hex, 0.7);
     nameStyle.textShadow = '0px 0px 0px #000';
     nameStyle.filter = 'contrast(1.3) saturate(1.5)';
+    nameStyle.maxWidth = '200px';
     sigilClass = 'v-mid';
     nickname = contact.nickname;
   }
@@ -28,7 +29,7 @@ function ShipSearchItem({ ship, contacts, selected, onSelect }) {
     <div
       onClick={() => onSelect(ship)}
       className={cn(
-        'f8 pv1 ph3 pointer hover-bg-gray1-d hover-bg-gray4 relative flex items-center',
+        'f9 pv1 ph3 pointer hover-bg-gray1-d hover-bg-gray4 relative flex items-center',
         {
           'white-d bg-gray0-d bg-white': !isSelected,
           'black-d bg-gray1-d bg-gray4': isSelected
@@ -38,7 +39,7 @@ function ShipSearchItem({ ship, contacts, selected, onSelect }) {
     >
       <Sigil ship={'~' + ship} size={24} color={color} classes={sigilClass} />
       {nickname && (
-        <p style={nameStyle} className="dib ml4 b">
+        <p style={nameStyle} className="dib ml4 b truncate">
           {nickname}
         </p>
       )}