From 5c0eb1e6a67497baae9642f036ec2824f5806e8d Mon Sep 17 00:00:00 2001
From: domyen <dom@hichroma.com>
Date: Tue, 4 Aug 2020 20:01:28 -0400
Subject: [PATCH] move break-word styling to the right place and add comments
 in code for later

---
 lib/components/src/blocks/ArgsTable/ArgValue.tsx  | 1 +
 lib/components/src/blocks/ArgsTable/ArgsTable.tsx | 6 ++++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/lib/components/src/blocks/ArgsTable/ArgValue.tsx b/lib/components/src/blocks/ArgsTable/ArgValue.tsx
index f83eb6dbad3..d166c887a73 100644
--- a/lib/components/src/blocks/ArgsTable/ArgValue.tsx
+++ b/lib/components/src/blocks/ArgsTable/ArgValue.tsx
@@ -22,6 +22,7 @@ interface ArgSummaryProps {
 const Text = styled.span(({ theme }) => ({
   fontFamily: theme.typography.fonts.mono,
   fontSize: theme.typography.size.s1,
+  wordBreak: 'break-word',
 }));
 
 const Expandable = styled.div<{}>(codeCommon, ({ theme }) => ({
diff --git a/lib/components/src/blocks/ArgsTable/ArgsTable.tsx b/lib/components/src/blocks/ArgsTable/ArgsTable.tsx
index da0d4ac66af..76110f925d9 100644
--- a/lib/components/src/blocks/ArgsTable/ArgsTable.tsx
+++ b/lib/components/src/blocks/ArgsTable/ArgsTable.tsx
@@ -48,16 +48,17 @@ export const TableWrapper = styled.table<{ compact?: boolean; inAddonPanel?: boo
         ...(compact
           ? null
           : {
+              // Description column
               width: '35%',
             }),
       },
 
-      'th:nth-of-type(3), td:nth-of-type(3)': {
+      'td:nth-of-type(3)': {
         ...(compact
           ? null
           : {
+              // Defaults column
               width: '15%',
-              wordBreak: 'break-all',
             }),
       },
 
@@ -66,6 +67,7 @@ export const TableWrapper = styled.table<{ compact?: boolean; inAddonPanel?: boo
         ...(compact
           ? null
           : {
+              // Controls column
               width: '25%',
             }),
       },