From d1323307fb99e600e54373b6cc55ea05b5c2597e Mon Sep 17 00:00:00 2001
From: Valentin Kaelin <kalanehd@gmail.com>
Date: Sat, 26 Sep 2020 21:45:46 +0200
Subject: [PATCH] fix(champions): prevent full kda text from wrapping

---
 .../components/Summoner/Champions/ChampionsTable.vue   | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/client/src/components/Summoner/Champions/ChampionsTable.vue b/client/src/components/Summoner/Champions/ChampionsTable.vue
index 12df5a6..46ebf8f 100644
--- a/client/src/components/Summoner/Champions/ChampionsTable.vue
+++ b/client/src/components/Summoner/Champions/ChampionsTable.vue
@@ -13,7 +13,9 @@
           @click="sortBy(heading.props)"
           v-html="heading.name"
           :class="[
-            {'rounded-tr-lg': index === headings.length - 1, 'w-name': heading.name === 'Name'}, 
+            {'rounded-tr-lg': index === headings.length - 1,
+             'w-name': heading.name === 'Name',
+             'w-kda': heading.name === 'KDA'}, 
             sortedClasses(heading.props)
           ]"
           class="relative px-2 py-4 font-normal cursor-pointer hover:bg-blue-700"
@@ -57,7 +59,7 @@
         >{{ champion.count }}</td>
         <td :style="bgColor(champion, 'kda')" class="px-2 py-3 text-sm text-white">
           <div>{{ champion.kda|round }}</div>
-          <div class="mt-1 text-blue-200 text-xxs">
+          <div class="mt-1 text-blue-200 whitespace-no-wrap text-xxs">
             {{ champion.kills/champion.count|round(1) }}
             /
             {{ champion.deaths/champion.count|round(1) }}
@@ -344,4 +346,8 @@ export default {
 .w-name {
   width: 135px;
 }
+
+.w-kda {
+  width: 90px;
+}
 </style>