fix(code): use monospace font for commit hash (#33307)

elastic · Mar 20, 2019 · b3a2927 · b3a2927
1 parent 14c282a
commit b3a2927
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 13 deletions.
diff --git a/x-pack/plugins/code/public/components/main/commit_history.tsx b/x-pack/plugins/code/public/components/main/commit_history.tsx
@@ -34,15 +34,6 @@ const Header = styled.div`
   justify-content: space-between;
 `;
 
-const CommitId = styled.div`
-  height: calc(20rem / 14);
-  margin: auto 0;
-  text-align: center;
-  flex-shrink: 0;
-`;
-
-const CommitContainer = styled.div``;
-
 const Commit = (props: { commit: CommitInfo; date: string; repoUri: string }) => {
   const { date, commit } = props;
   const { message, committer, id } = commit;
@@ -52,7 +43,7 @@ const Commit = (props: { commit: CommitInfo; date: string; repoUri: string }) =>
     .join('');
   return (
     <EuiPanel className="code-timeline__commit--root">
-      <CommitContainer>
+      <div>
         <EuiText size="s">
           <p>{message}</p>
         </EuiText>
@@ -61,10 +52,10 @@ const Commit = (props: { commit: CommitInfo; date: string; repoUri: string }) =>
             {committer} · {date}
           </EuiTextColor>
         </EuiText>
-      </CommitContainer>
-      <CommitId>
+      </div>
+      <div className="code-commit-id">
         <CommitLink repoUri={props.repoUri} commit={commitId} />
-      </CommitId>
+      </div>
     </EuiPanel>
   );
 };

diff --git a/x-pack/plugins/code/public/components/main/main.scss b/x-pack/plugins/code/public/components/main/main.scss
@@ -271,3 +271,11 @@
 .code-no-min-width {
   min-width: unset !important;
 }
+
+.code-commit-id {
+  @include euiCodeFont;
+  height: calc(20rem / 14);
+  margin: auto 0;
+  text-align: center;
+  flex-shrink: 0;
+}