Merge pull request #45 from TomPlum/develop

fix(table): fixed commit message padding

Author: TomPlum

packages/library/package.json

@@ -3,7 +3,7 @@
   "author": "Thomas Plumpton",
   "repository": "https://github.com/TomPlum/react-git-log",
   "description": "A flexible, themable, React component for visualising Git commit history, branch and tag metadata.",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "license": "Apache-2.0",
   "type": "module",
   "main": "dist/react-git-log.js",

packages/library/src/__snapshots__/GitLog.spec.tsx.snap

@@ -42603,7 +42603,7 @@ exports[`GitLog > should render correctly and match the snapshot of the GitLog c
             class="message"
             data-testid="react-git-log-table-data-commit-message-0"
             id="react-git-log-table-data-commit-message-0"
-            style="line-height: 40px; color: rgb(153, 153, 153); background: linear-gradient( to bottom, transparent 2px, transparent 2px, transparent 38px, transparent 38px );"
+            style="line-height: 40px; color: rgb(153, 153, 153); background: linear-gradient( to bottom, transparent 2px, transparent 2px, transparent 38px, transparent 38px ); display: flex;"
             title="// WIP"
           >
             // WIP
@@ -100502,7 +100502,7 @@ exports[`GitLog > should render correctly and match the snapshot of the GitLog c
             class="message"
             data-testid="react-git-log-table-data-commit-message-0"
             id="react-git-log-table-data-commit-message-0"
-            style="line-height: 40px; color: rgb(153, 153, 153); background: linear-gradient( to bottom, transparent 2px, transparent 2px, transparent 38px, transparent 38px );"
+            style="line-height: 40px; color: rgb(153, 153, 153); background: linear-gradient( to bottom, transparent 2px, transparent 2px, transparent 38px, transparent 38px ); display: flex;"
             title="// WIP"
           >
             // WIP
@@ -216427,7 +216427,7 @@ exports[`GitLog > should render correctly and match the snapshot of the GitLog c
             class="message"
             data-testid="react-git-log-table-data-commit-message-0"
             id="react-git-log-table-data-commit-message-0"
-            style="line-height: 40px; color: rgb(153, 153, 153); background: linear-gradient( to bottom, transparent 6px, transparent 6px, transparent 34px, transparent 34px );"
+            style="line-height: 40px; color: rgb(153, 153, 153); display: flex; background: linear-gradient( to bottom, transparent 6px, transparent 6px, transparent 34px, transparent 34px );"
             title="// WIP"
           >
             // WIP

packages/library/src/modules/Table/components/CommitMessageData/CommitMessageData.module.scss

@@ -5,5 +5,4 @@
   padding-right: 30px;
   padding-left: 20px;
   font-weight: 400;
-  display: flex;
 }

packages/library/src/modules/Table/components/CommitMessageData/CommitMessageData.tsx

@@ -5,10 +5,10 @@ import { IndexStatus } from 'modules/Table/components/IndexStatus'
 export const CommitMessageData = ({ index, isIndex, commitMessage, style }: CommitMessageDataProps) => {
   return (
     <div
-      style={style}
       title={commitMessage}
       className={styles.message}
       id={`react-git-log-table-data-commit-message-${index}`}
+      style={{ ...style, display: isIndex ? 'flex' : undefined }}
       data-testid={`react-git-log-table-data-commit-message-${index}`}
     >
       {commitMessage}