From 8d816ed2fe3aed9d73f95547d742c65e09a84f78 Mon Sep 17 00:00:00 2001
From: vallode <18506096+vallode@users.noreply.github.com>
Date: Tue, 21 Jun 2022 03:49:45 +0200
Subject: [PATCH] Fix channel names being cut off (#2292)

---
 .../ft-channel-bubble/ft-channel-bubble.css     | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css b/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css
index fc4e51d7..940f3a26 100644
--- a/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css
+++ b/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css
@@ -1,9 +1,14 @@
 .bubblePadding {
   position: relative;
   width: 100px;
-  height: 115px;
+  height: 100px;
   padding: 10px;
   cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  overflow: hidden;
   -webkit-transition: background 0.2s ease-out;
   -moz-transition: background 0.2s ease-out;
   -o-transition: background 0.2s ease-out;
@@ -20,10 +25,8 @@
 .bubble {
   width: 50px;
   height: 50px;
-  margin-bottom: 5px;
-  margin-left: 25px;
-  border-radius: 200px 200px 200px 200px;
-  -webkit-border-radius: 200px 200px 200px 200px;
+  border-radius: 100%;
+  -webkit-border-radius: 100%;
 }
 
 .selected {
@@ -41,8 +44,10 @@
 }
 
 .channelName {
+  display: block;
   font-size: 13px;
-  height: 60px;
   overflow: hidden;
   text-align: center;
+  text-overflow: ellipsis;
+  width: 100%;
 }